Bug 1834886

Summary: Machine details page missing <dl> for proper structure
Product: OpenShift Container Platform Reporter: Jessie <jhuff>
Component: Management ConsoleAssignee: Jessie <jhuff>
Status: CLOSED ERRATA QA Contact: Yadan Pei <yapei>
Severity: medium Docs Contact:
Priority: unspecified    
Version: 4.5CC: aos-bugs, hasha, jokerman, spadgett
Target Milestone: ---   
Target Release: 4.5.0   
Hardware: Unspecified   
OS: Unspecified   
Whiteboard:
Fixed In Version: Doc Type: If docs needed, set a value
Doc Text:
Story Points: ---
Clone Of: Environment:
Last Closed: 2020-07-13 17:37:59 UTC Type: Bug
Regression: --- Mount Type: ---
Documentation: --- CRM:
Verified Versions: Category: ---
oVirt Team: --- RHEL 7.3 requirements from Atomic Host:
Cloudforms Team: --- Target Upstream Version:
Embargoed:
Attachments:
Description Flags
Machine Details page error none

Description Jessie 2020-05-12 15:27:48 UTC
Created attachment 1687731 [details]
Machine Details page error

The machine details page is missing a number of <dl>s in the definition lists structure. The parent dl element ensures the list follows the proper hierarchy. This help screen reader users know what they are listening to, and what to expect as they listen to definition lists with regard to the organizational relationship of parent and child items. (https://dequeuniversity.com/rules/axe/3.5/dlitem?application=AxeChrome)

It currently has the following axe error:
{
    "data": null,
    "id": "dlitem",
    "impact": "serious",
    "message": "Description list item does not have a <dl> parent element",
    "relatedNodes": [
      {
        "html": "<dt>Phase</dt>"
      }
    ]
  },
  {
    "data": null,
    "id": "dlitem",
    "impact": "serious",
    "message": "Description list item does not have a <dl> parent element",
    "relatedNodes": [
      {
        "html": "<dd>"
      }
    ]
  },
  {
    "data": null,
    "id": "dlitem",
    "impact": "serious",
    "message": "Description list item does not have a <dl> parent element",
    "relatedNodes": [
      {
        "html": "<dt>Provider State</dt>"
      }
    ]
  },
  {
    "data": null,
    "id": "dlitem",
    "impact": "serious",
    "message": "Description list item does not have a <dl> parent element",
    "relatedNodes": [
      {
        "html": "<dd>running</dd>"
      }
    ]
  },
  {
    "data": null,
    "id": "dlitem",
    "impact": "serious",
    "message": "Description list item does not have a <dl> parent element",
    "relatedNodes": [
      {
        "html": "<dt>Node</dt>"
      }
    ]
  },
  {
    "data": null,
    "id": "dlitem",
    "impact": "serious",
    "message": "Description list item does not have a <dl> parent element",
    "relatedNodes": [
      {
        "html": "<dd>"
      }
    ]
  },
  {
    "data": null,
    "id": "dlitem",
    "impact": "serious",
    "message": "Description list item does not have a <dl> parent element",
    "relatedNodes": [
      {
        "html": "<dt>Machine Role</dt>"
      }
    ]
  },
  {
    "data": null,
    "id": "dlitem",
    "impact": "serious",
    "message": "Description list item does not have a <dl> parent element",
    "relatedNodes": [
      {
        "html": "<dd>master</dd>"
      }
    ]
  },
  {
    "data": null,
    "id": "dlitem",
    "impact": "serious",
    "message": "Description list item does not have a <dl> parent element",
    "relatedNodes": [
      {
        "html": "<dt>Instance Type</dt>"
      }
    ]
  },
  {
    "data": null,
    "id": "dlitem",
    "impact": "serious",
    "message": "Description list item does not have a <dl> parent element",
    "relatedNodes": [
      {
        "html": "<dd>m4.xlarge</dd>"
      }
    ]
  },
  {
    "data": null,
    "id": "dlitem",
    "impact": "serious",
    "message": "Description list item does not have a <dl> parent element",
    "relatedNodes": [
      {
        "html": "<dt>Region</dt>"
      }
    ]
  },
  {
    "data": null,
    "id": "dlitem",
    "impact": "serious",
    "message": "Description list item does not have a <dl> parent element",
    "relatedNodes": [
      {
        "html": "<dd>us-east-2</dd>"
      }
    ]
  },
  {
    "data": null,
    "id": "dlitem",
    "impact": "serious",
    "message": "Description list item does not have a <dl> parent element",
    "relatedNodes": [
      {
        "html": "<dt>Availability Zone</dt>"
      }
    ]
  },
  {
    "data": null,
    "id": "dlitem",
    "impact": "serious",
    "message": "Description list item does not have a <dl> parent element",
    "relatedNodes": [
      {
        "html": "<dd>us-east-2a</dd>"
      }
    ]
  },
  {
    "data": null,
    "id": "dlitem",
    "impact": "serious",
    "message": "Description list item does not have a <dl> parent element",
    "relatedNodes": [
      {
        "html": "<dt>Machine Addresses</dt>"
      }
    ]
  },
  {
    "data": null,
    "id": "dlitem",
    "impact": "serious",
    "message": "Description list item does not have a <dl> parent element",
    "relatedNodes": [
      {
        "html": "<dd>"
      }
    ]
  }


How reproducible:
You can see this error by using the Axe Chrome Extension.

Steps to Reproduce:
1. Go to a Machine details page, ex: http://localhost:9000/k8s/ns/openshift-machine-api/machine.openshift.io~v1beta1~Machine/rhamilto-4tprk-master-0 (Or from the navigation menu, select Machines under Compute and then click on any of the options)
2. Open developer tools, go to the axe tab, press analyze
3. Click on the issue "<dt> and <dd> elements must be contained by a <dl>".


Actual results:
Invalid definition list structure

Expected results:
Valid structure that helps screen readers understand context

Comment 3 shahan 2020-05-13 04:56:57 UTC
goto k8s/ns/openshift-machine-api/machine.openshift.io~v1beta1~Machine/qe-groupd-0513-2mgbq-master-0 page, analyze the page with axe, there is no "<dt> and <dd> elements must be contained by a <dl>" error and page works well
4.5.0-0.nightly-2020-05-12-191228

Comment 4 errata-xmlrpc 2020-07-13 17:37:59 UTC
Since the problem described in this bug report should be
resolved in a recent advisory, it has been closed with a
resolution of ERRATA.

For information on the advisory, and where to find the updated
files, follow the link below.

If the solution does not work for you, open a new bug report.

https://access.redhat.com/errata/RHBA-2020:2409