svelte-todomvc
svelte-todomvc copied to clipboard
A11y warning: Avoid using autofocus
When running the application, a warning appears in the console:
rollup v1.7.3
bundles src/main.js → public/bundle.js...
(!) svelte plugin: A11y: Avoid using autofocus
src/TodoMVC.svelte
92: on:keydown={createNew}
93: placeholder="What needs to be done?"
94: autofocus
^
95: >
96: </header>
src/TodoMVC.svelte
117: on:keydown={handleEdit}
118: on:blur={submit}
119: autofocus
^
120: >
121: {/if}
created public/bundle.js in 369ms
[2019-10-13 10:47:46] waiting for changes...
Seems there is some argument over it, https://github.com/sveltejs/svelte/issues/6629, because it is not browser-native (it is handled by Svelte explicitly calling focus). The solutions are server-side rendering and letting the browser handle it, or else carefully customizing behavior based on device characteristics like in https://github.com/huggingface/chat-ui/pull/183. But mostly, it should just be disabled by adding <!-- svelte-ignore a11y-autofocus -->