(fix) ignore generated $store declaration (#871)

dummdidumm · web-flow · commit 4411fce2cccd · 2021-03-10T14:05:55.000+01:00
in findReferences/getDefinition/diagnostics
Use new ignore-comment-functionality for that
diff --git a/packages/language-server/src/plugins/typescript/features/DiagnosticsProvider.ts b/packages/language-server/src/plugins/typescript/features/DiagnosticsProvider.ts
@@ -52,7 +52,7 @@ export class DiagnosticsProviderImpl implements DiagnosticsProvider {
             }))
             .map((diagnostic) => mapObjWithRangeToOriginal(fragment, diagnostic))
             .filter(hasNoNegativeLines)
-            .filter(isNoFalsePositive(document.getText(), tsDoc, diagnostics))
+            .filter(isNoFalsePositive(document.getText(), tsDoc))
             .map(enhanceIfNecessary)
             .map(swapRangeStartEndIfNecessary);
     }
@@ -82,40 +82,16 @@ function hasNoNegativeLines(diagnostic: Diagnostic): boolean {
     return diagnostic.range.start.line >= 0 && diagnostic.range.end.line >= 0;
 }
 
-function isNoFalsePositive(
-    text: string,
-    tsDoc: SvelteDocumentSnapshot,
-    rawTsDiagnostics: ts.Diagnostic[]
-) {
+function isNoFalsePositive(text: string, tsDoc: SvelteDocumentSnapshot) {
     return (diagnostic: Diagnostic, idx: number) => {
         return (
             isNoJsxCannotHaveMultipleAttrsError(diagnostic) &&
             isNoUnusedLabelWarningForReactiveStatement(diagnostic) &&
-            isNoUsedBeforeAssigned(diagnostic, text, tsDoc) &&
-            isNotHiddenStoreValueDeclaration(diagnostic, tsDoc, rawTsDiagnostics[idx])
+            isNoUsedBeforeAssigned(diagnostic, text, tsDoc)
         );
     };
 }
 
-/**
- * During compilation to tsx, for each store we create an additional variable
- * called `$<store-name>` which contains the store value.
- * This variable declaration does not show up in the sourcemaps.
- * We have to ignore the error if the variable prefixed by `$` was not a store.
- */
-function isNotHiddenStoreValueDeclaration(
-    diagnostic: Diagnostic,
-    tsDoc: SvelteDocumentSnapshot,
-    rawTsDiagnostic: ts.Diagnostic
-): boolean {
-    if (diagnostic.code !== 2345 || !rawTsDiagnostic.start) return true;
-
-    const affectedLine = tsDoc.getLineContainingOffset(rawTsDiagnostic.start);
-    const hasStoreValueDefinition = /let \$[\w$]+ = __sveltets_store_get\(/.test(affectedLine);
-
-    return !hasStoreValueDefinition;
-}
-
 /**
  * Variable used before being assigned, can happen when  you do `export let x`
  * without assigning a value in strict mode. Should not throw an error here
diff --git a/packages/language-server/test/plugins/typescript/features/FindReferencesProvider.test.ts b/packages/language-server/test/plugins/typescript/features/FindReferencesProvider.test.ts
@@ -101,20 +101,6 @@ describe('FindReferencesProvider', () => {
                 },
                 uri: getUri('find-references-$store.svelte')
             },
-            // TODO this one should be filtered out
-            {
-                range: {
-                    end: {
-                        character: 30,
-                        line: 1
-                    },
-                    start: {
-                        character: 30,
-                        line: 1
-                    }
-                },
-                uri: getUri('find-references-$store.svelte')
-            },
             {
                 range: {
                     end: {
diff --git a/packages/svelte2tsx/src/svelte2tsx/nodes/ImplicitStoreValues.ts b/packages/svelte2tsx/src/svelte2tsx/nodes/ImplicitStoreValues.ts
@@ -1,5 +1,6 @@
 import MagicString from 'magic-string';
 import ts from 'typescript';
+import { surroundWithIgnoreComments } from '../../utils/ignore';
 import { extractIdentifiers, getNamesFromLabeledStatement } from '../utils/tsAst';
 
 /**
@@ -53,17 +54,19 @@ export class ImplicitStoreValues {
         const storeNames = extractIdentifiers(node.name)
             .map((id) => id.text)
             .filter((name) => this.accessedStores.has(name));
-
-        let toAppend = '';
-        for (let i = 0; i < storeNames.length; i++) {
-            toAppend += `;let $${storeNames[i]} = __sveltets_store_get(${storeNames[i]});`;
+        if (!storeNames.length) {
+            return;
         }
 
+        const storeDeclarations = surroundWithIgnoreComments(
+            this.createStoreDeclarations(storeNames)
+        );
         const nodeEnd =
             ts.isVariableDeclarationList(node.parent) && node.parent.declarations.length > 1
                 ? node.parent.declarations[node.parent.declarations.length - 1].getEnd()
                 : node.getEnd();
-        str.appendRight(nodeEnd + astOffset, toAppend);
+
+        str.appendRight(nodeEnd + astOffset, storeDeclarations);
     }
 
     private attachStoreValueDeclarationToReactiveAssignment(
@@ -74,14 +77,16 @@ export class ImplicitStoreValues {
         const storeNames = getNamesFromLabeledStatement(node).filter((name) =>
             this.accessedStores.has(name)
         );
-
-        let toAppend = '';
-        for (let i = 0; i < storeNames.length; i++) {
-            toAppend += `;let $${storeNames[i]} = __sveltets_store_get(${storeNames[i]});`;
+        if (!storeNames.length) {
+            return;
         }
 
+        const storeDeclarations = surroundWithIgnoreComments(
+            this.createStoreDeclarations(storeNames)
+        );
         const endPos = node.getEnd() + astOffset;
-        str.appendRight(endPos, toAppend);
+
+        str.appendRight(endPos, storeDeclarations);
     }
 
     private attachStoreValueDeclarationToImport(
@@ -90,9 +95,22 @@ export class ImplicitStoreValues {
         str: MagicString
     ) {
         const storeName = node.name.getText();
+        const storeDeclaration = surroundWithIgnoreComments(this.createStoreDeclaration(storeName));
         const importStatement = ts.isImportClause(node) ? node.parent : node.parent.parent.parent;
-
         const endPos = importStatement.getEnd() + astOffset;
-        str.appendRight(endPos, `;let $${storeName} = __sveltets_store_get(${storeName});`);
+
+        str.appendRight(endPos, storeDeclaration);
+    }
+
+    private createStoreDeclarations(storeNames: string[]): string {
+        let declarations = '';
+        for (let i = 0; i < storeNames.length; i++) {
+            declarations += this.createStoreDeclaration(storeNames[i]);
+        }
+        return declarations;
+    }
+
+    private createStoreDeclaration(storeName: string): string {
+        return `;let $${storeName} = __sveltets_store_get(${storeName});`;
     }
 }
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/$store-assign/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/$store-assign/expected.tsx
@@ -1,7 +1,7 @@
 ///<reference types="svelte" />
 <></>;function render() {
 
-    const store = writable([]);let $store = __sveltets_store_get(store);;
+    const store = writable([])/*Ωignore_startΩ*/;let $store = __sveltets_store_get(store);/*Ωignore_endΩ*/;
 
     ;(__sveltets_store_get(store), $store)[1] = true;
     ;(__sveltets_store_get(store), $store).foo = true;
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/await-with-$store/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/await-with-$store/expected.tsx
@@ -4,7 +4,7 @@ import { readable } from 'svelte/store';
 function render() {
 
 	
-	const store = readable(Promise.resolve('test'), () => {});let $store = __sveltets_store_get(store);;
+	const store = readable(Promise.resolve('test'), () => {})/*Ωignore_startΩ*/;let $store = __sveltets_store_get(store);/*Ωignore_endΩ*/;
 ;
 () => (<>
 
@@ -16,4 +16,4 @@ function render() {
 return { props: {}, slots: {}, getters: {}, events: {} }}
 
 export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial(__sveltets_with_any_event(render))) {
-}
+}
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/nested-$-variables-script/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/nested-$-variables-script/expected.tsx
@@ -1,8 +1,8 @@
 ///<reference types="svelte" />
 <></>;function render() {
 
-let top1 = someStore();let $top1 = __sveltets_store_get(top1);
-let top2 = someStore();let $top2 = __sveltets_store_get(top2);
+let top1 = someStore()/*Ωignore_startΩ*/;let $top1 = __sveltets_store_get(top1);/*Ωignore_endΩ*/
+let top2 = someStore()/*Ωignore_startΩ*/;let $top2 = __sveltets_store_get(top2);/*Ωignore_endΩ*/
 let topLevelGet = (__sveltets_store_get(top1), $top1)
 topLevelGet = (__sveltets_store_get(top2), $top2)
 
@@ -26,4 +26,4 @@ const test4 = ({a,  b: { $top1: $top2 }}) => $top2 && (__sveltets_store_get(top1
 return { props: {}, slots: {}, getters: {}, events: {} }}
 
 export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial(__sveltets_with_any_event(render))) {
-}
+}
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/store-destructuring/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/store-destructuring/expected.tsx
@@ -1,9 +1,9 @@
 ///<reference types="svelte" />
 <></>;function render() {
 
-    const store = fromSomewhere();let $store = __sveltets_store_get(store);;
-    const { store1, store2, noStore } = fromSomewhere();let $store1 = __sveltets_store_get(store1);;let $store2 = __sveltets_store_get(store2);;
-    const [ store3, store4, noStore ] = fromSomewhere();let $store3 = __sveltets_store_get(store3);;let $store4 = __sveltets_store_get(store4);;
+    const store = fromSomewhere()/*Ωignore_startΩ*/;let $store = __sveltets_store_get(store);/*Ωignore_endΩ*/;
+    const { store1, store2, noStore } = fromSomewhere()/*Ωignore_startΩ*/;let $store1 = __sveltets_store_get(store1);;let $store2 = __sveltets_store_get(store2);/*Ωignore_endΩ*/;
+    const [ store3, store4, noStore ] = fromSomewhere()/*Ωignore_startΩ*/;let $store3 = __sveltets_store_get(store3);;let $store4 = __sveltets_store_get(store4);/*Ωignore_endΩ*/;
 ;
 () => (<>
 <p>{(__sveltets_store_get(store), $store)}</p>
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/store-from-module/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/store-from-module/expected.tsx
@@ -1,8 +1,8 @@
 ///<reference types="svelte" />
 <></>;
-    import {store1, store2} from './store';;let $store1 = __sveltets_store_get(store1);;let $store2 = __sveltets_store_get(store2);
-    const store3 = writable('');let $store3 = __sveltets_store_get(store3);;
-    const store4 = writable('');let $store4 = __sveltets_store_get(store4);;
+    import {store1, store2} from './store';/*Ωignore_startΩ*/;let $store1 = __sveltets_store_get(store1);/*Ωignore_endΩ*//*Ωignore_startΩ*/;let $store2 = __sveltets_store_get(store2);/*Ωignore_endΩ*/
+    const store3 = writable('')/*Ωignore_startΩ*/;let $store3 = __sveltets_store_get(store3);/*Ωignore_endΩ*/;
+    const store4 = writable('')/*Ωignore_startΩ*/;let $store4 = __sveltets_store_get(store4);/*Ωignore_endΩ*/;
 ;<></>;function render() {
 
     ;(__sveltets_store_get(store1), $store1);
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/store-from-reactive-assignment/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/store-from-reactive-assignment/expected.tsx
@@ -1,9 +1,9 @@
 ///<reference types="svelte" />
 <></>;function render() {
 
-    let  store = __sveltets_invalidate(() => fromSomewhere());;let $store = __sveltets_store_get(store);
-    let  { store1, noStore } = __sveltets_invalidate(() => fromSomewhere());;let $store1 = __sveltets_store_get(store1);
-    let  [ store2, noStore ] = __sveltets_invalidate(() => fromSomewhere());;let $store2 = __sveltets_store_get(store2);
+    let  store = __sveltets_invalidate(() => fromSomewhere());/*Ωignore_startΩ*/;let $store = __sveltets_store_get(store);/*Ωignore_endΩ*/
+    let  { store1, noStore } = __sveltets_invalidate(() => fromSomewhere());/*Ωignore_startΩ*/;let $store1 = __sveltets_store_get(store1);/*Ωignore_endΩ*/
+    let  [ store2, noStore ] = __sveltets_invalidate(() => fromSomewhere());/*Ωignore_startΩ*/;let $store2 = __sveltets_store_get(store2);/*Ωignore_endΩ*/
 ;
 () => (<>
 <p>{(__sveltets_store_get(store), $store)}</p>
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/store-import/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/store-import/expected.tsx
@@ -5,9 +5,9 @@ import { storeB } from './store';
 import { storeB as storeC } from './store';
 function render() {
 
-    ;let $storeA = __sveltets_store_get(storeA);
-    ;let $storeB = __sveltets_store_get(storeB);
-    ;let $storeC = __sveltets_store_get(storeC);
+    /*Ωignore_startΩ*/;let $storeA = __sveltets_store_get(storeA);/*Ωignore_endΩ*/
+    /*Ωignore_startΩ*/;let $storeB = __sveltets_store_get(storeB);/*Ωignore_endΩ*/
+    /*Ωignore_startΩ*/;let $storeC = __sveltets_store_get(storeC);/*Ωignore_endΩ*/
 ;
 () => (<>
 
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/store-property-access/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/store-property-access/expected.tsx
@@ -1,7 +1,7 @@
 ///<reference types="svelte" />
 <></>;function render() {
 
-    const store = someStore();let $store = __sveltets_store_get(store);;
+    const store = someStore()/*Ωignore_startΩ*/;let $store = __sveltets_store_get(store);/*Ωignore_endΩ*/;
     ;(__sveltets_store_get(store), $store);
     ;(__sveltets_store_get(store), $store).prop;
     ;(__sveltets_store_get(store), $store)['prop'];
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/uses-$store-multiple-variable-declaration/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/uses-$store-multiple-variable-declaration/expected.tsx
@@ -1,10 +1,10 @@
 ///<reference types="svelte" />
 <></>;function render() {
 
-    const store1 = '', store2 = '';let $store1 = __sveltets_store_get(store1);;let $store2 = __sveltets_store_get(store2);;
-    const { store3, store4 } = '', [ store5, store6 ] = '';let $store3 = __sveltets_store_get(store3);;let $store4 = __sveltets_store_get(store4);;let $store5 = __sveltets_store_get(store5);;let $store6 = __sveltets_store_get(store6);;
-    let  {store7, store8} = __sveltets_invalidate(() => '');;let $store7 = __sveltets_store_get(store7);;let $store8 = __sveltets_store_get(store8);
-    let  [store9, store10] = __sveltets_invalidate(() => '');;let $store9 = __sveltets_store_get(store9);;let $store10 = __sveltets_store_get(store10);
+    const store1 = '', store2 = ''/*Ωignore_startΩ*/;let $store1 = __sveltets_store_get(store1);/*Ωignore_endΩ*//*Ωignore_startΩ*/;let $store2 = __sveltets_store_get(store2);/*Ωignore_endΩ*/;
+    const { store3, store4 } = '', [ store5, store6 ] = ''/*Ωignore_startΩ*/;let $store3 = __sveltets_store_get(store3);;let $store4 = __sveltets_store_get(store4);/*Ωignore_endΩ*//*Ωignore_startΩ*/;let $store5 = __sveltets_store_get(store5);;let $store6 = __sveltets_store_get(store6);/*Ωignore_endΩ*/;
+    let  {store7, store8} = __sveltets_invalidate(() => '');/*Ωignore_startΩ*/;let $store7 = __sveltets_store_get(store7);;let $store8 = __sveltets_store_get(store8);/*Ωignore_endΩ*/
+    let  [store9, store10] = __sveltets_invalidate(() => '');/*Ωignore_startΩ*/;let $store9 = __sveltets_store_get(store9);;let $store10 = __sveltets_store_get(store10);/*Ωignore_endΩ*/
 ;
 () => (<>
 
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/uses-$store-with-assignment-operators/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/uses-$store-with-assignment-operators/expected.tsx
@@ -4,7 +4,7 @@ import { writable } from 'svelte/store';
 function render() {
 
   
-  const count = writable(0);let $count = __sveltets_store_get(count);;
+  const count = writable(0)/*Ωignore_startΩ*/;let $count = __sveltets_store_get(count);/*Ωignore_endΩ*/;
   let myvar = 42 // to show that this is different from ++ or --
   const handler1 = () => count.set( $count + myvar)
   const handler2 = () => count.set( $count - myvar)
@@ -36,4 +36,4 @@ function render() {
 return { props: {}, slots: {}, getters: {}, events: {} }}
 
 export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial(__sveltets_with_any_event(render))) {
-}
+}
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/uses-$store-with-exclamation-mark/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/uses-$store-with-exclamation-mark/expected.tsx
@@ -4,7 +4,7 @@ import { writable } from 'svelte/store';
 function render() {
 
   
-  const count = writable(0);let $count = __sveltets_store_get(count);;
+  const count = writable(0)/*Ωignore_startΩ*/;let $count = __sveltets_store_get(count);/*Ωignore_endΩ*/;
   const handler1 = () => !(__sveltets_store_get(count), $count)
 ;
 () => (<>
@@ -13,4 +13,4 @@ function render() {
 return { props: {}, slots: {}, getters: {}, events: {} }}
 
 export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial(__sveltets_with_any_event(render))) {
-}
+}
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/uses-$store-with-increments/expected.tsx b/packages/svelte2tsx/test/svelte2tsx/samples/uses-$store-with-increments/expected.tsx
@@ -4,7 +4,7 @@ import { writable } from 'svelte/store';
 function render() {
 
   
-  const count = writable(0);let $count = __sveltets_store_get(count);;
+  const count = writable(0)/*Ωignore_startΩ*/;let $count = __sveltets_store_get(count);/*Ωignore_endΩ*/;
   const handler1 = () => count.set( $count + 1)
   const handler2 = () => count.set( $count - 1)
 ;
@@ -16,4 +16,4 @@ function render() {
 return { props: {}, slots: {}, getters: {}, events: {} }}
 
 export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial(__sveltets_with_any_event(render))) {
-}
+}
