[BUG] Process from config.webServer was not able to start. Exit code: 127

[BernardoSM]

Context:

• Playwright Version: 1.28.1
• Operating System: Windows with WSL2 (Ubuntu 22.04.1 LTS)
• Node.js version: 18.14.0
• Visual Studio Code version: 1.75.0
• Playwright for VSCode extension version: 1.0.7
• Browser: All
• Extra: I'm running VSCode with WSL plugin

Code Snippet

I only have these three test files:

playwright.config.js

```javascript // @ts-check const { devices } = require("@playwright/test"); /** * Read environment variables from file. * https://github.com/motdotla/dotenv */ // require('dotenv').config(); /** * @see https://playwright.dev/docs/test-configuration * @type {import('@playwright/test').PlaywrightTestConfig} */ const config = { testDir: "./e2e", /* Maximum time one test can run for. */ timeout: 30 * 1000, expect: { /** * Maximum time expect() should wait for the condition to be met. * For example in `await expect(locator).toHaveText();` */ timeout: 5000, }, /* Fail the build on CI if you accidentally left test.only in the source code. */ forbidOnly: !!process.env.CI, /* Retry on CI only */ retries: process.env.CI ? 2 : 0, /* Opt out of parallel tests on CI. */ workers: process.env.CI ? 1 : undefined, /* Reporter to use. See https://playwright.dev/docs/test-reporters */ reporter: "html", /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */ use: { /* Maximum time each action such as `click()` can take. Defaults to 0 (no limit). */ actionTimeout: 0, /* Base URL to use in actions like `await page.goto('/')`. */ baseURL: "http://localhost:5173", /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ trace: "on-first-retry", /* Only on CI systems run the tests headless */ headless: !!process.env.CI, }, /* Configure projects for major browsers */ projects: [ { name: "chromium", use: { ...devices["Desktop Chrome"], }, }, // { // name: "firefox", // use: { // ...devices["Desktop Firefox"], // }, // }, // { // name: "webkit", // use: { // ...devices["Desktop Safari"], // }, // }, /* Test against mobile viewports. */ // { // name: 'Mobile Chrome', // use: { // ...devices['Pixel 5'], // }, // }, // { // name: 'Mobile Safari', // use: { // ...devices['iPhone 12'], // }, // }, /* Test against branded browsers. */ // { // name: 'Microsoft Edge', // use: { // channel: 'msedge', // }, // }, // { // name: 'Google Chrome', // use: { // channel: 'chrome', // }, // }, ], /* Folder for test artifacts such as screenshots, videos, traces, etc. */ // outputDir: 'test-results/', /* Run your local dev server before starting the tests */ webServer: { /** * Use the dev server by default for faster feedback loop. * Use the preview server on CI for more realistic testing. */ command: process.env.CI ? "vite preview --port 5173" : "vite dev", port: 5173, reuseExistingServer: !process.env.CI, }, }; module.exports = config; ```

utils.js

```javascript import { execSync } from "child_process"; import detect from "detect-port"; import { expect } from "@playwright/test"; export async function setupE2eTest() { await startSupabase(); } async function startSupabase() { const port = await detect(54321); if (port !== 21) { return; } console.warn("Supabase not detected - Starting it now"); execSync("npx supabase start"); } export async function signUp( page, email, password, userName, skipUserName = true ) { const signUpLink = page .locator("a", { hasText: "Don't have an accout? Sign up" }) .first(); await signUpLink.click(); const emailInput = page.locator('input[name="email"]'); await emailInput.fill(email); const passwordInput = page.locator('input[name="password"]'); await passwordInput.fill(password); await page.keyboard.press("Enter"); const welcomeNotice = page.locator("h1", { hasText: "MessageBoard" }); await expect(welcomeNotice).toHaveCount(1); if (skipUserName) { return; } const usernameInput = page.locator('input[name="username"]'); await usernameInput.fill(userName); const submitButton = page.locator("button", { hasText: "Submit" }); await expect(submitButton).toBeEnabled(); await page.keyboard.press("Enter"); const logoutButton = page.locator("button", { hasText: "Logout" }); await expect(logoutButton).toHaveCount(1); } export async function login( page, email, password, username, loginButtonSelector = "button" ) { const signUpButton = page .locator(loginButtonSelector, { hasText: "Login" }) .first(); await signUpButton.click(); const emailInput = page.locator('input[name="email"]'); await emailInput.fill(email); const passwordInput = page.locator('input[name="password"]'); await passwordInput.fill(password); await page.keyboard.press("Enter"); const logoutButton = page.locator("button", { hasText: "Logout" }); await expect(logoutButton).toHaveCount(1); const usernameMention = page.locator("h2", { hasText: username }); await expect(usernameMention).toHaveCount(1); } export async function createPost(page, title, contents) { page.goto("http://localhost:1337/1"); const postTitleInput = page.locator(`input[name="title"]`); const postContentsInput = page.locator(`textarea[name="contents"]`); const postSubmitButton = page.locator(`button[type="submit"]`); await postTitleInput.fill(title); await postContentsInput.fill(contents); await postSubmitButton.click(); const post = page.locator("h3", { hasText: title }); await expect(post).toHaveCount(1); return post; } ```

vue.spec.js

```javascript import { test } from "@playwright/test"; import { setupE2eTest, signUp } from "./utils"; test.describe("User auth", () => { const userEmail = "test@test.io"; const userPassword = "test123456"; const userName = "testuser"; test.beforeEach(setupE2eTest); test.beforeEach(async ({ page }) => { await page.goto("http://localhost:5173"); }); test("new user can signup", async ({ page }) => { await signUp(page, userEmail, userPassword, userName); }); }); ```

Describe the bug

If I run playwright test in CLI the test runs perfectly.

But if I try to run through the extension shows up this error Error: Process from config.webServer was not able to start. Exit code: 127.

[mxschmitt]

127 usually means command not found. Try in your case npx vite instead of just vite then it should work.

[alex-cailler]

I'have same problem in my CI :

directus_e2e_testing:
  image: mcr.microsoft.com/playwright:v1.30.0-focal
  stage: test
  services:
    - docker:stable-dind
  before_script:
    - *open_directus_folder
  script:
    - npm install
    - npx playwright test

In local, my test running good. But here i've process.exit(2) ^^

This is the output of my CI job :

[WebServer] sh: 1: [WebServer] Syntax error: redirection unexpected[WebServer] 
Error: Process from config.webServer was not able to start. Exit code: 2

[BernardoSM]

Sorry guys, I managed to make it works running yarn dev before runs the extension.

I thought the extension works like the command playwright test which doesn't need to have the project running.

For me we can close this issue.

[vincerubinetti]

Hmm interesting, running yarn dev does work, but shouldn't it not be needed? This page doesn't mention needing to start the dev server manually.

Does the extension read from playwright.config.ts? Because I do have it configured to supposedly start the web server automatically:

{
  webServer: {
    command: process.env.CI ? "vite preview --port 5173" : "vite dev",
    port: 5173,
    reuseExistingServer: !process.env.CI,
  }
}

[mikeybinns]

Adding npx in front of the command worked for me. For reference, my command was cross-env PORT=${PORT} npm run dev and prefixing cross-env with npx worked. Thanks mxschmitt :)

[isaac1620]

I'have same problem in my CI :

directus_e2e_testing:
  image: mcr.microsoft.com/playwright:v1.30.0-focal
  stage: test
  services:
    - docker:stable-dind
  before_script:
    - *open_directus_folder
  script:
    - npm install
    - npx playwright test

In local, my test running good. But here i've process.exit(2) ^^

This is the output of my CI job :

[WebServer] sh: 1: [WebServer] Syntax error: redirection unexpected[WebServer] 
Error: Process from config.webServer was not able to start. Exit code: 2

Same issue when running on Github Actions

[Jito-Joseph]

I ran npm ci and it worked