Repository: sveltejs/eslint-plugin-svelte
Pull request #1015 (2025-01-12 08:42:05)

fix!: rename `no-deprecated-raw-special-elements` to `no-raw-special-elements`
Update the `no-deprecated-raw-special-elements` for a more meaningful name, as
the elements are not deprecated but rather invalid.

See [](https://github.com/sveltejs/eslint-plugin-svelte/pull/918#issuecomment-2585557933) for context.

close: https://github.com/sveltejs/eslint-plugin-svelte/issues/913

changeset-bot[bot]: ###  🦋  Changeset detected

Latest commit: 6dd3db63fccf78b16c98794c0e5476ba8476c648

**The changes in this PR will be included in the next version bump.**

<details><summary>This PR includes changesets to release 1 package</summary>

  | Name                 | Type  |
| -------------------- | ----- |
| eslint-plugin-svelte | Major |

</details>

Not sure what this means? [Click here  to learn what changesets are](https://github.com/changesets/changesets/blob/main/docs/adding-a-changeset.md).

[Click here if you're a maintainer who wants to add another changeset to this PR](https://github.com/mikededo/eslint-plugin-svelte/new/fix/correct-rule?filename=.changeset/violet-rats-tickle.md&value=---%0A%22eslint-plugin-svelte%22%3A%20patch%0A---%0A%0Afix(no-raw-special-elements)%3A%20correct%20rule%0A)


pkg-pr-new[bot]: 
[Open in Stackblitz](https://pkg.pr.new/template/eb90e81c-4f4c-48a8-ad0b-c1d75305e453)


```
npm i https://pkg.pr.new/eslint-plugin-svelte@1015
```


_commit: <a href="https://github.com/sveltejs/eslint-plugin-svelte/runs/35486669226"><code>6dd3db6</code></a>_


Patch:
diff --git a/.changeset/thin-dryers-know.md b/.changeset/thin-dryers-know.md
new file mode 100644
index 0000000..b98f20f
--- /dev/null
+++ b/.changeset/thin-dryers-know.md
@@ -0,0 +1,5 @@
+---
+'eslint-plugin-svelte': minor
+---
+
+fix!: rename `no-deprecated-raw-special-elements` to `no-raw-special-elements`
diff --git a/README.md b/README.md
index 35c16c8..5caad46 100644
--- a/README.md
+++ b/README.md
@@ -320,7 +320,6 @@ These rules relate to possible syntax or logic errors in Svelte code:
 | Rule ID | Description |    |
 |:--------|:------------|:---|
 | [svelte/infinite-reactive-loop](https://sveltejs.github.io/eslint-plugin-svelte/rules/infinite-reactive-loop/) | Svelte runtime prevents calling the same reactive statement twice in a microtask. But between different microtask, it doesn't prevent. |  |
-| [svelte/no-deprecated-raw-special-elements](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-deprecated-raw-special-elements/) | Recommends not using raw special elements in Svelte versions previous to 5. | :wrench: |
 | [svelte/no-dom-manipulating](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-dom-manipulating/) | disallow DOM manipulating |  |
 | [svelte/no-dupe-else-if-blocks](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-dupe-else-if-blocks/) | disallow duplicate conditions in `{#if}` / `{:else if}` chains | :star: |
 | [svelte/no-dupe-on-directives](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-dupe-on-directives/) | disallow duplicate `on:` directives |  |
@@ -330,6 +329,7 @@ These rules relate to possible syntax or logic errors in Svelte code:
 | [svelte/no-export-load-in-svelte-module-in-kit-pages](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-export-load-in-svelte-module-in-kit-pages/) | disallow exporting load functions in `*.svelte` module in SvelteKit page components. |  |
 | [svelte/no-not-function-handler](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-not-function-handler/) | disallow use of not function in event handler | :star: |
 | [svelte/no-object-in-text-mustaches](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-object-in-text-mustaches/) | disallow objects in text mustache interpolation | :star: |
+| [svelte/no-raw-special-elements](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-raw-special-elements/) | Checks for invalid raw HTML elements | :wrench: |
 | [svelte/no-reactive-reassign](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-reactive-reassign/) | disallow reassigning reactive values |  |
 | [svelte/no-shorthand-style-property-overrides](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-shorthand-style-property-overrides/) | disallow shorthand style properties that override related longhand properties | :star: |
 | [svelte/no-store-async](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-store-async/) | disallow using async/await inside svelte stores because it causes issues with the auto-unsubscribing features |  |
diff --git a/docs/rules.md b/docs/rules.md
index 047b2ab..73dcbdf 100644
--- a/docs/rules.md
+++ b/docs/rules.md
@@ -17,7 +17,6 @@ These rules relate to possible syntax or logic errors in Svelte code:
 | Rule ID                                                                                                        | Description                                                                                                                            |                |
 | :------------------------------------------------------------------------------------------------------------- | :------------------------------------------------------------------------------------------------------------------------------------- | :------------- |
 | [svelte/infinite-reactive-loop](./rules/infinite-reactive-loop.md)                                             | Svelte runtime prevents calling the same reactive statement twice in a microtask. But between different microtask, it doesn't prevent. |                |
-| [svelte/no-deprecated-raw-special-elements](./rules/no-deprecated-raw-special-elements.md)                     | Recommends not using raw special elements in Svelte versions previous to 5.                                                            | :wrench:       |
 | [svelte/no-dom-manipulating](./rules/no-dom-manipulating.md)                                                   | disallow DOM manipulating                                                                                                              |                |
 | [svelte/no-dupe-else-if-blocks](./rules/no-dupe-else-if-blocks.md)                                             | disallow duplicate conditions in `{#if}` / `{:else if}` chains                                                                         | :star:         |
 | [svelte/no-dupe-on-directives](./rules/no-dupe-on-directives.md)                                               | disallow duplicate `on:` directives                                                                                                    |                |
@@ -27,6 +26,7 @@ These rules relate to possible syntax or logic errors in Svelte code:
 | [svelte/no-export-load-in-svelte-module-in-kit-pages](./rules/no-export-load-in-svelte-module-in-kit-pages.md) | disallow exporting load functions in `*.svelte` module in SvelteKit page components.                                                   |                |
 | [svelte/no-not-function-handler](./rules/no-not-function-handler.md)                                           | disallow use of not function in event handler                                                                                          | :star:         |
 | [svelte/no-object-in-text-mustaches](./rules/no-object-in-text-mustaches.md)                                   | disallow objects in text mustache interpolation                                                                                        | :star:         |
+| [svelte/no-raw-special-elements](./rules/no-raw-special-elements.md)                                           | Checks for invalid raw HTML elements                                                                                                   | :wrench:       |
 | [svelte/no-reactive-reassign](./rules/no-reactive-reassign.md)                                                 | disallow reassigning reactive values                                                                                                   |                |
 | [svelte/no-shorthand-style-property-overrides](./rules/no-shorthand-style-property-overrides.md)               | disallow shorthand style properties that override related longhand properties                                                          | :star:         |
 | [svelte/no-store-async](./rules/no-store-async.md)                                                             | disallow using async/await inside svelte stores because it causes issues with the auto-unsubscribing features                          |                |
diff --git a/docs/rules/no-deprecated-raw-special-elements.md b/docs/rules/no-raw-special-elements.md
similarity index 58%
rename from docs/rules/no-deprecated-raw-special-elements.md
rename to docs/rules/no-raw-special-elements.md
index 31f1985..30d9653 100644
--- a/docs/rules/no-deprecated-raw-special-elements.md
+++ b/docs/rules/no-raw-special-elements.md
@@ -1,26 +1,26 @@
 ---
 pageClass: 'rule-details'
 sidebarDepth: 0
-title: 'svelte/no-deprecated-raw-special-elements'
-description: 'Recommends not using raw special elements in Svelte versions previous to 5.'
+title: 'svelte/no-raw-special-elements'
+description: 'Checks for invalid raw HTML elements'
 since: 'v3.0.0-next.1'
 ---
 
-# svelte/no-deprecated-raw-special-elements
+# svelte/no-raw-special-elements
 
-> Recommends not using raw special elements in Svelte versions previous to 5.
+> Checks for invalid raw HTML elements
 
 - :wrench: The `--fix` option on the [command line](https://eslint.org/docs/user-guide/command-line-interface#fixing-problems) can automatically fix some of the problems reported by this rule.
 
 ## :book: Rule Details
 
-This rule reports the usage of `head`, `body`, `window`, `document`, `element` and `options` HTML elements. These elements were valid in in versions proior to 5, but since Svelte 5 they must be used with `svelte:`.
+This rule reports the usage of `head`, `body`, `window`, `document`, `element` and `options` HTML elements. These elements are not valid in Svelte, despite them working in versions previous to v5. Such elements must be prefixed with `svelte:`.
 
 <!--eslint-skip-->
 
 ```svelte
 <script>
-  /* eslint svelte/no-deprecated-raw-special-elements: "error" */
+  /* eslint svelte/no-raw-special-elements: "error" */
 </script>
 
 <!-- ✓ GOOD -->
@@ -48,5 +48,5 @@ This rule was introduced in eslint-plugin-svelte v3.0.0-next.1
 
 ## :mag: Implementation
 
-- [Rule source](https://github.com/sveltejs/eslint-plugin-svelte/blob/main/packages/eslint-plugin-svelte/src/rules/no-deprecated-raw-special-elements.ts)
-- [Test source](https://github.com/sveltejs/eslint-plugin-svelte/blob/main/packages/eslint-plugin-svelte/tests/src/rules/no-deprecated-raw-special-elements.ts)
+- [Rule source](https://github.com/sveltejs/eslint-plugin-svelte/blob/main/packages/eslint-plugin-svelte/src/rules/no-raw-special-elements.ts)
+- [Test source](https://github.com/sveltejs/eslint-plugin-svelte/blob/main/packages/eslint-plugin-svelte/tests/src/rules/no-raw-special-elements.ts)
diff --git a/packages/eslint-plugin-svelte/src/rule-types.ts b/packages/eslint-plugin-svelte/src/rule-types.ts
index b07451a..438ec0f 100644
--- a/packages/eslint-plugin-svelte/src/rule-types.ts
+++ b/packages/eslint-plugin-svelte/src/rule-types.ts
@@ -104,11 +104,6 @@ export interface RuleOptions {
    * @see https://sveltejs.github.io/eslint-plugin-svelte/rules/no-at-html-tags/
    */
   'svelte/no-at-html-tags'?: Linter.RuleEntry<[]>
-  /**
-   * Recommends not using raw special elements in Svelte versions previous to 5.
-   * @see https://sveltejs.github.io/eslint-plugin-svelte/rules/no-deprecated-raw-special-elements/
-   */
-  'svelte/no-deprecated-raw-special-elements'?: Linter.RuleEntry<[]>
   /**
    * disallow DOM manipulating
    * @see https://sveltejs.github.io/eslint-plugin-svelte/rules/no-dom-manipulating/
@@ -195,6 +190,11 @@ export interface RuleOptions {
    * @see https://sveltejs.github.io/eslint-plugin-svelte/rules/no-object-in-text-mustaches/
    */
   'svelte/no-object-in-text-mustaches'?: Linter.RuleEntry<[]>
+  /**
+   * Checks for invalid raw HTML elements
+   * @see https://sveltejs.github.io/eslint-plugin-svelte/rules/no-raw-special-elements/
+   */
+  'svelte/no-raw-special-elements'?: Linter.RuleEntry<[]>
   /**
    * it's not necessary to define functions in reactive statements
    * @see https://sveltejs.github.io/eslint-plugin-svelte/rules/no-reactive-functions/
diff --git a/packages/eslint-plugin-svelte/src/rules/no-deprecated-raw-special-elements.ts b/packages/eslint-plugin-svelte/src/rules/no-raw-special-elements.ts
similarity index 87%
rename from packages/eslint-plugin-svelte/src/rules/no-deprecated-raw-special-elements.ts
rename to packages/eslint-plugin-svelte/src/rules/no-raw-special-elements.ts
index 6d4d7bd..14fd963 100644
--- a/packages/eslint-plugin-svelte/src/rules/no-deprecated-raw-special-elements.ts
+++ b/packages/eslint-plugin-svelte/src/rules/no-raw-special-elements.ts
@@ -4,10 +4,10 @@ import { createRule } from '../utils/index.js';
 const INVALID_HTML_ELEMENTS = ['head', 'body', 'window', 'document', 'element', 'options'];
 const VALID_PREFIX = 'svelte:';
 
-export default createRule('no-deprecated-raw-special-elements', {
+export default createRule('no-raw-special-elements', {
 	meta: {
 		docs: {
-			description: 'Recommends not using raw special elements in Svelte versions previous to 5.',
+			description: 'Checks for invalid raw HTML elements',
 			category: 'Possible Errors',
 			// TODO: Switch to recommended in the major version
 			recommended: false
diff --git a/packages/eslint-plugin-svelte/src/utils/rules.ts b/packages/eslint-plugin-svelte/src/utils/rules.ts
index cb0cbe8..43d6772 100644
--- a/packages/eslint-plugin-svelte/src/utils/rules.ts
+++ b/packages/eslint-plugin-svelte/src/utils/rules.ts
@@ -20,7 +20,6 @@ import maxAttributesPerLine from '../rules/max-attributes-per-line.js';
 import mustacheSpacing from '../rules/mustache-spacing.js';
 import noAtDebugTags from '../rules/no-at-debug-tags.js';
 import noAtHtmlTags from '../rules/no-at-html-tags.js';
-import noDeprecatedRawSpecialElements from '../rules/no-deprecated-raw-special-elements.js';
 import noDomManipulating from '../rules/no-dom-manipulating.js';
 import noDupeElseIfBlocks from '../rules/no-dupe-else-if-blocks.js';
 import noDupeOnDirectives from '../rules/no-dupe-on-directives.js';
@@ -38,6 +37,7 @@ import noInspect from '../rules/no-inspect.js';
 import noNavigationWithoutBase from '../rules/no-navigation-without-base.js';
 import noNotFunctionHandler from '../rules/no-not-function-handler.js';
 import noObjectInTextMustaches from '../rules/no-object-in-text-mustaches.js';
+import noRawSpecialElements from '../rules/no-raw-special-elements.js';
 import noReactiveFunctions from '../rules/no-reactive-functions.js';
 import noReactiveLiterals from '../rules/no-reactive-literals.js';
 import noReactiveReassign from '../rules/no-reactive-reassign.js';
@@ -91,7 +91,6 @@ export const rules = [
 	mustacheSpacing,
 	noAtDebugTags,
 	noAtHtmlTags,
-	noDeprecatedRawSpecialElements,
 	noDomManipulating,
 	noDupeElseIfBlocks,
 	noDupeOnDirectives,
@@ -109,6 +108,7 @@ export const rules = [
 	noNavigationWithoutBase,
 	noNotFunctionHandler,
 	noObjectInTextMustaches,
+	noRawSpecialElements,
 	noReactiveFunctions,
 	noReactiveLiterals,
 	noReactiveReassign,


Test patch:
diff --git a/packages/eslint-plugin-svelte/tests/fixtures/rules/no-deprecated-raw-special-elements/invalid/test01-errors.yaml b/packages/eslint-plugin-svelte/tests/fixtures/rules/no-raw-special-elements/invalid/test01-errors.yaml
similarity index 100%
rename from packages/eslint-plugin-svelte/tests/fixtures/rules/no-deprecated-raw-special-elements/invalid/test01-errors.yaml
rename to packages/eslint-plugin-svelte/tests/fixtures/rules/no-raw-special-elements/invalid/test01-errors.yaml
diff --git a/packages/eslint-plugin-svelte/tests/fixtures/rules/no-deprecated-raw-special-elements/invalid/test01-input.svelte b/packages/eslint-plugin-svelte/tests/fixtures/rules/no-raw-special-elements/invalid/test01-input.svelte
similarity index 100%
rename from packages/eslint-plugin-svelte/tests/fixtures/rules/no-deprecated-raw-special-elements/invalid/test01-input.svelte
rename to packages/eslint-plugin-svelte/tests/fixtures/rules/no-raw-special-elements/invalid/test01-input.svelte
diff --git a/packages/eslint-plugin-svelte/tests/fixtures/rules/no-deprecated-raw-special-elements/invalid/test01-output.svelte b/packages/eslint-plugin-svelte/tests/fixtures/rules/no-raw-special-elements/invalid/test01-output.svelte
similarity index 100%
rename from packages/eslint-plugin-svelte/tests/fixtures/rules/no-deprecated-raw-special-elements/invalid/test01-output.svelte
rename to packages/eslint-plugin-svelte/tests/fixtures/rules/no-raw-special-elements/invalid/test01-output.svelte
diff --git a/packages/eslint-plugin-svelte/tests/fixtures/rules/no-deprecated-raw-special-elements/valid/test01-input.svelte b/packages/eslint-plugin-svelte/tests/fixtures/rules/no-raw-special-elements/valid/test01-input.svelte
similarity index 100%
rename from packages/eslint-plugin-svelte/tests/fixtures/rules/no-deprecated-raw-special-elements/valid/test01-input.svelte
rename to packages/eslint-plugin-svelte/tests/fixtures/rules/no-raw-special-elements/valid/test01-input.svelte
diff --git a/packages/eslint-plugin-svelte/tests/src/rules/no-deprecated-raw-special-elements.ts b/packages/eslint-plugin-svelte/tests/src/rules/no-raw-special-elements.ts
similarity index 59%
rename from packages/eslint-plugin-svelte/tests/src/rules/no-deprecated-raw-special-elements.ts
rename to packages/eslint-plugin-svelte/tests/src/rules/no-raw-special-elements.ts
index 172cc28..4250ec6 100644
--- a/packages/eslint-plugin-svelte/tests/src/rules/no-deprecated-raw-special-elements.ts
+++ b/packages/eslint-plugin-svelte/tests/src/rules/no-raw-special-elements.ts
@@ -1,5 +1,5 @@
 import { RuleTester } from '../../utils/eslint-compat.js';
-import rule from '../../../src/rules/no-deprecated-raw-special-elements.js';
+import rule from '../../../src/rules/no-raw-special-elements.js';
 import { loadTestCases } from '../../utils/utils.js';
 
 const tester = new RuleTester({
@@ -10,7 +10,7 @@ const tester = new RuleTester({
 });
 
 tester.run(
-	'no-deprecated-raw-special-elements',
+	'no-raw-special-elements',
 	rule as any,
-	loadTestCases('no-deprecated-raw-special-elements')
+	loadTestCases('no-raw-special-elements')
 );