fix: missing ts node for key of shorthand attribute (#238)

* fix: missing ts node for key of shorthand attribute

* Create chilly-experts-reply.md

* fix: for old parsers

Author: ota-meshi

Diff for: .changeset/chilly-experts-reply.md

@@ -0,0 +1,5 @@
+---
+"svelte-eslint-parser": patch
+---
+
+fix: missing ts node for key of shorthand attribute

Diff for: src/context/script-let.ts

@@ -107,6 +107,11 @@ type RestoreCallback = {
 
 type TypeGenHelper = { generateUniqueId: (base: string) => string };
 
+type ObjectShorthandProperty = ESTree.Property & {
+  key: ESTree.Identifier;
+  value: ESTree.Identifier;
+};
+
 /**
  * A class that handles script fragments.
  * The script fragment AST node remaps and connects to the original directive AST node.
@@ -185,6 +190,40 @@ export class ScriptLetContext {
     return callbacks;
   }
 
+  public addObjectShorthandProperty(
+    identifier: SvelteName,
+    parent: SvelteNode,
+    ...callbacks: ScriptLetCallback<ObjectShorthandProperty>[]
+  ): void {
+    const range = getNodeRange(identifier);
+    const part = this.ctx.code.slice(...range);
+    this.appendScript(
+      `({${part}});`,
+      range[0] - 2,
+      (st, tokens, _comments, result) => {
+        const exprSt = st as ESTree.ExpressionStatement;
+        const objectExpression: ESTree.ObjectExpression =
+          exprSt.expression as ESTree.ObjectExpression;
+        const node = objectExpression.properties[0] as ObjectShorthandProperty;
+        // Process for nodes
+        for (const callback of callbacks) {
+          callback(node, result);
+        }
+        (node.key as any).parent = parent;
+        (node.value as any).parent = parent;
+
+        tokens.shift(); // (
+        tokens.shift(); // {
+        tokens.pop(); // }
+        tokens.pop(); // )
+        tokens.pop(); // ;
+
+        // Disconnect the tree structure.
+        exprSt.expression = null as never;
+      }
+    );
+  }
+
   public addVariableDeclarator(
     expression: ESTree.AssignmentExpression,
     parent: SvelteNode,

Diff for: src/parser/converts/attr.ts

@@ -180,8 +180,15 @@ function convertAttribute(
       range: attribute.range,
     };
     (key as any).parent = sAttr;
-    ctx.scriptLet.addExpression(key, sAttr, null, (es) => {
-      sAttr.value = es;
+    ctx.scriptLet.addObjectShorthandProperty(attribute.key, sAttr, (es) => {
+      if (
+        // FIXME: Older parsers may use the same node. In that case, do not replace.
+        // We will drop support for ESLint v7 in the next major version and remove this branch.
+        es.key !== es.value
+      ) {
+        sAttr.key = es.key;
+      }
+      sAttr.value = es.value;
     });
     return sAttr;
   }

Diff for: tests/fixtures/parser/ast/ts-shorthand-attr01-input.svelte

@@ -0,0 +1,6 @@
+<script lang="ts">
+	const src = 'Hello';
+</script>
+
+<img src={src} alt="foo">
+<img {src} alt="foo">