Best practice for SSO login flows

The guidance in https://developer.1password.com/docs/web/compatible-website-design is helpful for forms that render both username/email and password fields at once.

The guidance is less helpful for SSO-enabled flows, where there is a check between entering a username/email and either prompting for a password, or performing a redirect to the SSO provider. An example of this style of login flow is shown below.

When updating an existing login form to be SSO-aware, I experienced unexpected differences in the browser extension's behavior between localhost and deployed environments. The browser extension worked as expected on localhost: it offered autocompletion options if the username input was autofocused with just a username input in the document (no visually hidden password field), and it automatically submitted the form when the password field appeared when no SSO redirect was needed. 

In a deployed environment, the extension only offered autocompletion options if a visually hidden password field was present, and it did not automatically submit the form when no SSO redirect was needed. This was unexpected, especially since some websites, such as Ramp's login page shown above, work fine without a hidden password input. If there is some advanced logic that determines the expected behavior (e.g. localhost vs deployed), it would be helpful to know this too.