[Webkit-unassigned] [Bug 260772] New: AX: Slot elements referenced with aria-labelledby not matching rendered output

Sat Aug 26 10:42:57 PDT 2023

https://bugs.webkit.org/show_bug.cgi?id=260772

            Bug ID: 260772
           Summary: AX: Slot elements referenced with aria-labelledby not
                    matching rendered output
           Product: WebKit
           Version: WebKit Nightly Build
          Hardware: All
                OS: All
            Status: NEW
          Severity: Normal
          Priority: P2
         Component: Accessibility
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: clshortfuse at gmail.com
                CC: andresg_22 at apple.com,
                    webkit-bug-importer at group.apple.com

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)

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20230826/a3af9710/attachment.htm>