aria spec failing in navigation.ftl

• Type: Bug
• Status: Closed
• Resolution: Fixed
• Affects Version/s: 7.2.X, 7.3.X, Master
• Fix Version/s: 7.2.X, Master
• Component/s: Accessibility
• Labels:
  • INACTIVE
  • ee-ts
  • liferay-fixpack-dxp-9-7210
• Branch Version/s:
  7.2.x
• Backported to Branch:
  Committed
• Fix Priority: 3
• Git Pull Request: https://github.com/liferay-frontend/liferay-portal/pull/399

Upon running the source code from /web/guest/home through an online validator like https://validator.w3.org/nu/#textarea, the following error is displayed:

Error: Element div is missing one or more of the following attributes: role.

According to the spec:

If a grouping container that can be expanded or collapsed is not owned by the element that has the aria-expanded attribute, the author SHOULD identify the controlling relationship by referencing the container from the element that has aria-expanded with the aria-controls property.

Since the grouping container is not owned by the div, we should explicitly add role="button" to resolve the issue. 

STEPS TO REPRODUCE
Start Liferay
Go to http://localhost:8080/web/guest/home
Copy the source code and paste into the text area of the site https://validator.w3.org/nu/#textarea (NU is a tool from w3.org to validate html and other markup languages) and select the check button.

EXPECTED RESULTS
No errors
ACTUAL RESULTS
Site reports errors

MASTER
Reproduced
5716441fca620535c7852c88e269d109b7ca0bd9