Bad value “” for attribute “role” on element “div”.

An empty string is not a valid value for the role attribute. Either assign a recognized WAI-ARIA role or remove the attribute entirely.

The role attribute tells browsers and assistive technologies what purpose an element serves in the page. Every value must be a valid ARIA role token defined in the WAI-ARIA specification, such as banner, navigation, alert, dialog, or presentation. When set to an empty string (""), the attribute has no meaningful value, and the W3C validator rejects it.

Some templating engines and JavaScript frameworks conditionally set the role attribute but output an empty string when no role applies. In those cases, the fix is to either omit the attribute altogether or conditionally render it only when a valid role is available.

If the element does not need an explicit ARIA role, remove the attribute. Native HTML elements like <nav>, <header>, <main>, and <aside> already carry implicit roles, so adding role to them is usually unnecessary.

HTML examples

Invalid: empty role attribute

<div role="">
  <p>Some content</p>
</div>

Fixed: remove the attribute or assign a valid role

Remove the attribute when no specific role is needed:

<div>
  <p>Some content</p>
</div>

Or assign a valid ARIA role:

<div role="alert">
  <p>Something went wrong.</p>
</div>

Learn more:

MDN Reference

ARIA Roles - MDN Web Docs

→

MDN Reference

HTML div Element - MDN Web Docs

→

MDN Reference

Using ARIA - MDN Web Docs

→