fix type issues related to ExpressionTag vs `Array<ExpressionTag | …

…Text>`
storybookjs · Sep 5, 2024 · 5ccac52 · 5ccac52
1 parent ed9a651
commit 5ccac52
Show file tree

Hide file tree

Showing 4 changed files with 100 additions and 34 deletions.
diff --git a/src/parser/analyse/story/attributes.ts b/src/parser/analyse/story/attributes.ts
@@ -24,7 +24,11 @@ export function getStringValueFromAttribute(params: Params) {
     throw new AttributeNotStringError({ filename, component, attribute: node });
   }
 
-  if (value.type === 'ExpressionTag' && value.expression.type === 'Literal') {
+  if (
+    !Array.isArray(value) &&
+    value.type === 'ExpressionTag' &&
+    value.expression.type === 'Literal'
+  ) {
     return value.expression.value;
   }
 
@@ -52,11 +56,44 @@ export function getArrayOfStringsValueFromAttribute(params: Params) {
 
   const { value } = node;
 
-  if (
-    value === true ||
-    value.type !== 'ExpressionTag' ||
-    value.expression.type !== 'ArrayExpression'
-  ) {
+  if (value === true) {
+    throw new AttributeNotArrayError({
+      component,
+      filename,
+      attribute: node,
+    });
+  }
+
+  // value is SvelteAST.ExpressionTag
+  if (!Array.isArray(value)) {
+    if (value.expression.type !== 'ArrayExpression') {
+      throw new AttributeNotArrayError({
+        component,
+        filename,
+        attribute: node,
+      });
+    }
+
+    let arrayOfStrings: string[] = [];
+
+    for (const element of value.expression.elements) {
+      if (element?.type !== 'Literal' || typeof element.value !== 'string') {
+        throw new AttributeNotArrayOfStringsError({
+          filename,
+          component,
+          attribute: node,
+          element,
+        });
+      }
+
+      arrayOfStrings.push(element.value);
+    }
+
+    return arrayOfStrings;
+  }
+
+  // value is Array<SvelteAST.ExpressionTag | SvelteAST.Text> - I haven't figured out when it would happen
+  if (value[0].type !== 'ExpressionTag' || value[0].expression.type !== 'ArrayExpression') {
     throw new AttributeNotArrayError({
       component,
       filename,
@@ -66,7 +103,7 @@ export function getArrayOfStringsValueFromAttribute(params: Params) {
 
   const arrayOfStrings: string[] = [];
 
-  for (const element of value.expression.elements) {
+  for (const element of value[0].expression.elements) {
     if (element?.type !== 'Literal' || typeof element.value !== 'string') {
       throw new AttributeNotArrayOfStringsError({
         filename,

diff --git a/src/parser/extract/svelte/snippet-block.ts b/src/parser/extract/svelte/snippet-block.ts
@@ -16,7 +16,6 @@ import {
  * {#snippet myTemplate()}
  *   <SomeComponent color="red" />
  * {/snippet}
- *
  * <Story children={myTemplate} />
  * ```
  *
@@ -40,7 +39,32 @@ export function findStoryAttributeChildrenSnippetBlock(options: {
 
   const { value } = children;
 
-  if (value === true || value.type !== 'ExpressionTag' || value.expression.type !== 'Identifier') {
+  if (value === true) {
+    throw new InvalidStoryChildrenAttributeError({
+      component: component,
+      childrenAttribute: children,
+      filename,
+    });
+  }
+
+  // value is SvelteAST.ExpressionTag
+  if (!Array.isArray(value)) {
+    if (value.expression.type !== 'Identifier') {
+      throw new InvalidStoryChildrenAttributeError({
+        component: component,
+        childrenAttribute: children,
+        filename,
+      });
+    }
+
+    return findSnippetBlockByName({
+      name: value.expression.name,
+      nodes: nodes,
+    });
+  }
+
+  // value is Array<SvelteAST.ExpressionTag | SvelteAST.Text> - I haven't figured out when it would happen
+  if (value[0].type !== 'ExpressionTag') {
     throw new InvalidStoryChildrenAttributeError({
       component: component,
       childrenAttribute: children,
@@ -49,7 +73,7 @@ export function findStoryAttributeChildrenSnippetBlock(options: {
   }
 
   return findSnippetBlockByName({
-    name: value.expression.name,
+    name: value[0].expression.name,
     nodes: nodes,
   });
 }

diff --git a/src/utils/error.ts b/src/utils/error.ts
@@ -119,26 +119,30 @@ export abstract class StorybookSvelteCSFError extends Error {
     const { attributes } = this.component;
 
     for (const attribute of attributes) {
-      if (attribute.type === 'Attribute' && attribute.name === 'name' && attribute.value !== true) {
-        if (attribute.value.type === 'ExpressionTag') {
-          return attribute.value.expression.value;
-        }
-
-        if (attribute.value[0].type === 'Text') {
-          return attribute.value[0].data;
-        }
-
-        if (attribute.value[0].type === 'Text') {
-          return attribute.value[0].data;
-        }
-
-        if (
-          attribute.value[0].type === 'ExpressionTag' &&
-          attribute.value[0].expression.type === 'Literal' &&
-          typeof attribute.value[0].expression.value === 'string'
-        ) {
-          return attribute.value[0].expression.value;
-        }
+      if (attribute.type !== 'Attribute') {
+        // NOTE: Nothing to do with this case - invalid tbh
+        continue;
+      }
+
+      if (attribute.value === true) {
+        // NOTE: Nothing to do with this case - invalid tbh
+        continue;
+      }
+
+      // value is SvelteAST.ExpressionTag
+      if (!Array.isArray(attribute.value)) {
+        return attribute.value.expression.value;
+      }
+
+      if (attribute.value[0].type === 'Text') {
+        return attribute.value[0].data;
+      }
+
+      if (
+        attribute.value[0].expression.type === 'Literal' &&
+        typeof attribute.value[0].expression.value === 'string'
+      ) {
+        return attribute.value[0].expression.value;
       }
     }
   }

diff --git a/src/utils/error/parser/analyse/story.ts b/src/utils/error/parser/analyse/story.ts
@@ -61,8 +61,9 @@ export class AttributeNotArrayError extends StorybookSvelteCSFError {
       return true;
     }
 
-    if (value.type === 'ExpressionTag') {
-      return value.expression.value;
+    // value is SvelteAST.ExpressionTag
+    if (!Array.isArray(value)) {
+      return (value.expression as ESTreeAST.Literal).value;
     }
 
     if (value[0].type === 'Text') {
@@ -114,8 +115,8 @@ export class AttributeNotArrayOfStringsError extends StorybookSvelteCSFError {
       return true;
     }
 
-    if (value.type === 'ExpressionTag') {
-      return value.expression.value;
+    if (!Array.isArray(value)) {
+      return (value.expression as ESTreeAST.Literal).value;
     }
 
     if (value[0].type === 'Text') {