Skip to content

Algolia search modal appears when entering a keyboard shortcut to use a browser's "Find" function #10333

@josh-wong

Description

@josh-wong

Have you read the Contributing Guidelines on issues?

Prerequisites

  • I'm using the latest version of Docusaurus.
  • I have tried the npm run clear or yarn clear command.
  • I have tried rm -rf node_modules yarn.lock package-lock.json and re-installing packages.
  • I have tried creating a repro with https://new.docusaurus.io.
  • I have read the console error message carefully (if applicable).

Description

When using Algolia search, if a user selects an anchor link (links that show # or ) in the search modal, the modal is displayed again when the user enters a keyboard shortcut (⌘ + F on macOS; Ctrl + F on Windows) to use the browser's "Find" function. The issue doesn't occur when selecting a link to a page without an anchor (pages with the page icon).

Note

We are currently on Docusaurus 3.2.1 in production and want to upgrade to Docusaurus 3.4.0, which fixes #10162 that we had encountered. But we have halted upgrading for now because both 3.2.1 and 3.4.0 have different issues related to the Algolia search modal, which is why I don't have an environment for this. However, this issue can be reproduced on the latest version (3.4.0) of the Docusaurus docs site, as shown in the video below. (Sorry for the low-quality video; GitHub requires videos to be 10 MB or less.)

docusaurus-algolia-search-find-function-bug-480p.mov

In addition, when the user presses ⌘ + F on macOS; Ctrl + F on Windows, an f is added to the search, which causes f to appear as a keyword that has been searched for in the Algolia dashboard.

Reproducible demo

See attached video.

Steps to reproduce

  1. Select the Algolia search bar. When the modal opens, enter a search phrase.
  2. Select an anchor link (# or ) to navigate to that page.
  3. On that page, press ⌘ + F on macOS or Ctrl + F on Windows. The page will open the Algolia search modal instead of the browser's "Find" function and add an f to the search.
  4. Close the modal.
  5. Press ⌘ + F on macOS or Ctrl + F on Windows again. The page will open the browser's "Find" function as expected.

Expected behavior

After selecting an anchor link (links that show # or ) in the search modal, pressing ⌘ + F on macOS or Ctrl + F on Windows should display the browser's "Find" function instead of the Algolia modal.

Actual behavior

After selecting an anchor link (links that show # or ) in the search modal, the modal is displayed again when the user uses the browser's "Find" function (⌘ + F on macOS; Ctrl + F on Windows).

Your environment

Self-service

  • I'd be willing to fix this bug myself.

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugAn error in the Docusaurus core causing instability or issues with its executiondomain: searchRelated to the search feature, usually Algolia

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions