(fix) don't track propertyName of named import alias (#551)

#549
Don't track `a` in `import {a as b} from ..` as a declared variable

Author: dummdidumm

packages/svelte2tsx/src/svelte2tsx/processInstanceScriptContent.ts

@@ -1,7 +1,11 @@
 import MagicString from 'magic-string';
 import { Node } from 'estree-walker';
 import * as ts from 'typescript';
-import { findExportKeyword, getBinaryAssignmentExpr } from './utils/tsAst';
+import {
+    findExportKeyword,
+    getBinaryAssignmentExpr,
+    isNotPropertyNameOfImport,
+} from './utils/tsAst';
 import { ExportedNames } from './nodes/ExportedNames';
 import { ImplicitTopLevelNames } from './nodes/ImplicitTopLevelNames';
 import { ComponentEvents } from './nodes/ComponentEvents';
@@ -231,7 +235,10 @@ export function processInstanceScriptContent(
         }
 
         if (isDeclaration || ts.isParameter(parent)) {
-            if (!ts.isBindingElement(ident.parent) || ident.parent.name == ident) {
+            if (
+                isNotPropertyNameOfImport(ident) &&
+                (!ts.isBindingElement(ident.parent) || ident.parent.name == ident)
+            ) {
                 // we are a key, not a name, so don't care
                 if (ident.text.startsWith('$') || scope == rootScope) {
                     // track all top level declared identifiers and all $ prefixed identifiers

packages/svelte2tsx/src/svelte2tsx/utils/tsAst.ts

@@ -134,3 +134,13 @@ export function getLeadingDoc(node: ts.Node): string | undefined {
         return nodeText.substring(comment.pos, comment.end);
     }
 }
+
+/**
+ * Returns true if given identifier is not the property name of an aliased import.
+ * In other words: It is not `a` in `import {a as b} from ..`
+ */
+export function isNotPropertyNameOfImport(identifier: ts.Identifier): boolean {
+    return (
+        !ts.isImportSpecifier(identifier.parent) || identifier.parent.propertyName !== identifier
+    );
+}

packages/svelte2tsx/test/svelte2tsx/samples/reactive-declare-same-name-as-import/expected.tsx

@@ -0,0 +1,16 @@
+///<reference types="svelte" />
+<></>;
+import { b as c } from "foo";
+function render() {
+
+
+let  b = __sveltets_invalidate(() => 7);
+
+let a;
+$: a = __sveltets_invalidate(() => 5);
+;
+() => (<></>);
+return { props: {}, slots: {}, getters: {}, events: {} }}
+
+export default class Input__SvelteComponent_ extends createSvelte2TsxComponent(__sveltets_partial(__sveltets_with_any_event(render))) {
+}

packages/svelte2tsx/test/svelte2tsx/samples/reactive-declare-same-name-as-import/input.svelte

@@ -0,0 +1,7 @@
+<script>
+import { b as c } from "foo";
+$: b = 7;
+
+let a;
+$: a = 5;
+</script>