6.4.1: something removes autofocus from all inputs

[Hypnosphi]

Reproduction: https://github.com/Hypnosphi/storybook-autofocus

It's probably something non-react, because react devtools still show autoFocus: true:

[Hypnosphi]

Looks like the problem is that React tries to focus the input while <div id="root"> is hidden by these styles: https://github.com/storybookjs/storybook/blob/next/lib/core-common/src/templates/base-preview-head.html#L10

@tmeasday can we maybe reconsider this?

[tmeasday]

Ok, this has come up in a couple contexts, interesting about the autofocus @Hypnosphi.

The change I made here was fixing what was clearly an unintended bug (.sb-main didn't exist):

However, I guess the problem is that (at least the React) framework(s) don't call showMain before rendering the story. I'm not really sure anyone knows what the correct semantics for this should be. I'm a bit reticent to change the showMain behaviour in the frameworks outside of a major version bump.

@shilman what do you think we should do? One option would be to make the "loading story" spinner an overlay over the story, so we don't need to hide the story while preparing. Then we could go back to the old "broken" behaviour of having the story always be visible.

[tmeasday]

cc @MichaelArestad

[shilman]

@tmeasday I agree that reverting the change and hacking an overlay is the safest path here!

[shilman]

w00t!! I just released https://github.com/storybookjs/storybook/releases/tag/v6.4.3 containing PR #16850 that references this issue. Upgrade today to the @latest NPM tag to try it out!

npx sb upgrade

Closing this issue. Please re-open if you think there's still more to do.