Fix dynamic import when the module source is a template literal (#16267)

prettier · May 11, 2024 · 26f1cd9 · 26f1cd9
1 parent 5518166
commit 26f1cd9
Show file tree

Hide file tree

Showing 6 changed files with 138 additions and 5 deletions.
diff --git a/changelog_unreleased/javascript/16267.md b/changelog_unreleased/javascript/16267.md
@@ -0,0 +1,19 @@
+#### Fix dynamic import when the module source is a template string (#16267 by @fisker)
+
+<!-- prettier-ignore -->
+```jsx
+// Input
+const module = await import(`data:text/javascript,
+  console.log("RUN");
+`);
+
+// Prettier stable
+const module = await (`data:text/javascript,
+  console.log("RUN");
+`);
+
+// Prettier main
+const module = await import(`data:text/javascript,
+  console.log("RUN");
+`);
+```
diff --git a/src/language-js/print/call-expression.js b/src/language-js/print/call-expression.js
@@ -45,7 +45,7 @@ function printCallExpression(path, options, print) {
     if (!(isTemplateLiteralSingleArg && printed[0].label?.embed)) {
       return [
         isNew ? "new " : "",
-        print("callee"),
+        isDynamicImport ? printDynamicImportCallee(node) : print("callee"),
         optional,
         printFunctionTypeParameters(path, options, print),
         "(",

diff --git a/tests/format/js/dynamic-import/__snapshots__/format.test.js.snap b/tests/format/js/dynamic-import/__snapshots__/format.test.js.snap
@@ -45,6 +45,106 @@ import("./foo.json", { assert: { type: "json" } });
 ================================================================================
 `;
 
+exports[`import-phase.js [acorn] format 1`] = `
+"The only valid meta property for import is 'import.meta' (1:8)
+> 1 | import.source(\`data:text/javascript,
+    |        ^
+  2 |     console.log("RUN");
+  3 | \`)
+  4 |
+Cause: The only valid meta property for import is 'import.meta' (1:7)"
+`;
+
+exports[`import-phase.js [espree] format 1`] = `
+"The only valid meta property for import is 'import.meta' (1:8)
+> 1 | import.source(\`data:text/javascript,
+    |        ^
+  2 |     console.log("RUN");
+  3 | \`)
+  4 |
+Cause: The only valid meta property for import is 'import.meta'"
+`;
+
+exports[`import-phase.js [flow] format 1`] = `
+"Unexpected identifier, expected the identifier \`meta\` (1:8)
+> 1 | import.source(\`data:text/javascript,
+    |        ^^^^^^
+  2 |     console.log("RUN");
+  3 | \`)
+  4 |"
+`;
+
+exports[`import-phase.js [meriyah] format 1`] = `
+"Unexpected token: 'identifier' (1:13)
+> 1 | import.source(\`data:text/javascript,
+    |             ^
+  2 |     console.log("RUN");
+  3 | \`)
+  4 |
+Cause: [1:13]: Unexpected token: 'identifier'"
+`;
+
+exports[`import-phase.js format 1`] = `
+====================================options=====================================
+parsers: ["babel", "flow", "typescript"]
+printWidth: 80
+                                                                                | printWidth
+=====================================input======================================
+import.source(\`data:text/javascript,
+    console.log("RUN");
+\`)
+
+import.source(String.raw\`data:text/javascript,
+    console.log("RUN");
+\`)
+
+=====================================output=====================================
+import.source(\`data:text/javascript,
+    console.log("RUN");
+\`);
+
+import.source(String.raw\`data:text/javascript,
+    console.log("RUN");
+\`);
+
+================================================================================
+`;
+
+exports[`template-literal.js [flow] format 1`] = `
+"Unexpected token \`import\`, expected the end of an expression statement (\`;\`) (1:20)
+> 1 | module   =   await import(\`data:text/javascript,
+    |                    ^^^^^^
+  2 |     console.log("RUN");
+  3 | \`);
+  4 |"
+`;
+
+exports[`template-literal.js format 1`] = `
+====================================options=====================================
+parsers: ["babel", "flow", "typescript"]
+printWidth: 80
+                                                                                | printWidth
+=====================================input======================================
+module   =   await import(\`data:text/javascript,
+    console.log("RUN");
+\`);
+
+module   =   await import(String.raw\`data:text/javascript,
+    console.log("RUN");
+\`);
+
+=====================================output=====================================
+module = await import(\`data:text/javascript,
+    console.log("RUN");
+\`);
+
+module = await import(String.raw\`data:text/javascript,
+    console.log("RUN");
+\`);
+
+================================================================================
+`;
+
 exports[`test.js format 1`] = `
 ====================================options=====================================
 parsers: ["babel", "flow", "typescript"]

diff --git a/tests/format/js/dynamic-import/format.test.js b/tests/format/js/dynamic-import/format.test.js
@@ -1,8 +1,8 @@
 runFormatTest(import.meta, ["babel", "flow", "typescript"], {
   errors: {
-    flow: ["assertions.js"],
-    acorn: ["assertions.js"],
-    espree: ["assertions.js"],
-    meriyah: ["assertions.js"],
+    flow: ["assertions.js", "template-literal.js", "import-phase.js"],
+    acorn: ["assertions.js", "import-phase.js"],
+    espree: ["assertions.js", "import-phase.js"],
+    meriyah: ["assertions.js", "import-phase.js"],
   },
 });
diff --git a/tests/format/js/dynamic-import/import-phase.js b/tests/format/js/dynamic-import/import-phase.js
@@ -0,0 +1,7 @@
+import.source(`data:text/javascript,
+    console.log("RUN");
+`)
+
+import.source(String.raw`data:text/javascript,
+    console.log("RUN");
+`)
diff --git a/tests/format/js/dynamic-import/template-literal.js b/tests/format/js/dynamic-import/template-literal.js
@@ -0,0 +1,7 @@
+module   =   await import(`data:text/javascript,
+    console.log("RUN");
+`);
+
+module   =   await import(String.raw`data:text/javascript,
+    console.log("RUN");
+`);