Adding projects folder change test (#3482)

* Adding projects folder change test

* Missed a bunch of promises that need awaited

* Await on electronApp.evaluate too

.gitignore

@@ -68,4 +68,5 @@ venv
 out/
 
 src-tauri/target
-electron-test-projects-dir
+electron-test-projects-dir
+electron-test-projects-dir-2

e2e/playwright/projects.spec.ts

@@ -605,3 +605,110 @@ test(
     await electronApp.close()
   }
 )
+
+test(
+  'You can change the root projects directory and nothing is lost',
+  { tag: '@electron' },
+  async ({ browserName }, testInfo) => {
+    const { electronApp, page } = await setupElectron({
+      testInfo,
+      folderSetupFn: async (dir) => {
+        await Promise.all([
+          fsp.mkdir(`${dir}/router-template-slate`, { recursive: true }),
+          fsp.mkdir(`${dir}/bracket`, { recursive: true }),
+        ])
+        await Promise.all([
+          fsp.copyFile(
+            'src/wasm-lib/tests/executor/inputs/router-template-slate.kcl',
+            `${dir}/router-template-slate/main.kcl`
+          ),
+          fsp.copyFile(
+            'src/wasm-lib/tests/executor/inputs/focusrite_scarlett_mounting_braket.kcl',
+            `${dir}/bracket/main.kcl`
+          ),
+        ])
+      },
+    })
+    await page.setViewportSize({ width: 1200, height: 500 })
+
+    page.on('console', console.log)
+
+    // we'll grab this from the settings on screen before we switch
+    let originalProjectDirName: string
+    const newProjectDirName = testInfo.outputPath(
+      'electron-test-projects-dir-2'
+    )
+    if (fs.existsSync(newProjectDirName)) {
+      await fsp.rm(newProjectDirName, { recursive: true })
+    }
+
+    await test.step('We can change the root project directory', async () => {
+      // expect to see the project directory settings link
+      await expect(
+        page.getByTestId('project-directory-settings-link')
+      ).toBeVisible()
+
+      await page.getByTestId('project-directory-settings-link').click()
+
+      await expect(page.getByTestId('project-directory-button')).toBeVisible()
+      originalProjectDirName = await page
+        .locator('section#projectDirectory input')
+        .inputValue()
+
+      // Can't use Playwright filechooser since this is happening in electron.
+      const handleFile = electronApp.evaluate(
+        async ({ dialog }, filePaths) => {
+          dialog.showOpenDialog = () =>
+            Promise.resolve({ canceled: false, filePaths })
+        },
+        [newProjectDirName]
+      )
+      await page.getByTestId('project-directory-button').click()
+      await handleFile
+
+      await expect(page.locator('section#projectDirectory input')).toHaveValue(
+        newProjectDirName
+      )
+
+      await page.getByTestId('settings-close-button').click()
+
+      await expect(page.getByText('No Projects found')).toBeVisible()
+      await page.getByRole('button', { name: 'New project' }).click()
+      await expect(page.getByText('Successfully created')).toBeVisible()
+      await expect(page.getByText('Successfully created')).not.toBeVisible()
+
+      await expect(page.getByText(`project-000`)).toBeVisible()
+    })
+
+    await test.step('We can change back to the original root project directory', async () => {
+      await expect(
+        page.getByTestId('project-directory-settings-link')
+      ).toBeVisible()
+
+      await page.getByTestId('project-directory-settings-link').click()
+
+      const handleFile = electronApp.evaluate(
+        async ({ dialog }, filePaths) => {
+          dialog.showOpenDialog = () =>
+            Promise.resolve({ canceled: false, filePaths })
+        },
+        [originalProjectDirName]
+      )
+      await expect(page.getByTestId('project-directory-button')).toBeVisible()
+
+      await page.getByTestId('project-directory-button').click()
+      await handleFile
+
+      await expect(page.locator('section#projectDirectory input')).toHaveValue(
+        originalProjectDirName
+      )
+
+      await page.getByTestId('settings-close-button').click()
+
+      await expect(page.getByText('bracket')).toBeVisible()
+      await expect(page.getByText('router-template-slate')).toBeVisible()
+    })
+
+    await electronApp.close()
+  }
+)

e2e/playwright/test-utils.ts

@@ -699,6 +699,9 @@ export async function setupElectron({
       TEST_SETTINGS_FILE_KEY: projectDirName,
       IS_PLAYWRIGHT: 'true',
     },
+    ...(process.env.ELECTRON_OVERRIDE_DIST_PATH
+      ? { executablePath: process.env.ELECTRON_OVERRIDE_DIST_PATH + 'electron' }
+      : {}),
   })
   const context = electronApp.context()
   const page = await electronApp.firstWindow()

flake.nix

@@ -58,7 +58,9 @@
 
             nodejs_22
             yarn
+
             electron
+            playwright-driver.browsers
           ]) ++ pkgs.lib.optionals pkgs.stdenv.isDarwin (with pkgs; [
             libiconv 
             darwin.apple_sdk.frameworks.Security
@@ -67,6 +69,10 @@
           TARGET_CC = "${pkgs.stdenv.cc}/bin/${pkgs.stdenv.cc.targetPrefix}cc";
           LIBCLANG_PATH = "${pkgs.libclang.lib}/lib";
           ELECTRON_OVERRIDE_DIST_PATH = "${pkgs.electron}/bin/";
+          PLAYWRIGHT_SKIP_VALIDATE_HOST_REQUIREMENTS = true;
+          PLAYWRIGHT_CHROMIUM_EXECUTABLE_PATH = "${pkgs.playwright-driver.browsers}/chromium-1091/chrome-linux/chrome";
+          PLAYWRIGHT_BROWSERS_PATH = "${pkgs.playwright-driver.browsers}";
+          NODE_ENV = "development";
         };
       });
     };

playwright.config.ts

@@ -48,6 +48,13 @@ export default defineConfig({
           /* Chromium is the only one with these permission types */
           permissions: ['clipboard-write', 'clipboard-read'],
         },
+        launchOptions: {
+          ...(process.env.PLAYWRIGHT_CHROMIUM_EXECUTABLE_PATH
+            ? {
+                executablePath: process.env.PLAYWRIGHT_CHROMIUM_EXECUTABLE_PATH,
+              }
+            : {}),
+        },
       }, // or 'chrome-beta'
     },
     {

src/routes/Home.tsx

@@ -280,6 +280,7 @@ const Home = () => {
           <p className="my-4 text-sm text-chalkboard-80 dark:text-chalkboard-30">
             Loaded from{' '}
             <Link
+              data-testid="project-directory-settings-link"
               to={`${PATHS.HOME + PATHS.SETTINGS_USER}#projectDirectory`}
               className="text-chalkboard-90 dark:text-chalkboard-20 underline underline-offset-2"
             >