fix(jsx-email,create-jsx-email): deal with node:fs/promise imports in…

… preview (#177)
shellscape · Feb 24, 2024 · 7607c08 · 7607c08
1 parent 052f4d7
commit 7607c08
Show file tree

Hide file tree

Showing 9 changed files with 833 additions and 57 deletions.
diff --git a/apps/test/fixtures/issue-174.tsx b/apps/test/fixtures/issue-174.tsx
@@ -0,0 +1,19 @@
+// Note: This tests the fix for https://github.com/shellscape/jsx-email/issues/174
+
+import { Html, Tailwind } from 'jsx-email';
+// @ts-ignore
+import { definePreset, presetUno } from 'unocss';
+
+export const preset = definePreset(() => {
+  return {
+    presets: [presetUno()]
+  };
+});
+
+export const TemplateName = 'Issue174';
+
+export const Template = () => (
+  <Tailwind config={{ presets: [preset] }}>
+    <Html></Html>
+  </Tailwind>
+);
diff --git a/apps/test/moon.yml b/apps/test/moon.yml
@@ -15,34 +15,38 @@ tasks:
     command: playwright install --with-deps
     options:
       cache: false
+      outputStyle: 'stream'
 
   playwright:
     command: playwright test -x --config playwright.dev.ts
     deps:
-    - ~:install
+      - ~:install
     options:
       cache: false
       runDepsInParallel: false
 
   playwright.ci:
     command: playwright test -x
     deps:
-    - ~:install
-    - ~:setup.ci
+      - ~:install
+      - ~:setup.ci
     options:
       cache: false
+      outputStyle: 'stream'
       runDepsInParallel: false
 
   setup.ci:
     command: ./scripts/ci-preview-setup.sh
     options:
       cache: false
+      outputStyle: 'stream'
       runFromWorkspaceRoot: true
     platform: system
 
   start.ci:
     command: ./scripts/ci-preview-start.sh
     options:
       cache: false
+      outputStyle: 'stream'
       runFromWorkspaceRoot: true
     platform: system
diff --git a/apps/test/package.json b/apps/test/package.json
@@ -12,7 +12,8 @@
     "dedent": "^1.5.1",
     "diffable-html": "^5.0.0",
     "jsx-email": "workspace:*",
-    "superstruct": "^1.0.3"
+    "superstruct": "^1.0.3",
+    "unocss": "^0.58.5"
   },
   "devDependencies": {
     "@types/diffable-html": "^5.0.2",

diff --git a/apps/test/tests/.snapshots/smoke.spec.ts-Issue-174-chromium.snap b/apps/test/tests/.snapshots/smoke.spec.ts-Issue-174-chromium.snap
@@ -0,0 +1,12 @@
+<html
+  lang="en"
+  dir="ltr"
+>
+  <head>
+    <style tailwind>
+      /* layer: preflights */
+    </style>
+  </head>
+  <body>
+  </body>
+</html>
diff --git a/packages/create-jsx-email/generators/package.json.mustache b/packages/create-jsx-email/generators/package.json.mustache
@@ -1,5 +1,5 @@
 {
-  "name": "{{ name }}",
+  "name": "{{{ name }}}",
   "version": "0.0.0",
   "private": true,
   "description": "A simple starter for jsx-email",
@@ -9,9 +9,9 @@
     "dev": "email preview ./templates"
   },
   "dependencies": {
-    "jsx-email": "^1.0.1"
+    "jsx-email": "^1.10.11"
   },
   "devDependencies": {
-    "react": "^18.2.0"{{ typeDep }}
+    "react": "^18.2.0"{{{ typeDep }}}
   }
 }
diff --git a/packages/create-jsx-email/src/index.ts b/packages/create-jsx-email/src/index.ts
@@ -71,49 +71,57 @@ export const createEmail = async ({ jsx, name, outputPath }: CreateEmailArgs) =>
 const run = async () => {
   log(intro);
 
+  const skip = process.argv.some((arg) => arg === '--yes');
   const argTargetDir = formatTargetDir(process.argv[2]);
   let targetPath = argTargetDir || defaultTargetDir;
   let result: prompts.Answers<'projectName' | 'projectType' | 'overwrite'>;
+  const defaults: typeof result = {
+    overwrite: true,
+    projectName: defaultTargetDir,
+    projectType: 'TypeScript'
+  };
 
   try {
-    result = await prompts(
-      [
-        {
-          initial: defaultTargetDir,
-          message: 'Project name:',
-          name: 'projectName',
-          onState: (state) => {
-            targetPath = formatTargetDir(state.value) || defaultTargetDir;
-          },
-          type: argTargetDir ? null : 'text'
-        },
-        {
-          choices: [
-            { title: 'TypeScript', value: 'TypeScript' },
-            { title: 'JavaScript', value: 'JavaScript' }
+    result = skip
+      ? defaults
+      : await prompts(
+          [
+            {
+              initial: defaultTargetDir,
+              message: 'Project name:',
+              name: 'projectName',
+              onState: (state) => {
+                targetPath = formatTargetDir(state.value) || defaultTargetDir;
+              },
+              type: argTargetDir ? null : 'text'
+            },
+            {
+              choices: [
+                { title: 'TypeScript', value: 'TypeScript' },
+                { title: 'JavaScript', value: 'JavaScript' }
+              ],
+              message: 'TypeScript or JavaScript:',
+              name: 'projectType',
+              type: 'select'
+            },
+            {
+              message: () =>
+                targetPath === '.'
+                  ? 'Current directory'
+                  : `Target directory "${targetPath}" is not empty. Remove existing files and continue?`,
+              name: 'overwrite',
+              type: () => (!existsSync(targetPath) || isEmpty(targetPath) ? null : 'confirm')
+            },
+            {
+              name: 'overwriteChecker',
+              type: (_, { overwrite }: { overwrite?: boolean }) => {
+                if (overwrite === false) cancelled();
+                return null;
+              }
+            }
           ],
-          message: 'TypeScript or JavaScript:',
-          name: 'projectType',
-          type: 'select'
-        },
-        {
-          message: () =>
-            targetPath === '.'
-              ? 'Current directory'
-              : `Target directory "${targetPath}" is not empty. Remove existing files and continue?`,
-          name: 'overwrite',
-          type: () => (!existsSync(targetPath) || isEmpty(targetPath) ? null : 'confirm')
-        },
-        {
-          name: 'overwriteChecker',
-          type: (_, { overwrite }: { overwrite?: boolean }) => {
-            if (overwrite === false) cancelled();
-            return null;
-          }
-        }
-      ],
-      { onCancel: cancelled }
-    );
+          { onCancel: cancelled }
+        );
   } catch (cancelled: any) {
     log(cancelled.message);
     return;

diff --git a/packages/jsx-email/src/cli/commands/vite.ts b/packages/jsx-email/src/cli/commands/vite.ts
@@ -72,6 +72,7 @@ export const viteConfig = defineConfig({
   ],
   resolve: {
     alias: {
+      'node:fs/promises': 'node-stdlib-browser/mock/empty',
       path: 'path-browserify',
       postcss: 'https://jspm.dev/postcss@8.4.31',
       rehype: 'https://jspm.dev/rehype@13.0.1',