fix(test-runner): start webServer before globalSetup/teardown (#7604)

docs/src/chrome-extensions.md

@@ -59,7 +59,7 @@ asyncio.run(main())
 ```
 
 ```python sync
-from playwright.async_api import sync_playwright
+from playwright.sync_api import sync_playwright
 
 path_to_extension = "./my-extension"
 user_data_dir = "/tmp/test-user-data-dir"

src/test/runner.ts

@@ -167,10 +167,10 @@ export class Runner {
       testFiles.forEach(file => allTestFiles.add(file));
     }
 
+    const webServer: WebServer|null = config.webServer ? await WebServer.create(config.webServer) : null;
     let globalSetupResult: any;
     if (config.globalSetup)
       globalSetupResult = await (await this._loader.loadGlobalHook(config.globalSetup, 'globalSetup'))(this._loader.fullConfig());
-    const webServer: WebServer|null = config.webServer ? await WebServer.create(config.webServer) : null;
     try {
       for (const file of allTestFiles)
         await this._loader.loadTestFile(file);
@@ -263,11 +263,11 @@ export class Runner {
       await this._reporter.onEnd({ status: failed ? 'failed' : 'passed' });
       return { status: failed ? 'failed' : 'passed' };
     } finally {
-      await webServer?.kill();
       if (globalSetupResult && typeof globalSetupResult === 'function')
         await globalSetupResult(this._loader.fullConfig());
       if (config.globalTeardown)
         await (await this._loader.loadGlobalHook(config.globalTeardown, 'globalTeardown'))(this._loader.fullConfig());
+      await webServer?.kill();
     }
   }
 }

tests/playwright-test/web-server.spec.ts

@@ -35,13 +35,38 @@ test('should create a server', async ({ runInlineTest }, { workerIndex }) => {
         webServer: {
           command: 'node ${JSON.stringify(path.join(__dirname, 'assets', 'simple-server.js'))} ${port}',
           port: ${port},
-        }
+        },
+        globalSetup: 'globalSetup.ts',
+        globalTeardown: 'globalTeardown.ts',
+      };
+    `,
+    'globalSetup.ts': `
+      module.exports = async () => {
+        console.log('globalSetup')
+        return () => console.log('globalSetup teardown');
+      };
+    `,
+    'globalTeardown.ts': `
+      module.exports = async () => {
+        const http = require("http");
+        const response = await new Promise(resolve => {
+          const request = http.request("http://localhost:${port}/hello", resolve);
+          request.end();
+        })
+        console.log('globalTeardown-status-'+response.statusCode)
       };
     `,
   });
   expect(result.exitCode).toBe(0);
   expect(result.passed).toBe(1);
   expect(result.report.suites[0].specs[0].tests[0].results[0].status).toContain('passed');
+
+  const expectedLogMessages = ['Starting WebServer', 'globalSetup', 'globalSetup teardown', 'globalTeardown-status-200'];
+  const actualLogMessages = expectedLogMessages.map(log => ({
+    log,
+    index: result.output.indexOf(log),
+  })).sort((a, b) => a.index - b.index).filter(l => l.index !== -1).map(l => l.log);
+  expect(actualLogMessages).toStrictEqual(expectedLogMessages);
 });
 
 test('should create a server with environment variables', async ({ runInlineTest }, { workerIndex }) => {