Merge pull request #4 from storybookjs/fix/standalone-expressions

Fix standalone JSX expressions
storybookjs · May 5, 2022 · 598a1d2 · 598a1d2
2 parents 6871bf0 + f504c97
commit 598a1d2
Show file tree

Hide file tree

Showing 2 changed files with 66 additions and 52 deletions.
diff --git a/src/mdx2.test.ts b/src/mdx2.test.ts
@@ -59,57 +59,71 @@ describe('mdx2', () => {
     `;
     // @ts-ignore
     expect(compileSync(input)).toMatchInlineSnapshot(`
-/*@jsxRuntime automatic @jsxImportSource react*/
-import { assertIsFn, AddContext } from "@storybook/addon-docs";
-import {Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs} from "react/jsx-runtime";
-function MDXContent(props = {}) {
-  const {wrapper: MDXLayout} = props.components || ({});
-  return MDXLayout ? _jsx(MDXLayout, Object.assign({}, props, {
-    children: _jsx(_createMdxContent, {})
-  })) : _createMdxContent();
-  function _createMdxContent() {
-    const _components = Object.assign({
-      h1: "h1",
-      p: "p"
-    }, props.components), {Meta, Story} = _components;
-    if (!Meta) _missingMdxReference("Meta", true);
-    if (!Story) _missingMdxReference("Story", true);
-    return _jsxs(_Fragment, {
-      children: [_jsx(_components.h1, {
-        children: "hello"
-      }), "\\n", _jsx(Meta, {
-        title: "foobar"
-      }), "\\n", _jsxs(_components.p, {
-        children: ["world ", 2 + 1]
-      }), "\\n", _jsx(Story, {
-        name: "foo",
-        children: "bar"
-      })]
-    });
-  }
-}
-function _missingMdxReference(id, component) {
-  throw new Error("Expected " + (component ? "component" : "object") + " \`" + id + "\` to be defined: you likely forgot to import, pass, or provide it.");
-}
-// =========
-export const foo = () => (
-          "bar"
-        );
-foo.storyName = 'foo';
-foo.parameters = { storySource: { source: '\\"bar\\"' } };
-
-const componentMeta = { title: 'foobar', includeStories: ["foo"],  };
-
-const mdxStoryNameToKey = {"foo":"foo"};
-
-componentMeta.parameters = componentMeta.parameters || {};
-componentMeta.parameters.docs = {
-  ...(componentMeta.parameters.docs || {}),
-  page: () => <AddContext mdxStoryNameToKey={mdxStoryNameToKey} mdxComponentAnnotations={componentMeta}><MDXContent /></AddContext>,
-};
+      /*@jsxRuntime automatic @jsxImportSource react*/
+      import { assertIsFn, AddContext } from "@storybook/addon-docs";
+      import {Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs} from "react/jsx-runtime";
+      function MDXContent(props = {}) {
+        const {wrapper: MDXLayout} = props.components || ({});
+        return MDXLayout ? _jsx(MDXLayout, Object.assign({}, props, {
+          children: _jsx(_createMdxContent, {})
+        })) : _createMdxContent();
+        function _createMdxContent() {
+          const _components = Object.assign({
+            h1: "h1",
+            p: "p"
+          }, props.components), {Meta, Story} = _components;
+          if (!Meta) _missingMdxReference("Meta", true);
+          if (!Story) _missingMdxReference("Story", true);
+          return _jsxs(_Fragment, {
+            children: [_jsx(_components.h1, {
+              children: "hello"
+            }), "\\n", _jsx(Meta, {
+              title: "foobar"
+            }), "\\n", _jsxs(_components.p, {
+              children: ["world ", 2 + 1]
+            }), "\\n", _jsx(Story, {
+              name: "foo",
+              children: "bar"
+            })]
+          });
+        }
+      }
+      function _missingMdxReference(id, component) {
+        throw new Error("Expected " + (component ? "component" : "object") + " \`" + id + "\` to be defined: you likely forgot to import, pass, or provide it.");
+      }
+      // =========
+      export const foo = () => (
+                "bar"
+              );
+      foo.storyName = 'foo';
+      foo.parameters = { storySource: { source: '\\"bar\\"' } };
+
+      const componentMeta = { title: 'foobar', includeStories: ["foo"],  };
+
+      const mdxStoryNameToKey = {"foo":"foo"};
+
+      componentMeta.parameters = componentMeta.parameters || {};
+      componentMeta.parameters.docs = {
+        ...(componentMeta.parameters.docs || {}),
+        page: () => <AddContext mdxStoryNameToKey={mdxStoryNameToKey} mdxComponentAnnotations={componentMeta}><MDXContent /></AddContext>,
+      };
+
+      export default componentMeta;
+    `);
+  });
 
-export default componentMeta;
-`);
+  it('standalone jsx expressions', () => {
+    expect(
+      clean(dedent`
+        # Standalone JSX expressions
+
+        {3 + 3}
+      `)
+    ).toMatchInlineSnapshot(`
+      const componentMeta = { includeStories: [] };
+
+      const mdxStoryNameToKey = {};
+    `);
   });
 });
 

diff --git a/src/mdx2.ts b/src/mdx2.ts
@@ -73,8 +73,8 @@ function extractExports(root: t.File, options: CompilerOptions) {
             });
           }
         }
-      } else if (t.isJSXExpressionContainer(child) && t.isStringLiteral(child.expression)) {
-        // Skip string literals
+      } else if (t.isJSXExpressionContainer(child)) {
+        // Skip string literals & other JSX expressions
       } else {
         throw new Error(`Unexpected JSX child: ${child.type}`);
       }