Code of conduct
Impacted component(s)
sp-dialog, sp-dialog-base, sp-overlay
Library version
1.7.0
Expected behavior
When a dialog opens, focus should always be placed on the first focusable element inside the content area (non-slotted button), regardless of where slot="button" elements appear in the DOM order. Footer buttons should be deprioritized for initial focus.
Actual behavior
Focus lands on the slot="button" element if it appears before focusable content in the DOM, rather than the focusable content element.
Screenshots
What browsers are you seeing the problem in?
Chrome
How can we reproduce this issue?
Reproduction sandbox: https://stackblitz.com/edit/vitejs-vite-r7ip6q1y?file=package.json
POC: LrWeb Claire Wu yitongw@adobe.com
Sample code or abstract reproduction which illustrates the problem
<sp-dialog>
<h2 slot="heading">Title</h2>
<sp-button slot="button">Close</sp-button>
<sp-textfield></sp-textfield> // This is not auto-focused in this case
</sp-dialog>
https://stackblitz.com/edit/vitejs-vite-r7ip6q1y?file=package.json,src%2Fmy-element.ts,src%2Findex.css
Severity
None
Logs taken while reproducing problem
No response
Would you like to track this issue in Jira?
Code of conduct
Impacted component(s)
sp-dialog, sp-dialog-base, sp-overlay
Library version
1.7.0
Expected behavior
When a dialog opens, focus should always be placed on the first focusable element inside the content area (non-slotted button), regardless of where slot="button" elements appear in the DOM order. Footer buttons should be deprioritized for initial focus.
Actual behavior
Focus lands on the slot="button" element if it appears before focusable content in the DOM, rather than the focusable content element.
Screenshots
What browsers are you seeing the problem in?
Chrome
How can we reproduce this issue?
Reproduction sandbox: https://stackblitz.com/edit/vitejs-vite-r7ip6q1y?file=package.json
POC: LrWeb Claire Wu yitongw@adobe.com
Sample code or abstract reproduction which illustrates the problem
https://stackblitz.com/edit/vitejs-vite-r7ip6q1y?file=package.json,src%2Fmy-element.ts,src%2Findex.css
Severity
None
Logs taken while reproducing problem
No response
Would you like to track this issue in Jira?