diff --git a/CHANGELOG.md b/CHANGELOG.md
index 4e737112ede..48f0c0b75fc 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -79,6 +79,7 @@ when there are breaking changes.
 - Fix false positive diagnostics that [`useCamelCase`](https://docs.rome.tools/lint/rules/usecamelcase/) caused to private class members
 - Fix false positive diagnostics that [`useHookAtTopLevel`](https://docs.rome.tools/lint/rules/usehookattoplevel/) caused to arrow functions, export default functions and function expressions.
 - Fix false positive diagnostics that [`noHeadeScope`](https://docs.rome.tools/lint/rules/noheaderscope/) caused to custom components
+- Fix false negative diagnostics that [`noNoninteractiveElementToInteractiveRole`](https://docs.rome.tools/lint/rules/nononinteractiveelementtointeractiverole/) and [`noNoninteractiveTabindex`](https://docs.rome.tools/lint/rules/nononinteractivetabindex/) caused to non-interactive elements.
 
 ### Configuration
 ### Editors
diff --git a/crates/rome_aria/src/roles.rs b/crates/rome_aria/src/roles.rs
index ce4d7258180..205e107c2d8 100644
--- a/crates/rome_aria/src/roles.rs
+++ b/crates/rome_aria/src/roles.rs
@@ -324,7 +324,7 @@ define_role! {
     /// https://www.w3.org/TR/wai-aria-1.1/#link
     LinkRole {
         PROPS: [("aria-expanded", false)],
-        ROLES: ["command"],
+        ROLES: ["command", "widget"],
         CONCEPTS: &[("a", &[]), ("link", &[])],
     }
 }
@@ -342,7 +342,7 @@ define_role! {
     /// https://www.w3.org/TR/wai-aria-1.1/#listbox
     ListBoxRole {
         PROPS: [],
-        ROLES: ["select"],
+        ROLES: ["select", "widget"],
         CONCEPTS: &[("select", &[])],
     }
 }
@@ -365,10 +365,11 @@ define_role! {
 }
 
 define_role! {
-    /// https://www.w3.org/TR/wai-aria-1.1/#main
+    /// https://w3c.github.io/aria/#main
     MainRole {
         PROPS: [],
         ROLES: ["landmark"],
+        CONCEPTS: &[("main", &[])],
     }
 }
 
@@ -382,9 +383,17 @@ define_role! {
 
 define_role! {
     /// https://www.w3.org/TR/wai-aria-1.1/#menu
-    MenuItem {
+    MenuRole {
         PROPS: [("aria-posinset", false), ("aria-setsize", false)],
-        ROLES: ["command"],
+        ROLES: ["select"],
+    }
+}
+
+define_role! {
+    /// https://www.w3.org/TR/wai-aria-1.1/#menuitem
+    MenuItemRole {
+        PROPS: [("aria-posinset", false), ("aria-setsize", false)],
+        ROLES: ["command", "widget"],
     }
 }
 
@@ -392,7 +401,7 @@ define_role! {
     /// https://www.w3.org/TR/wai-aria-1.1/#menuitemcheckbox
     MenuItemCheckboxRole {
         PROPS: [("aria-checked", true)],
-        ROLES: ["checkbox", "menuitem"],
+        ROLES: ["checkbox", "menuitem", "widget"],
     }
 }
 
@@ -400,7 +409,7 @@ define_role! {
     /// https://www.w3.org/TR/wai-aria-1.1/#menuitemradio
     MenuItemRadioRole {
         PROPS: [("aria-checked", true)],
-        ROLES: ["radio", "menuitemcheckbox"],
+        ROLES: ["radio", "menuitemcheckbox", "widget"],
     }
 }
 
@@ -417,7 +426,7 @@ define_role! {
     /// https://www.w3.org/TR/wai-aria-1.1/#progressbar
     ProgressBarRole {
         PROPS: [("aria-valuenow", true), ("aria-valuemin", true), ("aria-valuemax", true)],
-        ROLES: ["range"],
+        ROLES: ["range", "widget"],
     }
 }
 define_role! {
@@ -466,7 +475,7 @@ define_role! {
             ("aria-readonly", false),
             ("aria-required", false),
         ],
-        ROLES: ["textbox"],
+        ROLES: ["textbox", "widget"],
         CONCEPTS: &[("input", &[("type", "search")])],
     }
 }
@@ -516,7 +525,7 @@ define_role! {
             ("aria-readonly", false),
             ("aria-required", false),
         ],
-        ROLES: ["input"],
+        ROLES: ["input", "widget"],
         CONCEPTS: &[("textarea", &[]), ("input", &[("type", "search")])],
     }
 }
@@ -547,10 +556,11 @@ define_role! {
 }
 
 define_role! {
-    /// https://www.w3.org/TR/wai-aria-1.2/#complementary
+    /// https://w3c.github.io/aria/#complementary
     ComplementaryRole {
         PROPS: [],
         ROLES: ["landmark"],
+        CONCEPTS: &[("aside", &[])],
     }
 }
 
@@ -564,11 +574,11 @@ define_role! {
 }
 
 define_role! {
-    /// https://www.w3.org/TR/wai-aria-1.2/#caption
+    /// https://w3c.github.io/aria/#caption
     CaptionRole {
         PROPS: [],
         ROLES: ["section"],
-        CONCEPTS: &[("caption", &[]), ("figcaption", &[])],
+        CONCEPTS: &[("caption", &[]), ("figcaption", &[]), ("legend", &[])],
     }
 }
 
@@ -683,6 +693,7 @@ define_role! {
     StatusRole {
         PROPS: [],
         ROLES: ["section"],
+        CONCEPTS: &[("output", &[])],
     }
 }
 
@@ -712,6 +723,42 @@ define_role! {
     }
 }
 
+define_role! {
+    /// https://w3c.github.io/aria/#mark
+    MarkRole {
+        PROPS: [],
+        ROLES: ["section"],
+        CONCEPTS: &[("mark", &[])],
+    }
+}
+
+define_role! {
+    /// https://w3c.github.io/aria/#marquee
+    MarqueeRole {
+        PROPS: [],
+        ROLES: ["section"],
+        CONCEPTS: &[("marquee", &[])],
+    }
+}
+
+define_role! {
+    /// https://w3c.github.io/aria/#associationlist
+    AssociationListRole {
+        PROPS: [],
+        ROLES: ["section"],
+        CONCEPTS: &[("dl", &[])],
+    }
+}
+
+define_role! {
+    /// https://w3c.github.io/aria/#contentinfo
+    ContentInfoRole {
+        PROPS: [],
+        ROLES: ["landmark"],
+        CONCEPTS: &[("footer", &[])],
+    }
+}
+
 impl<'a> AriaRoles {
     /// These are roles that will contain "concepts".
     pub(crate) const ROLE_WITH_CONCEPTS: &'a [&'a str] = &[
@@ -748,6 +795,16 @@ impl<'a> AriaRoles {
         "term",
         "textbox",
         "generic",
+        "caption",
+        "main",
+        "time",
+        "p",
+        "aside",
+        "blockquote",
+        "associationlist",
+        "status",
+        "contentinfo",
+        "region",
     ];
 
     /// It returns the metadata of a role, if it exits.
@@ -801,7 +858,8 @@ impl<'a> AriaRoles {
             "log" => &LogRole as &dyn AriaRoleDefinition,
             "main" => &MainRole as &dyn AriaRoleDefinition,
             "menubar" => &MenubarRole as &dyn AriaRoleDefinition,
-            "menu" => &MenuItem as &dyn AriaRoleDefinition,
+            "menu" => &MenuRole as &dyn AriaRoleDefinition,
+            "menuitem" => &MenuItemRole as &dyn AriaRoleDefinition,
             "menuitemcheckbox" => &MenuItemCheckboxRole as &dyn AriaRoleDefinition,
             "menuitemradio" => &MenuItemRadioRole as &dyn AriaRoleDefinition,
             "navigation" => &NavigationRole as &dyn AriaRoleDefinition,
@@ -962,7 +1020,11 @@ impl<'a> AriaRoles {
     }
 
     /// Given the name of element, the function tells whether it's interactive
-    pub fn is_not_interactive_element(&self, element_name: &str) -> bool {
+    pub fn is_not_interactive_element(
+        &self,
+        element_name: &str,
+        attributes: Option<HashMap<String, Vec<String>>>,
+    ) -> bool {
         // <header> elements do not technically have semantics, unless the
         // element is a direct descendant of <body>, and this crate cannot
         // reliably test that.
@@ -971,6 +1033,26 @@ impl<'a> AriaRoles {
         if element_name == "header" {
             return false;
         }
+
+        let elements_no_concept_info = [
+            "body", "br", "details", "dir", "frame", "iframe", "label", "mark", "marquee", "menu",
+            "meter", "optgroup", "pre", "progress", "ruby",
+        ];
+        if elements_no_concept_info.contains(&element_name) {
+            return true;
+        }
+
+        // <input type="hidden"> is not interactive.
+        // `type=hidden` is not represented as concept information.
+        if element_name == "input"
+            && attributes
+                .as_ref()
+                .and_then(|attributes| attributes.get("type"))
+                .map_or(false, |values| values.iter().any(|x| x == "hidden"))
+        {
+            return true;
+        }
+
         for element in Self::ROLE_WITH_CONCEPTS {
             let role = match *element {
                 "checkbox" => &CheckboxRole as &dyn AriaRoleDefinitionWithConcepts,
@@ -1006,6 +1088,16 @@ impl<'a> AriaRoles {
                 "term" => &TermRole as &dyn AriaRoleDefinitionWithConcepts,
                 "textbox" => &TextboxRole as &dyn AriaRoleDefinitionWithConcepts,
                 "generic" => &GenericRole as &dyn AriaRoleDefinitionWithConcepts,
+                "caption" => &CaptionRole as &dyn AriaRoleDefinitionWithConcepts,
+                "main" => &MainRole as &dyn AriaRoleDefinitionWithConcepts,
+                "time" => &TimeRole as &dyn AriaRoleDefinitionWithConcepts,
+                "p" => &ParagraphRole as &dyn AriaRoleDefinitionWithConcepts,
+                "aside" => &ComplementaryRole as &dyn AriaRoleDefinitionWithConcepts,
+                "blockquote" => &BlockQuoteRole as &dyn AriaRoleDefinitionWithConcepts,
+                "associationlist" => &AssociationListRole as &dyn AriaRoleDefinitionWithConcepts,
+                "status" => &StatusRole as &dyn AriaRoleDefinitionWithConcepts,
+                "contentinfo" => &ContentInfoRole as &dyn AriaRoleDefinitionWithConcepts,
+                "region" => &RegionRole as &dyn AriaRoleDefinitionWithConcepts,
                 _ => return false,
             };
             if let Some(mut concepts) = role.concepts_by_element_name(element_name) {
@@ -1040,14 +1132,29 @@ mod test {
     #[test]
     fn should_be_interactive() {
         let aria_roles = AriaRoles {};
+        assert!(!aria_roles.is_not_interactive_element("header", None));
+        assert!(!aria_roles.is_not_interactive_element("input", {
+            let mut attributes = HashMap::new();
+            attributes.insert("type".to_string(), vec!["search".to_string()]);
+            Some(attributes)
+        }));
+    }
 
-        assert!(!aria_roles.is_not_interactive_element("header"));
-        assert!(aria_roles.is_not_interactive_element("h1"));
-        assert!(aria_roles.is_not_interactive_element("h2"));
-        assert!(aria_roles.is_not_interactive_element("h3"));
-        assert!(aria_roles.is_not_interactive_element("h4"));
-        assert!(aria_roles.is_not_interactive_element("h5"));
-        assert!(aria_roles.is_not_interactive_element("h6"));
+    #[test]
+    fn should_not_be_interactive() {
+        let aria_roles = AriaRoles {};
+        assert!(aria_roles.is_not_interactive_element("h1", None));
+        assert!(aria_roles.is_not_interactive_element("h2", None));
+        assert!(aria_roles.is_not_interactive_element("h3", None));
+        assert!(aria_roles.is_not_interactive_element("h4", None));
+        assert!(aria_roles.is_not_interactive_element("h5", None));
+        assert!(aria_roles.is_not_interactive_element("h6", None));
+        assert!(aria_roles.is_not_interactive_element("body", None));
+        assert!(aria_roles.is_not_interactive_element("input", {
+            let mut attributes = HashMap::new();
+            attributes.insert("type".to_string(), vec!["hidden".to_string()]);
+            Some(attributes)
+        }));
     }
 
     #[test]
diff --git a/crates/rome_js_analyze/src/aria_analyzers/a11y/no_noninteractive_element_to_interactive_role.rs b/crates/rome_js_analyze/src/aria_analyzers/a11y/no_noninteractive_element_to_interactive_role.rs
index 4ea908751e0..88931c681bc 100644
--- a/crates/rome_js_analyze/src/aria_analyzers/a11y/no_noninteractive_element_to_interactive_role.rs
+++ b/crates/rome_js_analyze/src/aria_analyzers/a11y/no_noninteractive_element_to_interactive_role.rs
@@ -69,7 +69,9 @@ impl Rule for NoNoninteractiveElementToInteractiveRole {
             let role_attribute_static_value = role_attribute.as_static_value()?;
             let role_attribute_value = role_attribute_static_value.text();
             let element_name = node.name().ok()?.as_jsx_name()?.value_token().ok()?;
-            if aria_roles.is_not_interactive_element(element_name.text_trimmed())
+
+            let attributes = ctx.extract_attributes(&node.attributes());
+            if aria_roles.is_not_interactive_element(element_name.text_trimmed(), attributes)
                 && aria_roles.is_role_interactive(role_attribute_value)
             {
                 // <div> and <span> are considered neither interactive nor non-interactive, depending on the presence or absence of the role attribute.
@@ -85,7 +87,6 @@ impl Rule for NoNoninteractiveElementToInteractiveRole {
                 });
             }
         }
-
         None
     }
 
diff --git a/crates/rome_js_analyze/src/aria_analyzers/nursery/no_noninteractive_tabindex.rs b/crates/rome_js_analyze/src/aria_analyzers/nursery/no_noninteractive_tabindex.rs
index 9794e4815c8..753da4aff8f 100644
--- a/crates/rome_js_analyze/src/aria_analyzers/nursery/no_noninteractive_tabindex.rs
+++ b/crates/rome_js_analyze/src/aria_analyzers/nursery/no_noninteractive_tabindex.rs
@@ -107,8 +107,9 @@ impl Rule for NoNoninteractiveTabindex {
 
         let element_name = node.name().ok()?.as_jsx_name()?.value_token().ok()?;
         let aria_roles = ctx.aria_roles();
+        let attributes = ctx.extract_attributes(&node.attributes());
 
-        if aria_roles.is_not_interactive_element(element_name.text_trimmed()) {
+        if aria_roles.is_not_interactive_element(element_name.text_trimmed(), attributes) {
             let tabindex_attribute = node.find_attribute_by_name("tabIndex")?;
             let tabindex_attribute_value = tabindex_attribute.initializer()?.value().ok()?;
             if attribute_has_negative_tabindex(&tabindex_attribute_value)? {
diff --git a/crates/rome_js_analyze/tests/specs/a11y/noNoninteractiveElementToInteractiveRole/invalid.jsx b/crates/rome_js_analyze/tests/specs/a11y/noNoninteractiveElementToInteractiveRole/invalid.jsx
index 4b3acc507a3..f75bf1d9de6 100644
--- a/crates/rome_js_analyze/tests/specs/a11y/noNoninteractiveElementToInteractiveRole/invalid.jsx
+++ b/crates/rome_js_analyze/tests/specs/a11y/noNoninteractiveElementToInteractiveRole/invalid.jsx
@@ -1,8 +1,82 @@
-var a = <h1 role="checkbox"></h1>;
-var a = <h1 role="radio"></h1>;
-var a = <h1 role="button"></h1>;
-var a = <h1 role="combobox"></h1>;
-var a = <h1 role="scrollbar"></h1>;
-var a = <h1 role={"scrollbar"}></h1>;
-var a = <h1 role={`scrollbar`}></h1>;
-	var a = <ol role="menuitem" />;
+let a = <h1 role="checkbox"></h1>;
+let a = <h1 role="radio"></h1>;
+let a = <h1 role="button"></h1>;
+let a = <h1 role="combobox"></h1>;
+let a = <h1 role="scrollbar"></h1>;
+let a = <h1 role={"scrollbar"}></h1>;
+let a = <h1 role={`scrollbar`}></h1>;
+let a = <ol role="menuitem" />;
+let a = <main role="button" />;
+let a = <article role="button" />;
+let a = <aside role="button" />;
+let a = <blockquote role="button" />;
+let a = <body role="button" />;
+let a = <br role="button" />;
+let a = <caption role="button" />;
+let a = <dd role="button" />;
+let a = <details role="button" />;
+let a = <dir role="button" />;
+let a = <dl role="button" />;
+let a = <dfn role="button" />;
+let a = <dt role="button" />;
+let a = <fieldset role="button" />;
+let a = <figcaption role="button" />;
+let a = <figure role="button" />;
+let a = <footer role="button" />;
+let a = <form role="button" />;
+let a = <frame role="button" />;
+let a = <h1 role="button" />;
+let a = <h2 role="button" />;
+let a = <h3 role="button" />;
+let a = <h4 role="button" />;
+let a = <h5 role="button" />;
+let a = <h6 role="button" />;
+let a = <iframe role="button" />;
+let a = <img role="button" />;
+let a = <label role="button" />;
+let a = <legend role="button" />;
+let a = <li role="button" />;
+let a = <mark role="button" />;
+let a = <marquee role="button" />;
+let a = <menu role="button" />;
+let a = <meter role="button" />;
+let a = <nav role="button" />;
+let a = <ol role="button" />;
+let a = <optgroup role="button" />;
+let a = <output role="button" />;
+let a = <pre role="button" />;
+let a = <progress role="button" />;
+let a = <ruby role="button" />;
+let a = <table role="button" />;
+let a = <tbody role="button" />;
+let a = <td role="button" />;
+let a = <tfoot role="button" />;
+let a = <thead role="button" />;
+let a = <time role="button" />;
+let a = <ul role="button" />;
+let a = <main role="menuitem" />;
+let a = <article role="menuitem" />;
+let a = <dd role="menuitem" />;
+let a = <dfn role="menuitem" />;
+let a = <dt role="menuitem" />;
+let a = <fieldset role="menuitem" />;
+let a = <figure role="menuitem" />;
+let a = <form role="menuitem" />;
+let a = <frame role="menuitem" />;
+let a = <h1 role="menuitem" />;
+let a = <h2 role="menuitem" />;
+let a = <h3 role="menuitem" />;
+let a = <h4 role="menuitem" />;
+let a = <h5 role="menuitem" />;
+let a = <h6 role="menuitem" />;
+// The <hr> element can be a widget, so there is no need to warn against using it.
+// let a = <hr role="menuitem" />;
+let a = <img role="menuitem" />;
+let a = <nav role="menuitem" />;
+let a = <ol role="menuitem" />;
+let a = <p role="button" />;
+let a = <section role="button" aria-label="Aardletk" />;
+let a = <tbody role="menuitem" />;
+let a = <td role="menuitem" />;
+let a = <tfoot role="menuitem" />;
+let a = <thead role="menuitem" />;
diff --git a/crates/rome_js_analyze/tests/specs/a11y/noNoninteractiveElementToInteractiveRole/invalid.jsx.snap b/crates/rome_js_analyze/tests/specs/a11y/noNoninteractiveElementToInteractiveRole/invalid.jsx.snap
index 08fe44999ba..424e72c9ff1 100644
--- a/crates/rome_js_analyze/tests/specs/a11y/noNoninteractiveElementToInteractiveRole/invalid.jsx.snap
+++ b/crates/rome_js_analyze/tests/specs/a11y/noNoninteractiveElementToInteractiveRole/invalid.jsx.snap
@@ -1,18 +1,91 @@
 ---
 source: crates/rome_js_analyze/tests/spec_tests.rs
-assertion_line: 96
 expression: invalid.jsx
 ---
 # Input
 ```js
-var a = <h1 role="checkbox"></h1>;
-var a = <h1 role="radio"></h1>;
-var a = <h1 role="button"></h1>;
-var a = <h1 role="combobox"></h1>;
-var a = <h1 role="scrollbar"></h1>;
-var a = <h1 role={"scrollbar"}></h1>;
-var a = <h1 role={`scrollbar`}></h1>;
-	var a = <ol role="menuitem" />;
+let a = <h1 role="checkbox"></h1>;
+let a = <h1 role="radio"></h1>;
+let a = <h1 role="button"></h1>;
+let a = <h1 role="combobox"></h1>;
+let a = <h1 role="scrollbar"></h1>;
+let a = <h1 role={"scrollbar"}></h1>;
+let a = <h1 role={`scrollbar`}></h1>;
+let a = <ol role="menuitem" />;
+let a = <main role="button" />;
+let a = <article role="button" />;
+let a = <aside role="button" />;
+let a = <blockquote role="button" />;
+let a = <body role="button" />;
+let a = <br role="button" />;
+let a = <caption role="button" />;
+let a = <dd role="button" />;
+let a = <details role="button" />;
+let a = <dir role="button" />;
+let a = <dl role="button" />;
+let a = <dfn role="button" />;
+let a = <dt role="button" />;
+let a = <fieldset role="button" />;
+let a = <figcaption role="button" />;
+let a = <figure role="button" />;
+let a = <footer role="button" />;
+let a = <form role="button" />;
+let a = <frame role="button" />;
+let a = <h1 role="button" />;
+let a = <h2 role="button" />;
+let a = <h3 role="button" />;
+let a = <h4 role="button" />;
+let a = <h5 role="button" />;
+let a = <h6 role="button" />;
+let a = <iframe role="button" />;
+let a = <img role="button" />;
+let a = <label role="button" />;
+let a = <legend role="button" />;
+let a = <li role="button" />;
+let a = <mark role="button" />;
+let a = <marquee role="button" />;
+let a = <menu role="button" />;
+let a = <meter role="button" />;
+let a = <nav role="button" />;
+let a = <ol role="button" />;
+let a = <optgroup role="button" />;
+let a = <output role="button" />;
+let a = <pre role="button" />;
+let a = <progress role="button" />;
+let a = <ruby role="button" />;
+let a = <table role="button" />;
+let a = <tbody role="button" />;
+let a = <td role="button" />;
+let a = <tfoot role="button" />;
+let a = <thead role="button" />;
+let a = <time role="button" />;
+let a = <ul role="button" />;
+let a = <main role="menuitem" />;
+let a = <article role="menuitem" />;
+let a = <dd role="menuitem" />;
+let a = <dfn role="menuitem" />;
+let a = <dt role="menuitem" />;
+let a = <fieldset role="menuitem" />;
+let a = <figure role="menuitem" />;
+let a = <form role="menuitem" />;
+let a = <frame role="menuitem" />;
+let a = <h1 role="menuitem" />;
+let a = <h2 role="menuitem" />;
+let a = <h3 role="menuitem" />;
+let a = <h4 role="menuitem" />;
+let a = <h5 role="menuitem" />;
+let a = <h6 role="menuitem" />;
+// The <hr> element can be a widget, so there is no need to warn against using it.
+// let a = <hr role="menuitem" />;
+let a = <img role="menuitem" />;
+let a = <nav role="menuitem" />;
+let a = <ol role="menuitem" />;
+let a = <p role="button" />;
+let a = <section role="button" aria-label="Aardletk" />;
+let a = <tbody role="menuitem" />;
+let a = <td role="menuitem" />;
+let a = <tfoot role="menuitem" />;
+let a = <thead role="menuitem" />;
 
 ```
 
@@ -22,10 +95,10 @@ invalid.jsx:1:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━
 
   ! The HTML element h1 is non-interactive and should not have an interactive role.
   
-  > 1 │ var a = <h1 role="checkbox"></h1>;
+  > 1 │ let a = <h1 role="checkbox"></h1>;
       │             ^^^^^^^^^^^^^^^
-    2 │ var a = <h1 role="radio"></h1>;
-    3 │ var a = <h1 role="button"></h1>;
+    2 │ let a = <h1 role="radio"></h1>;
+    3 │ let a = <h1 role="button"></h1>;
   
   i Replace h1 with a div or a span.
   
@@ -37,11 +110,11 @@ invalid.jsx:2:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━
 
   ! The HTML element h1 is non-interactive and should not have an interactive role.
   
-    1 │ var a = <h1 role="checkbox"></h1>;
-  > 2 │ var a = <h1 role="radio"></h1>;
+    1 │ let a = <h1 role="checkbox"></h1>;
+  > 2 │ let a = <h1 role="radio"></h1>;
       │             ^^^^^^^^^^^^
-    3 │ var a = <h1 role="button"></h1>;
-    4 │ var a = <h1 role="combobox"></h1>;
+    3 │ let a = <h1 role="button"></h1>;
+    4 │ let a = <h1 role="combobox"></h1>;
   
   i Replace h1 with a div or a span.
   
@@ -53,12 +126,12 @@ invalid.jsx:3:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━
 
   ! The HTML element h1 is non-interactive and should not have an interactive role.
   
-    1 │ var a = <h1 role="checkbox"></h1>;
-    2 │ var a = <h1 role="radio"></h1>;
-  > 3 │ var a = <h1 role="button"></h1>;
+    1 │ let a = <h1 role="checkbox"></h1>;
+    2 │ let a = <h1 role="radio"></h1>;
+  > 3 │ let a = <h1 role="button"></h1>;
       │             ^^^^^^^^^^^^^
-    4 │ var a = <h1 role="combobox"></h1>;
-    5 │ var a = <h1 role="scrollbar"></h1>;
+    4 │ let a = <h1 role="combobox"></h1>;
+    5 │ let a = <h1 role="scrollbar"></h1>;
   
   i Replace h1 with a div or a span.
   
@@ -70,12 +143,12 @@ invalid.jsx:4:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━
 
   ! The HTML element h1 is non-interactive and should not have an interactive role.
   
-    2 │ var a = <h1 role="radio"></h1>;
-    3 │ var a = <h1 role="button"></h1>;
-  > 4 │ var a = <h1 role="combobox"></h1>;
+    2 │ let a = <h1 role="radio"></h1>;
+    3 │ let a = <h1 role="button"></h1>;
+  > 4 │ let a = <h1 role="combobox"></h1>;
       │             ^^^^^^^^^^^^^^^
-    5 │ var a = <h1 role="scrollbar"></h1>;
-    6 │ var a = <h1 role={"scrollbar"}></h1>;
+    5 │ let a = <h1 role="scrollbar"></h1>;
+    6 │ let a = <h1 role={"scrollbar"}></h1>;
   
   i Replace h1 with a div or a span.
   
@@ -87,12 +160,12 @@ invalid.jsx:5:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━
 
   ! The HTML element h1 is non-interactive and should not have an interactive role.
   
-    3 │ var a = <h1 role="button"></h1>;
-    4 │ var a = <h1 role="combobox"></h1>;
-  > 5 │ var a = <h1 role="scrollbar"></h1>;
+    3 │ let a = <h1 role="button"></h1>;
+    4 │ let a = <h1 role="combobox"></h1>;
+  > 5 │ let a = <h1 role="scrollbar"></h1>;
       │             ^^^^^^^^^^^^^^^^
-    6 │ var a = <h1 role={"scrollbar"}></h1>;
-    7 │ var a = <h1 role={`scrollbar`}></h1>;
+    6 │ let a = <h1 role={"scrollbar"}></h1>;
+    7 │ let a = <h1 role={`scrollbar`}></h1>;
   
   i Replace h1 with a div or a span.
   
@@ -104,12 +177,12 @@ invalid.jsx:6:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━
 
   ! The HTML element h1 is non-interactive and should not have an interactive role.
   
-    4 │ var a = <h1 role="combobox"></h1>;
-    5 │ var a = <h1 role="scrollbar"></h1>;
-  > 6 │ var a = <h1 role={"scrollbar"}></h1>;
+    4 │ let a = <h1 role="combobox"></h1>;
+    5 │ let a = <h1 role="scrollbar"></h1>;
+  > 6 │ let a = <h1 role={"scrollbar"}></h1>;
       │             ^^^^^^^^^^^^^^^^^^
-    7 │ var a = <h1 role={`scrollbar`}></h1>;
-    8 │ 	var a = <ol role="menuitem" />;
+    7 │ let a = <h1 role={`scrollbar`}></h1>;
+    8 │ let a = <ol role="menuitem" />;
   
   i Replace h1 with a div or a span.
   
@@ -121,16 +194,1256 @@ invalid.jsx:7:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━
 
   ! The HTML element h1 is non-interactive and should not have an interactive role.
   
-    5 │ var a = <h1 role="scrollbar"></h1>;
-    6 │ var a = <h1 role={"scrollbar"}></h1>;
-  > 7 │ var a = <h1 role={`scrollbar`}></h1>;
+    5 │ let a = <h1 role="scrollbar"></h1>;
+    6 │ let a = <h1 role={"scrollbar"}></h1>;
+  > 7 │ let a = <h1 role={`scrollbar`}></h1>;
       │             ^^^^^^^^^^^^^^^^^^
-    8 │ 	var a = <ol role="menuitem" />;
-    9 │ 
+    8 │ let a = <ol role="menuitem" />;
+    9 │ let a = <main role="button" />;
   
   i Replace h1 with a div or a span.
   
 
 ```
 
+```
+invalid.jsx:8:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element ol is non-interactive and should not have an interactive role.
+  
+     6 │ let a = <h1 role={"scrollbar"}></h1>;
+     7 │ let a = <h1 role={`scrollbar`}></h1>;
+   > 8 │ let a = <ol role="menuitem" />;
+       │             ^^^^^^^^^^^^^^^
+     9 │ let a = <main role="button" />;
+    10 │ let a = <article role="button" />;
+  
+  i Replace ol with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:9:15 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element main is non-interactive and should not have an interactive role.
+  
+     7 │ let a = <h1 role={`scrollbar`}></h1>;
+     8 │ let a = <ol role="menuitem" />;
+   > 9 │ let a = <main role="button" />;
+       │               ^^^^^^^^^^^^^
+    10 │ let a = <article role="button" />;
+    11 │ let a = <aside role="button" />;
+  
+  i Replace main with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:10:18 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element article is non-interactive and should not have an interactive role.
+  
+     8 │ let a = <ol role="menuitem" />;
+     9 │ let a = <main role="button" />;
+  > 10 │ let a = <article role="button" />;
+       │                  ^^^^^^^^^^^^^
+    11 │ let a = <aside role="button" />;
+    12 │ let a = <blockquote role="button" />;
+  
+  i Replace article with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:11:16 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element aside is non-interactive and should not have an interactive role.
+  
+     9 │ let a = <main role="button" />;
+    10 │ let a = <article role="button" />;
+  > 11 │ let a = <aside role="button" />;
+       │                ^^^^^^^^^^^^^
+    12 │ let a = <blockquote role="button" />;
+    13 │ let a = <body role="button" />;
+  
+  i Replace aside with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:12:21 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element blockquote is non-interactive and should not have an interactive role.
+  
+    10 │ let a = <article role="button" />;
+    11 │ let a = <aside role="button" />;
+  > 12 │ let a = <blockquote role="button" />;
+       │                     ^^^^^^^^^^^^^
+    13 │ let a = <body role="button" />;
+    14 │ let a = <br role="button" />;
+  
+  i Replace blockquote with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:13:15 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element body is non-interactive and should not have an interactive role.
+  
+    11 │ let a = <aside role="button" />;
+    12 │ let a = <blockquote role="button" />;
+  > 13 │ let a = <body role="button" />;
+       │               ^^^^^^^^^^^^^
+    14 │ let a = <br role="button" />;
+    15 │ let a = <caption role="button" />;
+  
+  i Replace body with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:14:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element br is non-interactive and should not have an interactive role.
+  
+    12 │ let a = <blockquote role="button" />;
+    13 │ let a = <body role="button" />;
+  > 14 │ let a = <br role="button" />;
+       │             ^^^^^^^^^^^^^
+    15 │ let a = <caption role="button" />;
+    16 │ let a = <dd role="button" />;
+  
+  i Replace br with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:15:18 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element caption is non-interactive and should not have an interactive role.
+  
+    13 │ let a = <body role="button" />;
+    14 │ let a = <br role="button" />;
+  > 15 │ let a = <caption role="button" />;
+       │                  ^^^^^^^^^^^^^
+    16 │ let a = <dd role="button" />;
+    17 │ let a = <details role="button" />;
+  
+  i Replace caption with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:16:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element dd is non-interactive and should not have an interactive role.
+  
+    14 │ let a = <br role="button" />;
+    15 │ let a = <caption role="button" />;
+  > 16 │ let a = <dd role="button" />;
+       │             ^^^^^^^^^^^^^
+    17 │ let a = <details role="button" />;
+    18 │ let a = <dir role="button" />;
+  
+  i Replace dd with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:17:18 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element details is non-interactive and should not have an interactive role.
+  
+    15 │ let a = <caption role="button" />;
+    16 │ let a = <dd role="button" />;
+  > 17 │ let a = <details role="button" />;
+       │                  ^^^^^^^^^^^^^
+    18 │ let a = <dir role="button" />;
+    19 │ let a = <dl role="button" />;
+  
+  i Replace details with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:18:14 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element dir is non-interactive and should not have an interactive role.
+  
+    16 │ let a = <dd role="button" />;
+    17 │ let a = <details role="button" />;
+  > 18 │ let a = <dir role="button" />;
+       │              ^^^^^^^^^^^^^
+    19 │ let a = <dl role="button" />;
+    20 │ let a = <dfn role="button" />;
+  
+  i Replace dir with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:19:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element dl is non-interactive and should not have an interactive role.
+  
+    17 │ let a = <details role="button" />;
+    18 │ let a = <dir role="button" />;
+  > 19 │ let a = <dl role="button" />;
+       │             ^^^^^^^^^^^^^
+    20 │ let a = <dfn role="button" />;
+    21 │ let a = <dt role="button" />;
+  
+  i Replace dl with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:20:14 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element dfn is non-interactive and should not have an interactive role.
+  
+    18 │ let a = <dir role="button" />;
+    19 │ let a = <dl role="button" />;
+  > 20 │ let a = <dfn role="button" />;
+       │              ^^^^^^^^^^^^^
+    21 │ let a = <dt role="button" />;
+    22 │ let a = <fieldset role="button" />;
+  
+  i Replace dfn with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:21:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element dt is non-interactive and should not have an interactive role.
+  
+    19 │ let a = <dl role="button" />;
+    20 │ let a = <dfn role="button" />;
+  > 21 │ let a = <dt role="button" />;
+       │             ^^^^^^^^^^^^^
+    22 │ let a = <fieldset role="button" />;
+    23 │ let a = <figcaption role="button" />;
+  
+  i Replace dt with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:22:19 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element fieldset is non-interactive and should not have an interactive role.
+  
+    20 │ let a = <dfn role="button" />;
+    21 │ let a = <dt role="button" />;
+  > 22 │ let a = <fieldset role="button" />;
+       │                   ^^^^^^^^^^^^^
+    23 │ let a = <figcaption role="button" />;
+    24 │ let a = <figure role="button" />;
+  
+  i Replace fieldset with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:23:21 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element figcaption is non-interactive and should not have an interactive role.
+  
+    21 │ let a = <dt role="button" />;
+    22 │ let a = <fieldset role="button" />;
+  > 23 │ let a = <figcaption role="button" />;
+       │                     ^^^^^^^^^^^^^
+    24 │ let a = <figure role="button" />;
+    25 │ let a = <footer role="button" />;
+  
+  i Replace figcaption with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:24:17 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element figure is non-interactive and should not have an interactive role.
+  
+    22 │ let a = <fieldset role="button" />;
+    23 │ let a = <figcaption role="button" />;
+  > 24 │ let a = <figure role="button" />;
+       │                 ^^^^^^^^^^^^^
+    25 │ let a = <footer role="button" />;
+    26 │ let a = <form role="button" />;
+  
+  i Replace figure with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:25:17 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element footer is non-interactive and should not have an interactive role.
+  
+    23 │ let a = <figcaption role="button" />;
+    24 │ let a = <figure role="button" />;
+  > 25 │ let a = <footer role="button" />;
+       │                 ^^^^^^^^^^^^^
+    26 │ let a = <form role="button" />;
+    27 │ let a = <frame role="button" />;
+  
+  i Replace footer with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:26:15 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element form is non-interactive and should not have an interactive role.
+  
+    24 │ let a = <figure role="button" />;
+    25 │ let a = <footer role="button" />;
+  > 26 │ let a = <form role="button" />;
+       │               ^^^^^^^^^^^^^
+    27 │ let a = <frame role="button" />;
+    28 │ let a = <h1 role="button" />;
+  
+  i Replace form with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:27:16 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element frame is non-interactive and should not have an interactive role.
+  
+    25 │ let a = <footer role="button" />;
+    26 │ let a = <form role="button" />;
+  > 27 │ let a = <frame role="button" />;
+       │                ^^^^^^^^^^^^^
+    28 │ let a = <h1 role="button" />;
+    29 │ let a = <h2 role="button" />;
+  
+  i Replace frame with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:28:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element h1 is non-interactive and should not have an interactive role.
+  
+    26 │ let a = <form role="button" />;
+    27 │ let a = <frame role="button" />;
+  > 28 │ let a = <h1 role="button" />;
+       │             ^^^^^^^^^^^^^
+    29 │ let a = <h2 role="button" />;
+    30 │ let a = <h3 role="button" />;
+  
+  i Replace h1 with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:29:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element h2 is non-interactive and should not have an interactive role.
+  
+    27 │ let a = <frame role="button" />;
+    28 │ let a = <h1 role="button" />;
+  > 29 │ let a = <h2 role="button" />;
+       │             ^^^^^^^^^^^^^
+    30 │ let a = <h3 role="button" />;
+    31 │ let a = <h4 role="button" />;
+  
+  i Replace h2 with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:30:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element h3 is non-interactive and should not have an interactive role.
+  
+    28 │ let a = <h1 role="button" />;
+    29 │ let a = <h2 role="button" />;
+  > 30 │ let a = <h3 role="button" />;
+       │             ^^^^^^^^^^^^^
+    31 │ let a = <h4 role="button" />;
+    32 │ let a = <h5 role="button" />;
+  
+  i Replace h3 with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:31:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element h4 is non-interactive and should not have an interactive role.
+  
+    29 │ let a = <h2 role="button" />;
+    30 │ let a = <h3 role="button" />;
+  > 31 │ let a = <h4 role="button" />;
+       │             ^^^^^^^^^^^^^
+    32 │ let a = <h5 role="button" />;
+    33 │ let a = <h6 role="button" />;
+  
+  i Replace h4 with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:32:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element h5 is non-interactive and should not have an interactive role.
+  
+    30 │ let a = <h3 role="button" />;
+    31 │ let a = <h4 role="button" />;
+  > 32 │ let a = <h5 role="button" />;
+       │             ^^^^^^^^^^^^^
+    33 │ let a = <h6 role="button" />;
+    34 │ let a = <iframe role="button" />;
+  
+  i Replace h5 with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:33:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element h6 is non-interactive and should not have an interactive role.
+  
+    31 │ let a = <h4 role="button" />;
+    32 │ let a = <h5 role="button" />;
+  > 33 │ let a = <h6 role="button" />;
+       │             ^^^^^^^^^^^^^
+    34 │ let a = <iframe role="button" />;
+    35 │ let a = <img role="button" />;
+  
+  i Replace h6 with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:34:17 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element iframe is non-interactive and should not have an interactive role.
+  
+    32 │ let a = <h5 role="button" />;
+    33 │ let a = <h6 role="button" />;
+  > 34 │ let a = <iframe role="button" />;
+       │                 ^^^^^^^^^^^^^
+    35 │ let a = <img role="button" />;
+    36 │ let a = <label role="button" />;
+  
+  i Replace iframe with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:35:14 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element img is non-interactive and should not have an interactive role.
+  
+    33 │ let a = <h6 role="button" />;
+    34 │ let a = <iframe role="button" />;
+  > 35 │ let a = <img role="button" />;
+       │              ^^^^^^^^^^^^^
+    36 │ let a = <label role="button" />;
+    37 │ let a = <legend role="button" />;
+  
+  i Replace img with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:36:16 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element label is non-interactive and should not have an interactive role.
+  
+    34 │ let a = <iframe role="button" />;
+    35 │ let a = <img role="button" />;
+  > 36 │ let a = <label role="button" />;
+       │                ^^^^^^^^^^^^^
+    37 │ let a = <legend role="button" />;
+    38 │ let a = <li role="button" />;
+  
+  i Replace label with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:37:17 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element legend is non-interactive and should not have an interactive role.
+  
+    35 │ let a = <img role="button" />;
+    36 │ let a = <label role="button" />;
+  > 37 │ let a = <legend role="button" />;
+       │                 ^^^^^^^^^^^^^
+    38 │ let a = <li role="button" />;
+    39 │ let a = <mark role="button" />;
+  
+  i Replace legend with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:38:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element li is non-interactive and should not have an interactive role.
+  
+    36 │ let a = <label role="button" />;
+    37 │ let a = <legend role="button" />;
+  > 38 │ let a = <li role="button" />;
+       │             ^^^^^^^^^^^^^
+    39 │ let a = <mark role="button" />;
+    40 │ let a = <marquee role="button" />;
+  
+  i Replace li with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:39:15 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element mark is non-interactive and should not have an interactive role.
+  
+    37 │ let a = <legend role="button" />;
+    38 │ let a = <li role="button" />;
+  > 39 │ let a = <mark role="button" />;
+       │               ^^^^^^^^^^^^^
+    40 │ let a = <marquee role="button" />;
+    41 │ let a = <menu role="button" />;
+  
+  i Replace mark with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:40:18 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element marquee is non-interactive and should not have an interactive role.
+  
+    38 │ let a = <li role="button" />;
+    39 │ let a = <mark role="button" />;
+  > 40 │ let a = <marquee role="button" />;
+       │                  ^^^^^^^^^^^^^
+    41 │ let a = <menu role="button" />;
+    42 │ let a = <meter role="button" />;
+  
+  i Replace marquee with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:41:15 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element menu is non-interactive and should not have an interactive role.
+  
+    39 │ let a = <mark role="button" />;
+    40 │ let a = <marquee role="button" />;
+  > 41 │ let a = <menu role="button" />;
+       │               ^^^^^^^^^^^^^
+    42 │ let a = <meter role="button" />;
+    43 │ let a = <nav role="button" />;
+  
+  i Replace menu with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:42:16 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element meter is non-interactive and should not have an interactive role.
+  
+    40 │ let a = <marquee role="button" />;
+    41 │ let a = <menu role="button" />;
+  > 42 │ let a = <meter role="button" />;
+       │                ^^^^^^^^^^^^^
+    43 │ let a = <nav role="button" />;
+    44 │ let a = <ol role="button" />;
+  
+  i Replace meter with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:43:14 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element nav is non-interactive and should not have an interactive role.
+  
+    41 │ let a = <menu role="button" />;
+    42 │ let a = <meter role="button" />;
+  > 43 │ let a = <nav role="button" />;
+       │              ^^^^^^^^^^^^^
+    44 │ let a = <ol role="button" />;
+    45 │ let a = <optgroup role="button" />;
+  
+  i Replace nav with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:44:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element ol is non-interactive and should not have an interactive role.
+  
+    42 │ let a = <meter role="button" />;
+    43 │ let a = <nav role="button" />;
+  > 44 │ let a = <ol role="button" />;
+       │             ^^^^^^^^^^^^^
+    45 │ let a = <optgroup role="button" />;
+    46 │ let a = <output role="button" />;
+  
+  i Replace ol with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:45:19 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element optgroup is non-interactive and should not have an interactive role.
+  
+    43 │ let a = <nav role="button" />;
+    44 │ let a = <ol role="button" />;
+  > 45 │ let a = <optgroup role="button" />;
+       │                   ^^^^^^^^^^^^^
+    46 │ let a = <output role="button" />;
+    47 │ let a = <pre role="button" />;
+  
+  i Replace optgroup with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:46:17 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element output is non-interactive and should not have an interactive role.
+  
+    44 │ let a = <ol role="button" />;
+    45 │ let a = <optgroup role="button" />;
+  > 46 │ let a = <output role="button" />;
+       │                 ^^^^^^^^^^^^^
+    47 │ let a = <pre role="button" />;
+    48 │ let a = <progress role="button" />;
+  
+  i Replace output with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:47:14 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element pre is non-interactive and should not have an interactive role.
+  
+    45 │ let a = <optgroup role="button" />;
+    46 │ let a = <output role="button" />;
+  > 47 │ let a = <pre role="button" />;
+       │              ^^^^^^^^^^^^^
+    48 │ let a = <progress role="button" />;
+    49 │ let a = <ruby role="button" />;
+  
+  i Replace pre with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:48:19 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element progress is non-interactive and should not have an interactive role.
+  
+    46 │ let a = <output role="button" />;
+    47 │ let a = <pre role="button" />;
+  > 48 │ let a = <progress role="button" />;
+       │                   ^^^^^^^^^^^^^
+    49 │ let a = <ruby role="button" />;
+    50 │ let a = <table role="button" />;
+  
+  i Replace progress with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:49:15 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element ruby is non-interactive and should not have an interactive role.
+  
+    47 │ let a = <pre role="button" />;
+    48 │ let a = <progress role="button" />;
+  > 49 │ let a = <ruby role="button" />;
+       │               ^^^^^^^^^^^^^
+    50 │ let a = <table role="button" />;
+    51 │ let a = <tbody role="button" />;
+  
+  i Replace ruby with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:50:16 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element table is non-interactive and should not have an interactive role.
+  
+    48 │ let a = <progress role="button" />;
+    49 │ let a = <ruby role="button" />;
+  > 50 │ let a = <table role="button" />;
+       │                ^^^^^^^^^^^^^
+    51 │ let a = <tbody role="button" />;
+    52 │ let a = <td role="button" />;
+  
+  i Replace table with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:51:16 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element tbody is non-interactive and should not have an interactive role.
+  
+    49 │ let a = <ruby role="button" />;
+    50 │ let a = <table role="button" />;
+  > 51 │ let a = <tbody role="button" />;
+       │                ^^^^^^^^^^^^^
+    52 │ let a = <td role="button" />;
+    53 │ let a = <tfoot role="button" />;
+  
+  i Replace tbody with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:52:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element td is non-interactive and should not have an interactive role.
+  
+    50 │ let a = <table role="button" />;
+    51 │ let a = <tbody role="button" />;
+  > 52 │ let a = <td role="button" />;
+       │             ^^^^^^^^^^^^^
+    53 │ let a = <tfoot role="button" />;
+    54 │ let a = <thead role="button" />;
+  
+  i Replace td with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:53:16 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element tfoot is non-interactive and should not have an interactive role.
+  
+    51 │ let a = <tbody role="button" />;
+    52 │ let a = <td role="button" />;
+  > 53 │ let a = <tfoot role="button" />;
+       │                ^^^^^^^^^^^^^
+    54 │ let a = <thead role="button" />;
+    55 │ let a = <time role="button" />;
+  
+  i Replace tfoot with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:54:16 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element thead is non-interactive and should not have an interactive role.
+  
+    52 │ let a = <td role="button" />;
+    53 │ let a = <tfoot role="button" />;
+  > 54 │ let a = <thead role="button" />;
+       │                ^^^^^^^^^^^^^
+    55 │ let a = <time role="button" />;
+    56 │ let a = <ul role="button" />;
+  
+  i Replace thead with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:55:15 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element time is non-interactive and should not have an interactive role.
+  
+    53 │ let a = <tfoot role="button" />;
+    54 │ let a = <thead role="button" />;
+  > 55 │ let a = <time role="button" />;
+       │               ^^^^^^^^^^^^^
+    56 │ let a = <ul role="button" />;
+    57 │ let a = <main role="menuitem" />;
+  
+  i Replace time with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:56:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element ul is non-interactive and should not have an interactive role.
+  
+    54 │ let a = <thead role="button" />;
+    55 │ let a = <time role="button" />;
+  > 56 │ let a = <ul role="button" />;
+       │             ^^^^^^^^^^^^^
+    57 │ let a = <main role="menuitem" />;
+    58 │ let a = <article role="menuitem" />;
+  
+  i Replace ul with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:57:15 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element main is non-interactive and should not have an interactive role.
+  
+    55 │ let a = <time role="button" />;
+    56 │ let a = <ul role="button" />;
+  > 57 │ let a = <main role="menuitem" />;
+       │               ^^^^^^^^^^^^^^^
+    58 │ let a = <article role="menuitem" />;
+    59 │ let a = <dd role="menuitem" />;
+  
+  i Replace main with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:58:18 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element article is non-interactive and should not have an interactive role.
+  
+    56 │ let a = <ul role="button" />;
+    57 │ let a = <main role="menuitem" />;
+  > 58 │ let a = <article role="menuitem" />;
+       │                  ^^^^^^^^^^^^^^^
+    59 │ let a = <dd role="menuitem" />;
+    60 │ let a = <dfn role="menuitem" />;
+  
+  i Replace article with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:59:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element dd is non-interactive and should not have an interactive role.
+  
+    57 │ let a = <main role="menuitem" />;
+    58 │ let a = <article role="menuitem" />;
+  > 59 │ let a = <dd role="menuitem" />;
+       │             ^^^^^^^^^^^^^^^
+    60 │ let a = <dfn role="menuitem" />;
+    61 │ let a = <dt role="menuitem" />;
+  
+  i Replace dd with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:60:14 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element dfn is non-interactive and should not have an interactive role.
+  
+    58 │ let a = <article role="menuitem" />;
+    59 │ let a = <dd role="menuitem" />;
+  > 60 │ let a = <dfn role="menuitem" />;
+       │              ^^^^^^^^^^^^^^^
+    61 │ let a = <dt role="menuitem" />;
+    62 │ let a = <fieldset role="menuitem" />;
+  
+  i Replace dfn with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:61:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element dt is non-interactive and should not have an interactive role.
+  
+    59 │ let a = <dd role="menuitem" />;
+    60 │ let a = <dfn role="menuitem" />;
+  > 61 │ let a = <dt role="menuitem" />;
+       │             ^^^^^^^^^^^^^^^
+    62 │ let a = <fieldset role="menuitem" />;
+    63 │ let a = <figure role="menuitem" />;
+  
+  i Replace dt with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:62:19 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element fieldset is non-interactive and should not have an interactive role.
+  
+    60 │ let a = <dfn role="menuitem" />;
+    61 │ let a = <dt role="menuitem" />;
+  > 62 │ let a = <fieldset role="menuitem" />;
+       │                   ^^^^^^^^^^^^^^^
+    63 │ let a = <figure role="menuitem" />;
+    64 │ let a = <form role="menuitem" />;
+  
+  i Replace fieldset with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:63:17 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element figure is non-interactive and should not have an interactive role.
+  
+    61 │ let a = <dt role="menuitem" />;
+    62 │ let a = <fieldset role="menuitem" />;
+  > 63 │ let a = <figure role="menuitem" />;
+       │                 ^^^^^^^^^^^^^^^
+    64 │ let a = <form role="menuitem" />;
+    65 │ let a = <frame role="menuitem" />;
+  
+  i Replace figure with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:64:15 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element form is non-interactive and should not have an interactive role.
+  
+    62 │ let a = <fieldset role="menuitem" />;
+    63 │ let a = <figure role="menuitem" />;
+  > 64 │ let a = <form role="menuitem" />;
+       │               ^^^^^^^^^^^^^^^
+    65 │ let a = <frame role="menuitem" />;
+    66 │ let a = <h1 role="menuitem" />;
+  
+  i Replace form with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:65:16 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element frame is non-interactive and should not have an interactive role.
+  
+    63 │ let a = <figure role="menuitem" />;
+    64 │ let a = <form role="menuitem" />;
+  > 65 │ let a = <frame role="menuitem" />;
+       │                ^^^^^^^^^^^^^^^
+    66 │ let a = <h1 role="menuitem" />;
+    67 │ let a = <h2 role="menuitem" />;
+  
+  i Replace frame with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:66:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element h1 is non-interactive and should not have an interactive role.
+  
+    64 │ let a = <form role="menuitem" />;
+    65 │ let a = <frame role="menuitem" />;
+  > 66 │ let a = <h1 role="menuitem" />;
+       │             ^^^^^^^^^^^^^^^
+    67 │ let a = <h2 role="menuitem" />;
+    68 │ let a = <h3 role="menuitem" />;
+  
+  i Replace h1 with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:67:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element h2 is non-interactive and should not have an interactive role.
+  
+    65 │ let a = <frame role="menuitem" />;
+    66 │ let a = <h1 role="menuitem" />;
+  > 67 │ let a = <h2 role="menuitem" />;
+       │             ^^^^^^^^^^^^^^^
+    68 │ let a = <h3 role="menuitem" />;
+    69 │ let a = <h4 role="menuitem" />;
+  
+  i Replace h2 with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:68:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element h3 is non-interactive and should not have an interactive role.
+  
+    66 │ let a = <h1 role="menuitem" />;
+    67 │ let a = <h2 role="menuitem" />;
+  > 68 │ let a = <h3 role="menuitem" />;
+       │             ^^^^^^^^^^^^^^^
+    69 │ let a = <h4 role="menuitem" />;
+    70 │ let a = <h5 role="menuitem" />;
+  
+  i Replace h3 with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:69:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element h4 is non-interactive and should not have an interactive role.
+  
+    67 │ let a = <h2 role="menuitem" />;
+    68 │ let a = <h3 role="menuitem" />;
+  > 69 │ let a = <h4 role="menuitem" />;
+       │             ^^^^^^^^^^^^^^^
+    70 │ let a = <h5 role="menuitem" />;
+    71 │ let a = <h6 role="menuitem" />;
+  
+  i Replace h4 with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:70:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element h5 is non-interactive and should not have an interactive role.
+  
+    68 │ let a = <h3 role="menuitem" />;
+    69 │ let a = <h4 role="menuitem" />;
+  > 70 │ let a = <h5 role="menuitem" />;
+       │             ^^^^^^^^^^^^^^^
+    71 │ let a = <h6 role="menuitem" />;
+    72 │ // The <hr> element can be a widget, so there is no need to warn against using it.
+  
+  i Replace h5 with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:71:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element h6 is non-interactive and should not have an interactive role.
+  
+    69 │ let a = <h4 role="menuitem" />;
+    70 │ let a = <h5 role="menuitem" />;
+  > 71 │ let a = <h6 role="menuitem" />;
+       │             ^^^^^^^^^^^^^^^
+    72 │ // The <hr> element can be a widget, so there is no need to warn against using it.
+    73 │ // let a = <hr role="menuitem" />;
+  
+  i Replace h6 with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:74:14 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element img is non-interactive and should not have an interactive role.
+  
+    72 │ // The <hr> element can be a widget, so there is no need to warn against using it.
+    73 │ // let a = <hr role="menuitem" />;
+  > 74 │ let a = <img role="menuitem" />;
+       │              ^^^^^^^^^^^^^^^
+    75 │ let a = <nav role="menuitem" />;
+    76 │ let a = <ol role="menuitem" />;
+  
+  i Replace img with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:75:14 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element nav is non-interactive and should not have an interactive role.
+  
+    73 │ // let a = <hr role="menuitem" />;
+    74 │ let a = <img role="menuitem" />;
+  > 75 │ let a = <nav role="menuitem" />;
+       │              ^^^^^^^^^^^^^^^
+    76 │ let a = <ol role="menuitem" />;
+    77 │ let a = <p role="button" />;
+  
+  i Replace nav with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:76:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element ol is non-interactive and should not have an interactive role.
+  
+    74 │ let a = <img role="menuitem" />;
+    75 │ let a = <nav role="menuitem" />;
+  > 76 │ let a = <ol role="menuitem" />;
+       │             ^^^^^^^^^^^^^^^
+    77 │ let a = <p role="button" />;
+    78 │ let a = <section role="button" aria-label="Aardletk" />;
+  
+  i Replace ol with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:77:12 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element p is non-interactive and should not have an interactive role.
+  
+    75 │ let a = <nav role="menuitem" />;
+    76 │ let a = <ol role="menuitem" />;
+  > 77 │ let a = <p role="button" />;
+       │            ^^^^^^^^^^^^^
+    78 │ let a = <section role="button" aria-label="Aardletk" />;
+    79 │ let a = <tbody role="menuitem" />;
+  
+  i Replace p with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:78:18 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element section is non-interactive and should not have an interactive role.
+  
+    76 │ let a = <ol role="menuitem" />;
+    77 │ let a = <p role="button" />;
+  > 78 │ let a = <section role="button" aria-label="Aardletk" />;
+       │                  ^^^^^^^^^^^^^
+    79 │ let a = <tbody role="menuitem" />;
+    80 │ let a = <td role="menuitem" />;
+  
+  i Replace section with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:79:16 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element tbody is non-interactive and should not have an interactive role.
+  
+    77 │ let a = <p role="button" />;
+    78 │ let a = <section role="button" aria-label="Aardletk" />;
+  > 79 │ let a = <tbody role="menuitem" />;
+       │                ^^^^^^^^^^^^^^^
+    80 │ let a = <td role="menuitem" />;
+    81 │ let a = <tfoot role="menuitem" />;
+  
+  i Replace tbody with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:80:13 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element td is non-interactive and should not have an interactive role.
+  
+    78 │ let a = <section role="button" aria-label="Aardletk" />;
+    79 │ let a = <tbody role="menuitem" />;
+  > 80 │ let a = <td role="menuitem" />;
+       │             ^^^^^^^^^^^^^^^
+    81 │ let a = <tfoot role="menuitem" />;
+    82 │ let a = <thead role="menuitem" />;
+  
+  i Replace td with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:81:16 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element tfoot is non-interactive and should not have an interactive role.
+  
+    79 │ let a = <tbody role="menuitem" />;
+    80 │ let a = <td role="menuitem" />;
+  > 81 │ let a = <tfoot role="menuitem" />;
+       │                ^^^^^^^^^^^^^^^
+    82 │ let a = <thead role="menuitem" />;
+    83 │ 
+  
+  i Replace tfoot with a div or a span.
+  
+
+```
+
+```
+invalid.jsx:82:16 lint/a11y/noNoninteractiveElementToInteractiveRole ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! The HTML element thead is non-interactive and should not have an interactive role.
+  
+    80 │ let a = <td role="menuitem" />;
+    81 │ let a = <tfoot role="menuitem" />;
+  > 82 │ let a = <thead role="menuitem" />;
+       │                ^^^^^^^^^^^^^^^
+    83 │ 
+  
+  i Replace thead with a div or a span.
+  
+
+```
+
 
diff --git a/crates/rome_js_analyze/tests/specs/a11y/noNoninteractiveElementToInteractiveRole/valid.jsx b/crates/rome_js_analyze/tests/specs/a11y/noNoninteractiveElementToInteractiveRole/valid.jsx
index f313aac92dc..c4cecdc608d 100644
--- a/crates/rome_js_analyze/tests/specs/a11y/noNoninteractiveElementToInteractiveRole/valid.jsx
+++ b/crates/rome_js_analyze/tests/specs/a11y/noNoninteractiveElementToInteractiveRole/valid.jsx
@@ -1,2 +1,109 @@
 let a = <span role="button"></span>;
 let a = <span role={`scroll${a}bar`}></span>;
+let a = <TestComponent onClick={doFoo} />;
+let a = <Button onClick={doFoo} />;
+let a = <a tabIndex="0" role="button" />;
+let a = <a href="http://x.y.z" role="button" />;
+let a = <a href="http://x.y.z" tabIndex="0" role="button" />;
+let a = <area role="button" />;
+let a = <area role="menuitem" />;
+let a = <button className="foo" role="button" />;
+let a = <input role="button" />;
+let a = <input type="button" role="button" />;
+let a = <input type="checkbox" role="button" />;
+let a = <input type="color" role="button" />;
+let a = <input type="date" role="button" />;
+let a = <input type="datetime" role="button" />;
+let a = <input type="datetime-local" role="button" />;
+let a = <input type="email" role="button" />;
+let a = <input type="file" role="button" />;
+let a = <input type="image" role="button" />;
+let a = <input type="month" role="button" />;
+let a = <input type="number" role="button" />;
+let a = <input type="password" role="button" />;
+let a = <input type="radio" role="button" />;
+let a = <input type="range" role="button" />;
+let a = <input type="reset" role="button" />;
+let a = <input type="search" role="button" />;
+let a = <input type="submit" role="button" />;
+let a = <input type="tel" role="button" />;
+let a = <input type="text" role="button" />;
+let a = <input type="time" role="button" />;
+let a = <input type="url" role="button" />;
+let a = <input type="week" role="button" />;
+let a = <menuitem role="button" />;
+let a = <option className="foo" role="button" />;
+let a = <select className="foo" role="button" />;
+let a = <textarea className="foo" role="button" />;
+let a = <tr role="button" />;
+let a = <tr role="presentation" />;
+let a = <a tabIndex="0" role="img" />;
+let a = <a href="http://x.y.z" role="img" />;
+let a = <a href="http://x.y.z" tabIndex="0" role="img" />;
+let a = <input role="img" />;
+let a = <input type="img" role="img" />;
+let a = <input type="checkbox" role="img" />;
+let a = <input type="color" role="img" />;
+let a = <input type="date" role="img" />;
+let a = <input type="datetime" role="img" />;
+let a = <input type="datetime-local" role="img" />;
+let a = <input type="email" role="img" />;
+let a = <input type="file" role="img" />;
+let a = <input type="image" role="img" />;
+let a = <input type="month" role="img" />;
+let a = <input type="number" role="img" />;
+let a = <input type="password" role="img" />;
+let a = <input type="radio" role="img" />;
+let a = <input type="range" role="img" />;
+let a = <input type="reset" role="img" />;
+let a = <input type="search" role="img" />;
+let a = <input type="submit" role="img" />;
+let a = <input type="tel" role="img" />;
+let a = <input type="text" role="img" />;
+let a = <input type="time" role="img" />;
+let a = <input type="url" role="img" />;
+let a = <input type="week" role="img" />;
+let a = <menuitem role="img" />;
+let a = <option className="foo" role="img" />;
+let a = <select className="foo" role="img" />;
+let a = <textarea className="foo" role="img" />;
+let a = <tr role="img" />;
+let a = <a tabIndex="0" role="listitem" />;
+let a = <a href="http://x.y.z" role="listitem" />;
+let a = <a href="http://x.y.z" tabIndex="0" role="listitem" />;
+let a = <input role="listitem" />;
+let a = <input type="listitem" role="listitem" />;
+let a = <input type="checkbox" role="listitem" />;
+let a = <input type="color" role="listitem" />;
+let a = <input type="date" role="listitem" />;
+let a = <input type="datetime" role="listitem" />;
+let a = <input type="datetime-local" role="listitem" />;
+let a = <input type="email" role="listitem" />;
+let a = <input type="file" role="listitem" />;
+let a = <input type="image" role="listitem" />;
+let a = <input type="month" role="listitem" />;
+let a = <input type="number" role="listitem" />;
+let a = <input type="password" role="listitem" />;
+let a = <input type="radio" role="listitem" />;
+let a = <input type="range" role="listitem" />;
+let a = <input type="reset" role="listitem" />;
+let a = <input type="search" role="listitem" />;
+let a = <input type="submit" role="listitem" />;
+let a = <input type="tel" role="listitem" />;
+let a = <input type="text" role="listitem" />;
+let a = <input type="time" role="listitem" />;
+let a = <input type="url" role="listitem" />;
+let a = <input type="week" role="listitem" />;
+let a = <menuitem role="listitem" />;
+let a = <option className="foo" role="listitem" />;
+let a = <select className="foo" role="listitem" />;
+let a = <textarea className="foo" role="listitem" />;
+let a = <tr role="listitem" />;
+let a = <tr role="menu" />;
+let a = <tr role="menuitem" />;
+let a = <tr role="option" />;
+let a = <tr role="presentation" />;
+let a = <tr role="tabpanel" />;
+let a = <tr role="tree" />;
+let a = <tr role="treegrid" />;
+let a = <tr role="treeitem" />;
diff --git a/crates/rome_js_analyze/tests/specs/a11y/noNoninteractiveElementToInteractiveRole/valid.jsx.snap b/crates/rome_js_analyze/tests/specs/a11y/noNoninteractiveElementToInteractiveRole/valid.jsx.snap
index fd23e06a6e0..90088e5ffb6 100644
--- a/crates/rome_js_analyze/tests/specs/a11y/noNoninteractiveElementToInteractiveRole/valid.jsx.snap
+++ b/crates/rome_js_analyze/tests/specs/a11y/noNoninteractiveElementToInteractiveRole/valid.jsx.snap
@@ -6,6 +6,113 @@ expression: valid.jsx
 ```js
 let a = <span role="button"></span>;
 let a = <span role={`scroll${a}bar`}></span>;
+let a = <TestComponent onClick={doFoo} />;
+let a = <Button onClick={doFoo} />;
+let a = <a tabIndex="0" role="button" />;
+let a = <a href="http://x.y.z" role="button" />;
+let a = <a href="http://x.y.z" tabIndex="0" role="button" />;
+let a = <area role="button" />;
+let a = <area role="menuitem" />;
+let a = <button className="foo" role="button" />;
+let a = <input role="button" />;
+let a = <input type="button" role="button" />;
+let a = <input type="checkbox" role="button" />;
+let a = <input type="color" role="button" />;
+let a = <input type="date" role="button" />;
+let a = <input type="datetime" role="button" />;
+let a = <input type="datetime-local" role="button" />;
+let a = <input type="email" role="button" />;
+let a = <input type="file" role="button" />;
+let a = <input type="image" role="button" />;
+let a = <input type="month" role="button" />;
+let a = <input type="number" role="button" />;
+let a = <input type="password" role="button" />;
+let a = <input type="radio" role="button" />;
+let a = <input type="range" role="button" />;
+let a = <input type="reset" role="button" />;
+let a = <input type="search" role="button" />;
+let a = <input type="submit" role="button" />;
+let a = <input type="tel" role="button" />;
+let a = <input type="text" role="button" />;
+let a = <input type="time" role="button" />;
+let a = <input type="url" role="button" />;
+let a = <input type="week" role="button" />;
+let a = <menuitem role="button" />;
+let a = <option className="foo" role="button" />;
+let a = <select className="foo" role="button" />;
+let a = <textarea className="foo" role="button" />;
+let a = <tr role="button" />;
+let a = <tr role="presentation" />;
+let a = <a tabIndex="0" role="img" />;
+let a = <a href="http://x.y.z" role="img" />;
+let a = <a href="http://x.y.z" tabIndex="0" role="img" />;
+let a = <input role="img" />;
+let a = <input type="img" role="img" />;
+let a = <input type="checkbox" role="img" />;
+let a = <input type="color" role="img" />;
+let a = <input type="date" role="img" />;
+let a = <input type="datetime" role="img" />;
+let a = <input type="datetime-local" role="img" />;
+let a = <input type="email" role="img" />;
+let a = <input type="file" role="img" />;
+let a = <input type="image" role="img" />;
+let a = <input type="month" role="img" />;
+let a = <input type="number" role="img" />;
+let a = <input type="password" role="img" />;
+let a = <input type="radio" role="img" />;
+let a = <input type="range" role="img" />;
+let a = <input type="reset" role="img" />;
+let a = <input type="search" role="img" />;
+let a = <input type="submit" role="img" />;
+let a = <input type="tel" role="img" />;
+let a = <input type="text" role="img" />;
+let a = <input type="time" role="img" />;
+let a = <input type="url" role="img" />;
+let a = <input type="week" role="img" />;
+let a = <menuitem role="img" />;
+let a = <option className="foo" role="img" />;
+let a = <select className="foo" role="img" />;
+let a = <textarea className="foo" role="img" />;
+let a = <tr role="img" />;
+let a = <a tabIndex="0" role="listitem" />;
+let a = <a href="http://x.y.z" role="listitem" />;
+let a = <a href="http://x.y.z" tabIndex="0" role="listitem" />;
+let a = <input role="listitem" />;
+let a = <input type="listitem" role="listitem" />;
+let a = <input type="checkbox" role="listitem" />;
+let a = <input type="color" role="listitem" />;
+let a = <input type="date" role="listitem" />;
+let a = <input type="datetime" role="listitem" />;
+let a = <input type="datetime-local" role="listitem" />;
+let a = <input type="email" role="listitem" />;
+let a = <input type="file" role="listitem" />;
+let a = <input type="image" role="listitem" />;
+let a = <input type="month" role="listitem" />;
+let a = <input type="number" role="listitem" />;
+let a = <input type="password" role="listitem" />;
+let a = <input type="radio" role="listitem" />;
+let a = <input type="range" role="listitem" />;
+let a = <input type="reset" role="listitem" />;
+let a = <input type="search" role="listitem" />;
+let a = <input type="submit" role="listitem" />;
+let a = <input type="tel" role="listitem" />;
+let a = <input type="text" role="listitem" />;
+let a = <input type="time" role="listitem" />;
+let a = <input type="url" role="listitem" />;
+let a = <input type="week" role="listitem" />;
+let a = <menuitem role="listitem" />;
+let a = <option className="foo" role="listitem" />;
+let a = <select className="foo" role="listitem" />;
+let a = <textarea className="foo" role="listitem" />;
+let a = <tr role="listitem" />;
+let a = <tr role="menu" />;
+let a = <tr role="menuitem" />;
+let a = <tr role="option" />;
+let a = <tr role="presentation" />;
+let a = <tr role="tabpanel" />;
+let a = <tr role="tree" />;
+let a = <tr role="treegrid" />;
+let a = <tr role="treeitem" />;
 
 ```