fix(testing): make the default react playwright test to pass

nrwl · Aug 11, 2023 · c54e6d0 · c54e6d0
1 parent dcbba68
commit c54e6d0
Show file tree

Hide file tree

Showing 9 changed files with 22 additions and 9 deletions.
diff --git a/e2e/playwright/src/playwright.test.ts b/e2e/playwright/src/playwright.test.ts
@@ -17,7 +17,9 @@ describe('Playwright E2E Test runner', () => {
   it(
     'should test and lint example app',
     () => {
-      runCLI(`g @nx/js:lib demo-e2e --unitTestRunner none --bundler none`);
+      runCLI(
+        `g @nx/web:app demo-e2e --unitTestRunner=none --bundler=vite --e2eTestRunner=none --style=css --no-interactive`
+      );
       runCLI(`g @nx/playwright:configuration --project demo-e2e`);
       ensurePlaywrightBrowsersInstallation();
 
@@ -34,7 +36,7 @@ describe('Playwright E2E Test runner', () => {
     'should test and lint example app with js',
     () => {
       runCLI(
-        `g @nx/js:lib demo-js-e2e --unitTestRunner none --bundler none --js`
+        `g @nx/web:app demo-js-e2e --unitTestRunner=none --bundler=vite --e2eTestRunner=none --style=css --no-interactive`
       );
       runCLI(`g @nx/playwright:configuration --project demo-js-e2e --js`);
       ensurePlaywrightBrowsersInstallation();

diff --git a/e2e/web/src/web.test.ts b/e2e/web/src/web.test.ts
@@ -6,7 +6,6 @@ import {
   ensurePlaywrightBrowsersInstallation,
   isNotWindows,
   killPorts,
-  listFiles,
   newProject,
   readFile,
   rmDist,

diff --git a/packages/playwright/src/executors/playwright/playwright.ts b/packages/playwright/src/executors/playwright/playwright.ts
@@ -81,6 +81,12 @@ export async function playwrightExecutor(
 
   const args = createArgs(options);
   const p = runPlaywright(args, context.root);
+  p.stdout.on('data', (message) => {
+    process.stdout.write(message);
+  });
+  p.stderr.on('data', (message) => {
+    process.stderr.write(message);
+  });
 
   return new Promise<{ success: boolean }>((resolve) => {
     p.on('close', (code) => {
@@ -117,7 +123,7 @@ function runPlaywright(args: string[], cwd: string) {
     const cli = require.resolve('@playwright/test/cli');
 
     return fork(cli, ['test', ...args], {
-      stdio: 'inherit',
+      stdio: ['pipe', 'pipe', 'pipe', 'ipc'],
       cwd,
     });
   } catch (e) {

diff --git a/packages/playwright/src/generators/configuration/configuration.ts b/packages/playwright/src/generators/configuration/configuration.ts
@@ -90,7 +90,7 @@ Rename or remove the existing e2e target.`);
   projectConfig.targets ??= {};
   projectConfig.targets.e2e = {
     executor: '@nx/playwright:playwright',
-    outputs: [`dist/.playwright/${projectConfig.root}`],
+    outputs: [`{workspaceRoot}/dist/.playwright/${projectConfig.root}`],
     options: {
       config: `${projectConfig.root}/playwright.config.${
         options.js ? 'js' : 'ts'

diff --git a/...ages/playwright/src/generators/configuration/files/__directory__/example.spec.ts.template b/...ages/playwright/src/generators/configuration/files/__directory__/example.spec.ts.template
@@ -3,6 +3,6 @@ import { test, expect } from '@playwright/test';
 test('has title', async ({ page }) => {
   await page.goto('/');
 
-  // Expect a title "to contain" a substring.
-  await expect(page).toHaveTitle(/Welcome/);
+  // Expect h1 to contain a substring.
+  expect(await page.locator('h1').innerText()).toContain('Welcome');
 });
diff --git a/packages/playwright/src/generators/configuration/files/playwright.config.ts.template b/packages/playwright/src/generators/configuration/files/playwright.config.ts.template
@@ -16,7 +16,7 @@ const baseURL = process.env['BASE_URL'] || '<% if(webServerAddress) {%><%= webSe
  * See https://playwright.dev/docs/test-configuration.
  */
 export default defineConfig({
-  ...nxE2EPreset(__filename, { testDir: './<>' }),
+  ...nxE2EPreset(__filename, { testDir: './<%= directory %>' }),
   /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
   use: {
     baseURL,

diff --git a/packages/react/src/generators/application/lib/add-e2e.ts b/packages/react/src/generators/application/lib/add-e2e.ts
@@ -55,6 +55,7 @@ export async function addE2e(
         webServerCommand: `${getPackageManagerCommand().exec} nx serve ${
           options.name
         }`,
+        webServerAddress: 'http://localhost:4200',
       });
     case 'none':
     default:

diff --git a/packages/web/src/generators/application/application.spec.ts b/packages/web/src/generators/application/application.spec.ts
@@ -156,7 +156,7 @@ describe('app', () => {
             "config": "apps/cool-app-e2e/playwright.config.ts",
           },
           "outputs": [
-            "dist/.playwright/apps/cool-app-e2e",
+            "{workspaceRoot}/dist/.playwright/apps/cool-app-e2e",
           ],
         }
       `);

diff --git a/packages/web/src/generators/application/application.ts b/packages/web/src/generators/application/application.ts
@@ -8,6 +8,7 @@ import {
   formatFiles,
   generateFiles,
   GeneratorCallback,
+  getPackageManagerCommand,
   getWorkspaceLayout,
   joinPathFragments,
   names,
@@ -288,6 +289,10 @@ export async function applicationGenerator(host: Tree, schema: Schema) {
       js: false,
       linter: options.linter,
       setParserOptionsProject: options.setParserOptionsProject,
+      webServerCommand: `${getPackageManagerCommand().exec} nx serve ${
+        options.name
+      }`,
+      webServerAddress: 'http://localhost:4200',
     });
     tasks.push(playwrightTask);
   }