From 96811ca911824e91275e2fa9c8938ac24f7d6e83 Mon Sep 17 00:00:00 2001
From: Emily Xiong <xiongemi@gmail.com>
Date: Wed, 9 Aug 2023 18:10:22 -0400
Subject: [PATCH] fix(testing): make the default react playwright test to pass

---
 .../playwright/src/executors/playwright/playwright.ts     | 8 +++++++-
 .../src/generators/configuration/configuration.ts         | 2 +-
 .../files/__directory__/example.spec.ts.template          | 4 ++--
 .../configuration/files/playwright.config.ts.template     | 2 +-
 packages/react/src/generators/application/lib/add-e2e.ts  | 1 +
 .../web/src/generators/application/application.spec.ts    | 2 +-
 6 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/packages/playwright/src/executors/playwright/playwright.ts b/packages/playwright/src/executors/playwright/playwright.ts
index 7dc18423d03517..e53dfb5cfaca4a 100644
--- 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
index 139b7656e7977c..caa18204765f0d 100644
--- 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/packages/playwright/src/generators/configuration/files/__directory__/example.spec.ts.template b/packages/playwright/src/generators/configuration/files/__directory__/example.spec.ts.template
index f6f9f6eced511e..fa8f1f3351348f 100644
--- a/packages/playwright/src/generators/configuration/files/__directory__/example.spec.ts.template
+++ b/packages/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
index 8c7925f07e8195..302f435258a57d 100644
--- 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
index bd551cb9d29e2a..a446d0279353f9 100644
--- 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
index 3739f551d2130b..14f4d82428e42c 100644
--- 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",
           ],
         }
       `);