rome · ematipico · Nov 21, 2022 · Nov 20, 2022 · Nov 21, 2022
diff --git a/crates/rome_diagnostics_categories/src/categories.rs b/crates/rome_diagnostics_categories/src/categories.rs
@@ -81,6 +81,7 @@ define_dategories! {
     "lint/nursery/noDupeKeys":"https://docs.rome.tools/lint/rules/noDupeKeys",
     "lint/nursery/noEmptyInterface": "https://docs.rome.tools/lint/rules/noEmptyInterface",
     "lint/nursery/noExplicitAny": "https://docs.rome.tools/lint/rules/noExplicitAny",
+    "lint/nursery/noHeaderScope": "https://docs.rome.tools/lint/rules/noHeaderScope",
     "lint/nursery/noInvalidConstructorSuper": "https://docs.rome.tools/lint/rules/noInvalidConstructorSuper",
     "lint/nursery/noPrecisionLoss": "https://docs.rome.tools/lint/rules/noPrecisionLoss",
     "lint/nursery/noUnsafeFinally": "https://docs.rome.tools/lint/rules/noUnsafeFinally",

diff --git a/crates/rome_js_analyze/src/analyzers/nursery.rs b/crates/rome_js_analyze/src/analyzers/nursery.rs
diff --git a/crates/rome_js_analyze/src/analyzers/nursery/no_header_scope.rs b/crates/rome_js_analyze/src/analyzers/nursery/no_header_scope.rs
@@ -0,0 +1,105 @@
+use rome_analyze::context::RuleContext;
+use rome_analyze::{declare_rule, ActionCategory, Ast, Rule, RuleDiagnostic};
+use rome_console::markup;
+use rome_diagnostics::Applicability;
+use rome_js_syntax::{
+    JsxAnyElementName, JsxAttribute, JsxAttributeList, JsxOpeningElement, JsxSelfClosingElement,
+};
+use rome_rowan::{declare_node_union, AstNode, BatchMutationExt};
+
+use crate::JsRuleAction;
+
+declare_rule! {
+    /// Check that the scope attribute is only used on `th` elements.
+    ///
+    /// ESLint Equivalent: [scope](https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/master/docs/rules/scope.md)
+    ///
+    /// ## Examples
+    ///
+    /// ### Invalid
+    ///
+    /// ```jsx,expect_diagnostic
+    /// <div scope={scope} />
+    /// ```
+    ///
+    /// ```jsx,expect_diagnostic
+    /// <div scope="col" />
+    /// ```
+    ///
+    /// ### Valid
+    ///
+    /// ```jsx
+    /// <th scope={scope}></th>
+    /// ```
+    ///
+    /// ```jsx
+    /// <th scope="col"></th>
+    /// ```
+    pub(crate) NoHeaderScope {
+        version: "11.0.0",
+        name: "noHeaderScope",
+        recommended: false,
+    }
+}
+
+declare_node_union! {
+    pub(crate) JsxAnyElement = JsxOpeningElement | JsxSelfClosingElement
+}
+
+impl JsxAnyElement {
+    fn name(&self) -> Option<JsxAnyElementName> {
+        match self {
+            JsxAnyElement::JsxOpeningElement(element) => element.name().ok(),
+            JsxAnyElement::JsxSelfClosingElement(element) => element.name().ok(),
+        }
+    }
+}
+
+impl Rule for NoHeaderScope {
+    type Query = Ast<JsxAttribute>;
+    type State = ();
+    type Signals = Option<Self::State>;
+    type Options = ();
+
+    fn run(ctx: &RuleContext<Self>) -> Self::Signals {
+        let attr = ctx.query();
+
+        if attr.name().ok()?.syntax().text_trimmed() != "scope" {
+            return None;
+        }
+
+        let jsx_element = attr
+            .parent::<JsxAttributeList>()?
+            .parent::<JsxAnyElement>()?;
+
+        if jsx_element.name()?.as_jsx_name()?.syntax().text_trimmed() != "th" {
+            return Some(());
+        }
+
+        None
+    }
+
+    fn diagnostic(ctx: &RuleContext<Self>, _: &Self::State) -> Option<RuleDiagnostic> {
+        let diagnostic = RuleDiagnostic::new(
+            rule_category!(),
+            ctx.query().range(),
+            markup! {"Avoid using the "<Emphasis>"scope"</Emphasis>" attribute on elements other than "<Emphasis>"th"</Emphasis>" elements."}
+                .to_owned(),
+        );
+
+        Some(diagnostic)
+    }
+
+    fn action(ctx: &RuleContext<Self>, _: &Self::State) -> Option<JsRuleAction> {
+        let mut mutation = ctx.root().begin();
+
+        mutation.remove_node(ctx.query().clone());
+
+        Some(JsRuleAction {
+            category: ActionCategory::QuickFix,
+            applicability: Applicability::MaybeIncorrect,
+            message: markup! { "Remove the "<Emphasis>"scope"</Emphasis>" attribute." }.to_owned(),
+            mutation,
+        })
+    }
+}
diff --git a/crates/rome_js_analyze/tests/specs/nursery/noHeaderScope/invalid.jsx b/crates/rome_js_analyze/tests/specs/nursery/noHeaderScope/invalid.jsx
@@ -0,0 +1,6 @@
+<>
+	<div scope={scope} />
+	<div scope={scope}></div>
+	<div scope="col" />
+	<div scope="col"></div>
+</>
diff --git a/crates/rome_js_analyze/tests/specs/nursery/noHeaderScope/invalid.jsx.snap b/crates/rome_js_analyze/tests/specs/nursery/noHeaderScope/invalid.jsx.snap
@@ -0,0 +1,93 @@
+---
+source: crates/rome_js_analyze/tests/spec_tests.rs
+assertion_line: 73
+expression: invalid.jsx
+---
+# Input
+```js
+<>
+	<div scope={scope} />
+	<div scope={scope}></div>
+	<div scope="col" />
+	<div scope="col"></div>
+</>
+
+```
+
+# Diagnostics
+```
+invalid.jsx:2:7 lint/nursery/noHeaderScope  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! Avoid using the scope attribute on elements other than th elements.
+
+    1 │ <>
+  > 2 │ 	<div scope={scope} />
+      │ 	     ^^^^^^^^^^^^^
+    3 │ 	<div scope={scope}></div>
+    4 │ 	<div scope="col" />
+
+  i Suggested fix: Remove the scope attribute.
+
+    2 │ → <div·scope={scope}·/>
+      │        --------------  
+
+```
+
+```
+invalid.jsx:3:7 lint/nursery/noHeaderScope  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! Avoid using the scope attribute on elements other than th elements.
+
+    1 │ <>
+    2 │ 	<div scope={scope} />
+  > 3 │ 	<div scope={scope}></div>
+      │ 	     ^^^^^^^^^^^^^
+    4 │ 	<div scope="col" />
+    5 │ 	<div scope="col"></div>
+
+  i Suggested fix: Remove the scope attribute.
+
+    3 │ → <div·scope={scope}></div>
+      │        -------------       
+
+```
+
+```
+invalid.jsx:4:7 lint/nursery/noHeaderScope  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! Avoid using the scope attribute on elements other than th elements.
+
+    2 │ 	<div scope={scope} />
+    3 │ 	<div scope={scope}></div>
+  > 4 │ 	<div scope="col" />
+      │ 	     ^^^^^^^^^^^
+    5 │ 	<div scope="col"></div>
+    6 │ </>
+
+  i Suggested fix: Remove the scope attribute.
+
+    4 │ → <div·scope="col"·/>
+      │        ------------  
+
+```
+
+```
+invalid.jsx:5:7 lint/nursery/noHeaderScope  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ! Avoid using the scope attribute on elements other than th elements.
+
+    3 │ 	<div scope={scope}></div>
+    4 │ 	<div scope="col" />
+  > 5 │ 	<div scope="col"></div>
+      │ 	     ^^^^^^^^^^^
+    6 │ </>
+    7 │ 
+
+  i Suggested fix: Remove the scope attribute.
+
+    5 │ → <div·scope="col"></div>
+      │        -----------       
+
+```
+
+
diff --git a/crates/rome_js_analyze/tests/specs/nursery/noHeaderScope/valid.jsx b/crates/rome_js_analyze/tests/specs/nursery/noHeaderScope/valid.jsx
@@ -0,0 +1,4 @@
+<>
+	<th scope="col"></th>
+	<th scope={scope}></th>
+</>
diff --git a/crates/rome_js_analyze/tests/specs/nursery/noHeaderScope/valid.jsx.snap b/crates/rome_js_analyze/tests/specs/nursery/noHeaderScope/valid.jsx.snap
@@ -0,0 +1,15 @@
+---
+source: crates/rome_js_analyze/tests/spec_tests.rs
+assertion_line: 73
+expression: valid.jsx
+---
+# Input
+```js
+<>
+	<th scope="col"></th>
+	<th scope={scope}></th>
+</>
+
+```
+
+
diff --git a/crates/rome_service/src/configuration/linter/rules.rs b/crates/rome_service/src/configuration/linter/rules.rs
diff --git a/editors/vscode/configuration_schema.json b/editors/vscode/configuration_schema.json
diff --git a/npm/backend-jsonrpc/src/workspace.ts b/npm/backend-jsonrpc/src/workspace.ts
diff --git a/npm/rome/configuration_schema.json b/npm/rome/configuration_schema.json
diff --git a/website/src/pages/lint/rules/index.mdx b/website/src/pages/lint/rules/index.mdx
@@ -479,6 +479,12 @@ Disallow the declaration of empty interfaces.
 Disallow the <code>any</code> type usage
 </section>
 <section class="rule">
+<h3 data-toc-exclude id="noHeaderScope">
+	<a href="/lint/rules/noHeaderScope">noHeaderScope</a>
+</h3>
+Check that the scope attribute is only used on <code>th</code> elements.
+</section>
+<section class="rule">
 <h3 data-toc-exclude id="noInvalidConstructorSuper">
 	<a href="/lint/rules/noInvalidConstructorSuper">noInvalidConstructorSuper</a>
 </h3>