kit icon indicating copy to clipboard operation
kit copied to clipboard

Focus not reset when navigating away from page with `autofocus`

Open geoffrich opened this issue 3 years ago • 1 comments

Describe the bug

If a page has an autofocus element, navigating away from it will incorrectly focus the autofocus element on the origin page.

Reproduction

Stackblitz

  1. Click on "Page 1" link in nav. The input on the destination page is automatically focused since it has autofocus.
  2. Click back to "Home". You'll see that the autofocus input is still the active element, even though it is not currently on the page. Depending on the browser and what is on the new page, your focus may start midway down the page when tabbing instead of starting at the top.

If you click between "Home" and "Page 2" instead (which does not have an autofocus attribute), focus is reset to the body as expected.

Logs

No response

System Info

System:
    OS: Linux 5.0 undefined
    CPU: (8) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
    Memory: 0 Bytes / 0 Bytes
    Shell: 1.0 - /bin/jsh
  Binaries:
    Node: 16.14.2 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 7.17.0 - /usr/local/bin/npm
  npmPackages:
    @sveltejs/adapter-auto: ^1.0.0 => 1.0.0 
    @sveltejs/kit: ^1.0.0 => 1.0.10 
    svelte: ^3.54.0 => 3.55.0 
    vite: ^4.0.0 => 4.0.4

Severity

serious, but I can work around it

Additional Information

No response

geoffrich avatar Jan 10 '23 15:01 geoffrich

This is kind of strange - document.activeElement is reset to the body, but seemingly by the browser, but the focus event doesn't fire. I guess we need to trigger it manually.

dummdidumm avatar Jan 11 '23 20:01 dummdidumm