[Bug]: Combobox Accessibility bug, aria-required-children

[Yash5044]

Library

React / v8 (@fluentui/react)

System Info

Package version: @fluentui/react: 8.110.5
Browser: Microsoft Edge

Are you reporting Accessibility issue?

yes

Reproduction

https://developer.microsoft.com/en-us/fluentui#/controls/web/combobox

Bug Description

Repro steps:

1. Check this codepen implementation (https://codepen.io/yash5044/pen/zYMZwxw) or go to the first example here https://developer.microsoft.com/en-us/fluentui#/controls/web/combobox
2. Run accessibility insights web test for fast pass to get aria-required-children failure.

Actual Behavior

Implementation of FluentUI Combobox is failing the accessibility insights web test for fast pass. Screenshots attached:

Expected Behavior

The fast pass check should be passed without any failures.

About the failure: https://accessibilityinsights.io/info-examples/web/aria-required-children/
Fluent UI component: https://developer.microsoft.com/en-us/fluentui#/controls/web/combobox

Logs

Title: WCAG 1.3.1: Ensures elements with an ARIA role that require child roles contain them (#ComboBox862-list)
Tags: Accessibility, WCAG 1.3.1, aria-required-children

Issue: Ensures elements with an ARIA role that require child roles contain them (aria-required-children - https://accessibilityinsights.io/info-examples/web/aria-required-children)

Target application: Fluent UI - Controls - React - ComboBox - https://developer.microsoft.com/en-us/fluentui#/controls/web/combobox

Element path: #ComboBox862-list

Snippet: <div id="ComboBox862-list" class="ms-ComboBox-optionsContainer css-405" aria-labelledby="ComboBox862-label" aria-multiselectable="true" role="listbox">

Related paths: 
  .ms-ComboBox-divider
  #ComboBox862-list1-label
  #ComboBox862-list2-label
  #ComboBox862-list3-label
  #ComboBox862-list4-label
  #ComboBox862-list7-label
  #ComboBox862-list8-label
  #ComboBox862-list9-label
  #ComboBox862-list10-label
  #ComboBox862-list11-label
  #ComboBox862-list12-label
  label[for="ComboBox862-list1"] > .checkbox-437.ms-Checkbox-checkbox[data-ktp-target="true"] > .checkmark-445.ms-Checkbox-checkmark[data-icon-name="CheckMark"]
  label[for="ComboBox862-list2"] > .checkbox-437.ms-Checkbox-checkbox[data-ktp-target="true"] > .checkmark-445.ms-Checkbox-checkmark[data-icon-name="CheckMark"]
  .checkmark-449
  label[for="ComboBox862-list4"] > .checkbox-437.ms-Checkbox-checkbox[data-ktp-target="true"] > .checkmark-445.ms-Checkbox-checkmark[data-icon-name="CheckMark"]
  label[for="ComboBox862-list7"] > .checkbox-437.ms-Checkbox-checkbox[data-ktp-target="true"] > .checkmark-445.ms-Checkbox-checkmark[data-icon-name="CheckMark"]
  .checkmark-455
  label[for="ComboBox862-list9"] > .checkbox-437.ms-Checkbox-checkbox[data-ktp-target="true"] > .checkmark-445.ms-Checkbox-checkmark[data-icon-name="CheckMark"]
  label[for="ComboBox862-list10"] > .checkbox-437.ms-Checkbox-checkbox[data-ktp-target="true"] > .checkmark-445.ms-Checkbox-checkmark[data-icon-name="CheckMark"]
  label[for="ComboBox862-list11"] > .checkbox-437.ms-Checkbox-checkbox[data-ktp-target="true"] > .checkmark-445.ms-Checkbox-checkmark[data-icon-name="CheckMark"]
  label[for="ComboBox862-list12"] > .checkbox-437.ms-Checkbox-checkbox[data-ktp-target="true"] > .checkmark-445.ms-Checkbox-checkmark[data-icon-name="CheckMark"]

How to fix: 
Fix any of the following:
  Element has children which are not allowed (see related nodes)
  Element has no aria-busy="true" attribute

Environment: Microsoft Edge version 114.0.1823.58

====

This accessibility issue was found using Accessibility Insights for Web 2.38.1 (axe-core 4.6.3), a tool that helps find and fix accessibility issues. Get more information & download this tool at http://aka.ms/AccessibilityInsights.

Requested priority

Blocking

Products/sites affected

No response

Are you willing to submit a PR to fix?

yes

Validations

• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• The provided reproduction is a minimal reproducible example of the bug.

[behowell]

This is a false positive by Accessibility Insights. The items under Related Paths that it's complaining about all have aria-hidden="true". They are not in the accessibility tree and should not be triggering this error.

The issue in axe-core is logged here: dequelabs/axe-core#3850

It is fixed in axe-core v4.7.1, but Accessibility Insights is still using v4.6.3.