Skip to content

Search modal loses focus when first clicked in input #9295

@leocsi

Description

@leocsi

Describe the bug

This only happens when the page is first loaded/reloaded. The component in question is the search bar on the top of the page. When I click in there, it brings up the search box in the middle of the screen. After typing one letter, this loses focus, and typing more letters will not be input,before manually clicking into the box. After escaping out of this box and clicking in the search bar on top of the page again, the box now works fine, without losing focus.
However, if I refresh the page, the issue starts again. Not a major thing, just slightly annoying.

Reproduction

  1. Go to Svelte main page (or any other page with a search bar on top I think).
  2. Click in search bar on top.
  3. Observe search box losing focus after first letter typed.
  4. Escape search box.
  5. Click in search bar again.
  6. Search box now works well without losing focus.
  7. Refresh page.
  8. Repeat from step 2.

Logs

Autofocus processing was blocked because a document already has a focused element.

System Info

System:
    OS: Windows 10 10.0.22621
    CPU: (8) x64 Intel(R) Core(TM) i5-8265U CPU @ 1.60GHz
    Memory: 1.72 GB / 7.85 GB
  Binaries:
    Node: 18.12.1 - C:\Program Files\nodejs\node.EXE
    npm: 8.19.2 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Spartan (44.22621.2283.0), Chromium (117.0.2045.36)

Severity

annoyance

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions