Typo in axe extension for Rule ID: list

[KB55]

Product: axe Extension Expectation: Correctly describe how to fix the issue Actual: Typo in the text Motivation: The typo has caused confusion and caused developers to look in the wrong place for the error

Extension version: v4.32.0 axe-core version: v4.4.2 Chrome browser version 103.0.5060.134 (Official Build) (64-bit)

In the axe extension an error has been identified for:

Rule ID: list Ruleset: axe-core 4.4 <ul> and <ol> must only directly contain <li>, <script> or <template> elements

The issue was triggered because a <span> was nested within a <ul>. The extension says:

Fix the following: List element has direct children that are not allowed inside <li> elements

I believe this is a typo and that it should say:

List element has direct children that are not allowed inside <ul> elements

The rule is concerned with errors due to incorrect direct children of <ul> and <ol> elements, not <li> elements and therefore this fix shown in the extension is misleading.

Screenshots attached:

• Axe issue
• Axe issue description
• Code for issue

[straker]

Thanks for the issue. I can see where the confusion is. I'll talk to @WilcoFiers about it and we'll see what we can do.

[WilcoFiers]

Agreed, this is wrong. only-listitems and only-dlitems need to be updated. Thank you for raising this.

[padmavemulapati]

Validated with the latest axe-core develop branch code base, with the test script:

<ul id="scriptproperul">
    <script></script>
    <template></template>
    <li>One.</li>
    <li>Two.</li>
  </ul>
  <ul class="sample"></ul>
  <ol id="emptyol"></ol>
  <ol id="scriptemptyol">
    <dd id="uncontained">Should belong to a list.</dd>
<dt id="alsouncontained">Should belong to a list.</dt>
<dl>
  <dt id="contained">Does belong to a list.</dt>
  <dd id="alsocontained">Also belongs to a list.</dd>
  <div>
    <dt id="grouped">Grouped in a div.</dt>
    <dd id="alsogrouped">Also grouped in a div.</dd>
  </div>
  <div role="main">
    <dt id="incorrectlygrouped">Grouped in a div with role.</dt>
    <dd id="alsoincorrectlygrouped">Also grouped in a div with role.</dd>
  </div>
</dl>
<dl role="menubar">
  <dt id="uncontainedbyrole">Not part of a list.</dt>
  <dd id="alsouncontainedbyrole">Also not part of a list.</dd>
</dl>
    <script></script>
    <template></template>
  </ol>
  <ol id="divol">
    <div>This shouldn't be here.</div>
  </ol>

Seeing dlitem and list failures with the fix message as:

"Fix all of the following:
  dl element has direct children that are not allowed: [role=main]"

"Fix all of the following:
  List element has direct children that are not allowed: dd, dt, dl, [role=menubar]"

"Fix all of the following:
  List element has direct children that are not allowed: div"