open-ui icon indicating copy to clipboard operation
open-ui copied to clipboard

[Popup spec] Define in finer detail processing of autofocus and delegatesfocus attrs for popup

Open melanierichards opened this issue 3 years ago • 3 comments

On https://github.com/MicrosoftEdge/MSEdgeExplainers/issues/435, @tlouisse asked:

  • Would it also work for shadow dom content?
<popup>
  #shadow-root
  <button autofocus></button>
</popup>
  • What would happen when both host and child apply autofocus (or delegatefocus and autfocus)?
<popup autofocus>
  <button autofocus></button>
</popup>
<popup delegatefocus>
  <button></button>
  <button autofocus></button>
</popup>
  • And what when content is being rendered asynchronously, right after show (since this does not work on first meaningful paint for current autofocus when rendered with a template engine like lit-html)?

Finer details on processing these attributes should be written up in spec text, or should reference existing details in the HTML spec.

melanierichards avatar Apr 12 '21 21:04 melanierichards

<popup>
  #shadow-root
  <button autofocus></button>
</popup>

I believe this should work but paging @mfreed7 in case anything has come up in popup prototyping.

<popup autofocus>
  <button autofocus></button>
</popup>

Per the spec details on autofocus this should be invalid use of the attribute. From my reading on dialog I believe the spec indicates that the button would take precedence, but it seems Chromium will focus the dialog first.

<popup delegatefocus>
  <button></button>
  <button autofocus></button>
</popup>

IMHO autofocus should take precedence as it is a more specific indication of author intent, but we should discuss this point.

And what when content is being rendered asynchronously, right after show (since this does not work on first meaningful paint for current autofocus when rendered with a template engine like lit-html)?

dialog runs focusing steps when the dialog is shown; we should follow similar behavior for popup. I'd say it would be better to pre-populate contents or if they must hydrated after show, manage focus explicitly in script.

melanierichards avatar Apr 12 '21 21:04 melanierichards

Thanks @melanierichards

tlouisse avatar Apr 13 '21 10:04 tlouisse

There hasn't been any discussion on this issue for a while, so we're marking it as stale. If you choose to kick off the discussion again, we'll remove the 'stale' label.

github-actions[bot] avatar Mar 19 '22 00:03 github-actions[bot]

My HTML spec PR uses get focus delegate for popover initial focus, which was thoroughly designed by domenic and handles the autofocus attribute as well as shadowroots with delegatesfocus. This issue can be closed

josepharhar avatar Nov 30 '22 23:11 josepharhar