feat(create-cedar-app): Create ESM apps

.github/actions/telemetry_check/check.mjs

@@ -35,9 +35,9 @@ try {
   const mode = process.argv[process.argv.indexOf('--mode') + 1]
   let exitCode = 0
   switch (mode) {
-    case 'crwa':
+    case 'ccdra':
       exitCode = await exec(
-        `yarn node ./packages/create-cedar-app/dist/create-cedar-app.js ../project-for-telemetry --typescript true --git false --no-yarn-install`,
+        `yarn node ./packages/create-cedar-app/dist/create-cedar-app.js ../project-for-telemetry --esm true --typescript true --git false --no-yarn-install`,
       )
       if (exitCode) {
         process.exit(1)

.github/workflows/create-cedar-app-test.yml

@@ -44,6 +44,7 @@ jobs:
       - name: Prompt tests
         run: |
           ./tests/e2e_prompts.sh
+          ./tests/e2e_prompts_esm.sh
           ./tests/e2e_prompts_git.sh
           ./tests/e2e_prompts_m.sh
           ./tests/e2e_prompts_ts.sh

.github/workflows/telemetry-check.yml

@@ -19,8 +19,8 @@ jobs:
       - name: Set up job
         uses: ./.github/actions/set-up-job
 
-      - name: 📢 Listen for telemetry (CRWA)
-        run: node ./.github/actions/telemetry_check/check.mjs --mode crwa
+      - name: 📢 Listen for telemetry (CCDRA)
+        run: node ./.github/actions/telemetry_check/check.mjs --mode ccdra
 
       - name: 📢 Listen for telemetry (CLI)
         run: node ./.github/actions/telemetry_check/check.mjs --mode cli

packages/create-cedar-app/src/create-cedar-app.js

@@ -445,23 +445,21 @@ async function handleEsmPreference(esmFlag) {
     return esmFlag
   }
 
-  return false
-  // Disable this for now, while the ESM flag is hidden
   // Prompt user for preference
-  // try {
-  //   const response = await tui.prompt({
-  //     type: 'Select',
-  //     name: 'esm',
-  //     choices: ['CJS', 'ESM'],
-  //     message: 'Select your preferred project type',
-  //     initial: 'CJS',
-  //   })
-  //   return response.esm === 'ESM'
-  // } catch (_error) {
-  //   recordErrorViaTelemetry('User cancelled install at esm prompt')
-  //   await shutdownTelemetry()
-  //   process.exit(1)
-  // }
+  try {
+    const response = await tui.prompt({
+      type: 'Select',
+      name: 'esm',
+      choices: ['CJS', 'ESM'],
+      message: 'Select your preferred project type',
+      initial: 'ESM',
+    })
+    return response.esm === 'ESM'
+  } catch (_error) {
+    recordErrorViaTelemetry('User cancelled install at esm prompt')
+    await shutdownTelemetry()
+    process.exit(1)
+  }
 }
 
 async function handleGitPreference(gitInitFlag) {
@@ -688,7 +686,6 @@ async function createRedwoodApp() {
       describe: 'Generate a TypeScript project',
     })
     .option('esm', {
-      hidden: true,
       default: null,
       type: 'boolean',
       describe: 'Generate an ESM project',
@@ -744,7 +741,7 @@ async function createRedwoodApp() {
     parsedFlags['yarn-install'] ??
     (_isYarnBerryOrNewer ? parsedFlags.yes : null)
   const typescriptFlag = parsedFlags.typescript ?? parsedFlags.yes
-  const esmFlag = parsedFlags.esm // TODO: ?? parsedFlags.yes
+  const esmFlag = parsedFlags.esm ?? parsedFlags.yes
   const overwrite = parsedFlags.overwrite
   const gitInitFlag = parsedFlags['git-init'] ?? parsedFlags.yes
   const commitMessageFlag =

packages/create-cedar-app/tests/__snapshots__/create-cedar-app.out

@@ -9,6 +9,7 @@
 [?25h[?25l✔ Compatibility checks passed
 [?25h✔ Creating your CedarJS app in ./cedar-app based on command line argument
 ✔ Using TypeScript based on command line flag
+✔ Setting up an ESM project based on command line flag
 ✔ Will initialize a git repo based on command line flag
 ✔ Will not run yarn install based on command line flag
 [?25l⠋ Creating project files

packages/create-cedar-app/tests/e2e.test.ts

@@ -1,7 +1,9 @@
 /* eslint-env node */
 
 // To run these tests locally, go to ~/cedarjs-fw/packages/create-cedar-app
+// (the parent directory of this file)
 // Then run `PROJECT_PATH=./ yarn test:e2e`
+// Don't forget to build first, as this test uses built files for testing
 
 import path from 'node:path'
 import { fileURLToPath } from 'node:url'
@@ -33,6 +35,7 @@ describe('create-cedar-app', () => {
             --overwrite         Create even if target directory isn't empty
                                                             [boolean] [default: false]
             --typescript, --ts  Generate a TypeScript project[boolean] [default: null]
+            --esm               Generate an ESM project      [boolean] [default: null]
             --git-init, --git   Initialize a git repository  [boolean] [default: null]
         -m, --commit-message    Commit message for the initial commit
                                                               [string] [default: null]

packages/create-cedar-app/tests/e2e_prompts.sh

@@ -20,6 +20,10 @@ expect "Select your preferred language"
 # ❯ TypeScript
 send "\n"
 
+expect "Select your preferred project type"
+# ❯ ESM
+send "\n"
+
 expect "Do you want to initialize a git repo?"
 # ❯ Yes
 send "\n"

packages/create-cedar-app/tests/e2e_prompts_esm.sh

@@ -0,0 +1,42 @@
+#!/usr/bin/expect
+
+set projectPath $env(PROJECT_PATH)
+
+if {$projectPath eq ""} {
+    puts "PROJECT_PATH is not set"
+    exit
+}
+
+cd $projectPath
+
+set projectDirectory "redwood-app-prompt-esm-test"
+
+spawn yarn create-cedar-app --no-yarn-install --esm
+
+expect "Where would you like to create your CedarJS app?"
+send "$projectDirectory\n"
+
+expect "Select your preferred language"
+# ❯ TypeScript
+send "\n"
+
+expect "Do you want to initialize a git repo?"
+# ❯ Yes
+send "\n"
+
+expect "Enter a commit message"
+send "first\n"
+
+expect eof
+catch wait result
+set exitStatus [lindex $result 3]
+
+if {$exitStatus == 0} {
+    puts "Success"
+    exec rm -rf $projectDirectory
+    exit 0
+} else {
+    puts "Error: The process failed with exit status $exitStatus"
+    exec rm -rf $projectDirectory
+    exit 1
+}

packages/create-cedar-app/tests/e2e_prompts_git.sh

@@ -20,6 +20,10 @@ expect "Select your preferred language"
 # ❯ TypeScript
 send "\n"
 
+expect "Select your preferred project type"
+# ❯ ESM
+send "\n"
+
 expect "Enter a commit message"
 send "first\n"
 

packages/create-cedar-app/tests/e2e_prompts_m.sh

@@ -20,6 +20,10 @@ expect "Select your preferred language"
 # ❯ TypeScript
 send "\n"
 
+expect "Select your preferred project type"
+# ❯ ESM
+send "\n"
+
 expect "Do you want to initialize a git repo?"
 # ❯ Yes
 send "\n"

packages/create-cedar-app/tests/e2e_prompts_node_greater.sh

@@ -26,6 +26,10 @@ expect "Select your preferred language"
 # ❯ TypeScript
 send "\n"
 
+expect "Select your preferred project type"
+# ❯ ESM
+send "\n"
+
 expect "Do you want to initialize a git repo?"
 # ❯ Yes
 send "\n"

packages/create-cedar-app/tests/e2e_prompts_overwrite.sh

@@ -23,6 +23,10 @@ expect "Select your preferred language"
 # ❯ TypeScript
 send "\n"
 
+expect "Select your preferred project type"
+# ❯ ESM
+send "\n"
+
 expect "Do you want to initialize a git repo?"
 # ❯ Yes
 send "\n"

packages/create-cedar-app/tests/e2e_prompts_ts.sh

@@ -16,6 +16,10 @@ spawn yarn create-cedar-app --no-yarn-install --ts
 expect "Where would you like to create your CedarJS app?"
 send "$projectDirectory\n"
 
+expect "Select your preferred project type"
+# ❯ ESM
+send "\n"
+
 expect "Do you want to initialize a git repo?"
 # ❯ Yes
 send "\n"

tasks/run-e2e.cjs

@@ -57,6 +57,7 @@ function createCedarJsApp({ typescript }) {
         CEDARJS_PROJECT_DIRECTORY,
         '--no-yarn-install',
         `--typescript ${typescript}`,
+        `--esm`,
         '--no-telemetry',
         '--git',
         '-m "first"',

tasks/test-project/rebuild-test-project-fixture.ts

@@ -259,7 +259,13 @@ const createProject = () => {
   const subprocess = exec(
     cmd,
     // We create a ts project and convert using ts-to-js at the end if typescript flag is false
-    ['--no-yarn-install', '--typescript', '--overwrite', '--no-git'],
+    [
+      '--no-yarn-install',
+      '--typescript',
+      '--no-esm',
+      '--overwrite',
+      '--no-git',
+    ],
     getExecaOptions(RW_FRAMEWORK_PATH),
   )