260772 2023-08-26 10:42:57 -0700 AX: Slot elements referenced with aria-labelledby not matching rendered output 2026-01-20 08:11:41 -0800 1 1 1 Unclassified WebKit Accessibility WebKit Nightly Build All All RESOLVED FIXED InRadar P2 Normal --- 148695 1 clshortfuse tyler_w andresg_22 cfleizach rniwa steverep+webkit tyler_w webkit-bug-importer oldest_to_newest 1973783 0 clshortfuse 2023-08-26 10:42:57 -0700 When using fallback content for slots, Safari appears to use `innerText` slot. When fallback nodes are used, these always override the slotted content. Hidden nodes are also, incorrectly, part of the AXLabel. Testcase: <body> <script> function componentFromFragment(name, fragment) { return customElements.define(name, class extends HTMLElement { constructor() { super(); this.attachShadow({ mode: "open", delegatesFocus: true }); this.shadowRoot.append(document.createRange().createContextualFragment(fragment).cloneNode(true)); } }) } componentFromFragment("x-button", ` <input aria-labelledby=slot type=button><slot id=slot></slot> `); componentFromFragment("x-button-fallback", ` <input aria-labelledby=slot type=button><slot id=slot><span>Fallback</span></slot> `); componentFromFragment("x-button-hidden", ` <input aria-labelledby=slot type=button><slot id=slot><span style="display:none">Hidden</span></slot> `); </script> <x-button>Slotted</x-button> <x-button>Slotted<span style="display:none">Hidden</span></x-button> <x-button-fallback>Slotted</x-button-fallback> <x-button-fallback></x-button-fallback> <x-button-hidden>Slotted</x-button-hidden> <x-button-hidden></x-button-hidden> </body> expected: ['Slotted', 'Slotted', 'Slotted', 'Fallback', 'Slotted', '' ] actual: ['Slotted', 'Slotted Hidden', 'Fallback', 'Fallback', 'Hidden', 'Hidden'] CodePen: https://codepen.io/shortfuse/pen/yLGYWwp Related: https://bugs.webkit.org/show_bug.cgi?id=254934 This is working properly in Chrome and Firefox (nightly/116) 1973784 1 webkit-bug-importer 2023-08-26 10:43:04 -0700 <rdar://problem/114500560> 1995955 2 steverep+webkit 2023-11-30 12:23:52 -0800 Would this be fixed by https://bugs.webkit.org/show_bug.cgi?id=264410? 2005348 3 clshortfuse 2024-01-16 12:49:43 -0800 It doesn't appear fixed in Safari 17.4 (and whatever nightly Playwright is using), so I'm still relying on Mutation Observers on light DOM to work around. You can observe for character data and rewrite the contents as aria-label and it will work: https://github.com/clshortfuse/materialdesignweb/blob/76c686238605dba16f293063071fdeabad46be18/mixins/ControlMixin.js#L178 https://github.com/clshortfuse/materialdesignweb/blob/76c686238605dba16f293063071fdeabad46be18/mixins/ControlMixin.js#L100C4-L100C4 IIRC Safari 17.0 may have fixed using slotted content in general, but the issue of using fallback content in <slot> elements is still read as well as visually hidden nodes. The disconnect between what's rendered and the AXLabel still exists. 2173045 4 tyler_w 2026-01-19 07:50:49 -0800 Pull request: https://github.com/WebKit/WebKit/pull/56835 2173329 5 ews-feeder 2026-01-20 08:11:38 -0800 Committed 305882@main (dfd051863e02): <https://commits.webkit.org/305882@main> Reviewed commits have been landed. Closing PR #56835 and removing active labels.