fix: false positives for ts in svelte/no-unused-svelte-ignore (#357)

Author: ota-meshi

.changeset/honest-garlics-march.md

@@ -0,0 +1,5 @@
+---
+"eslint-plugin-svelte": patch
+---
+
+fix: false positives for ts in `svelte/no-unused-svelte-ignore`

src/shared/svelte-compile-warns/index.ts

@@ -27,8 +27,8 @@ const STYLE_TRANSFORMS: Record<
 > = {
   postcss: transformWithPostCSS,
   pcss: transformWithPostCSS,
-  scss: (node, context) => transformWithSass(node, context, "scss"),
-  sass: (node, context) => transformWithSass(node, context, "sass"),
+  scss: (node, text, context) => transformWithSass(node, text, context, "scss"),
+  sass: (node, text, context) => transformWithSass(node, text, context, "sass"),
   less: transformWithLess,
   stylus: transformWithStylus,
   styl: transformWithStylus,
@@ -94,7 +94,11 @@ function getSvelteCompileWarningsWithoutCache(
   for (const style of styleElementsWithNotCSS) {
     const transform = STYLE_TRANSFORMS[style.lang]
     if (transform) {
-      const result = transform(style.node, context)
+      const result = transform(
+        style.node,
+        context.getSourceCode().text,
+        context,
+      )
       if (result) {
         transformResults.push(result)
         continue
@@ -110,7 +114,7 @@ function getSvelteCompileWarningsWithoutCache(
 
   const text = buildStrippedText(context, ignoreComments, stripStyleTokens)
 
-  transformResults.push(...transformScripts(context))
+  transformResults.push(...transformScripts(context, text))
 
   if (!transformResults.length) {
     const warnings = getWarningsFromCode(text)
@@ -396,7 +400,7 @@ function buildStrippedText(
 }
 
 /** Returns the result of transforming the required script for the transform. */
-function* transformScripts(context: RuleContext) {
+function* transformScripts(context: RuleContext, text: string) {
   const transform = isUseTypeScript(context)
     ? hasTypeScript(context)
       ? transformWithTypescript
@@ -410,7 +414,7 @@ function* transformScripts(context: RuleContext) {
     const root = sourceCode.ast
     for (const node of root.body) {
       if (node.type === "SvelteScriptElement") {
-        const result = transform(node, context)
+        const result = transform(node, text, context)
         if (result) {
           yield result
         }

src/shared/svelte-compile-warns/transform/babel.ts

@@ -10,6 +10,7 @@ type BabelCore = typeof babelCore
  */
 export function transform(
   node: AST.SvelteScriptElement,
+  text: string,
   context: RuleContext,
 ): TransformResult | null {
   const babel = loadBabel(context)
@@ -22,7 +23,7 @@ export function transform(
   } else {
     inputRange = [node.startTag.range[1], node.range[1]]
   }
-  const code = context.getSourceCode().text.slice(...inputRange)
+  const code = text.slice(...inputRange)
 
   try {
     const output = babel.transformSync(code, {

src/shared/svelte-compile-warns/transform/less.ts

@@ -10,6 +10,7 @@ type Less = typeof less
  */
 export function transform(
   node: AST.SvelteStyleElement,
+  text: string,
   context: RuleContext,
 ): TransformResult | null {
   const less = loadLess(context)
@@ -22,7 +23,7 @@ export function transform(
   } else {
     inputRange = [node.startTag.range[1], node.range[1]]
   }
-  const code = context.getSourceCode().text.slice(...inputRange)
+  const code = text.slice(...inputRange)
 
   const filename = `${context.getFilename()}.less`
   try {

src/shared/svelte-compile-warns/transform/postcss.ts

@@ -9,6 +9,7 @@ import type { TransformResult } from "./types"
  */
 export function transform(
   node: AST.SvelteStyleElement,
+  text: string,
   context: RuleContext,
 ): TransformResult | null {
   const postcssConfig = context.settings?.svelte?.compileOptions?.postcss
@@ -21,7 +22,7 @@ export function transform(
   } else {
     inputRange = [node.startTag.range[1], node.range[1]]
   }
-  const code = context.getSourceCode().text.slice(...inputRange)
+  const code = text.slice(...inputRange)
 
   const filename = `${context.getFilename()}.css`
   try {

src/shared/svelte-compile-warns/transform/sass.ts

@@ -10,6 +10,7 @@ type Sass = typeof sass
  */
 export function transform(
   node: AST.SvelteStyleElement,
+  text: string,
   context: RuleContext,
   type: "scss" | "sass",
 ): TransformResult | null {
@@ -23,7 +24,7 @@ export function transform(
   } else {
     inputRange = [node.startTag.range[1], node.range[1]]
   }
-  const code = context.getSourceCode().text.slice(...inputRange)
+  const code = text.slice(...inputRange)
 
   try {
     const output = sass.compileString(code, {

src/shared/svelte-compile-warns/transform/stylus.ts

@@ -11,6 +11,7 @@ type Stylus = typeof stylus
  */
 export function transform(
   node: AST.SvelteStyleElement,
+  text: string,
   context: RuleContext,
 ): TransformResult | null {
   const stylus = loadStylus(context)
@@ -23,7 +24,7 @@ export function transform(
   } else {
     inputRange = [node.startTag.range[1], node.range[1]]
   }
-  const code = context.getSourceCode().text.slice(...inputRange)
+  const code = text.slice(...inputRange)
 
   const filename = `${context.getFilename()}.stylus`
   try {

src/shared/svelte-compile-warns/transform/typescript.ts

@@ -10,6 +10,7 @@ type TS = typeof typescript
  */
 export function transform(
   node: AST.SvelteScriptElement,
+  text: string,
   context: RuleContext,
 ): TransformResult | null {
   const ts = loadTs(context)
@@ -22,7 +23,7 @@ export function transform(
   } else {
     inputRange = [node.startTag.range[1], node.range[1]]
   }
-  const code = context.getSourceCode().text.slice(...inputRange)
+  const code = text.slice(...inputRange)
 
   try {
     const output = ts.transpileModule(code, {

tests/fixtures/rules/no-unused-svelte-ignore/valid/ts-lang01-input.svelte

@@ -0,0 +1,4 @@
+<script lang="ts">
+  // svelte-ignore unused-export-let
+  export let something
+</script>

tests/fixtures/rules/valid-compile/valid/ts/ts-lang01-input.svelte

@@ -0,0 +1,4 @@
+<script lang="ts">
+  // svelte-ignore unused-export-let
+  export let something
+</script>