Environment Variables

Env Vars in Playwright

Load .env in playwright.config.ts with dotenv. Read process.env.BASE_URL to set use.baseURL. Pass secrets via CI masked variables, never commit them.

Access in tests via process.env.VAR_NAME or expose through custom fixtures for type safety.

import dotenv from 'dotenv';
dotenv.config();

export default defineConfig({
  use: {
    baseURL: process.env.BASE_URL ?? 'http://localhost:3000',
  },
});

Fallback defaults keep local dev working without .env.

Common Env Patterns

BASE_URL=https://staging.example.com npx playwright test
process.env.CI // set by most CI providers
process.env.PWDEBUG=1 // inspector mode

• .env.local gitignored for personal overrides.
• CI sets BASE_URL, API_KEY as secret variables.
• dotenv loads before config export runs.
• Document required env vars in README.

Environment Variable Reference

Typical vars in Playwright projects.

Typed Config Fixture

export const test = base.extend<{ apiUrl: string }>({
  apiUrl: async ({}, use) => {
    await use(process.env.API_URL!);
  },
});

Loading .env in Config

Use dotenv in playwright.config.ts to load .env files locally. In CI, inject the same variable names via pipeline secrets — never commit secrets to git.

Common Mistakes

• Committing .env with real passwords.
• Missing env var in CI causing undefined baseURL.
• Different var names locally vs CI without documentation.
• Using env for values that should be test fixtures.

Key Takeaways

• dotenv + config centralizes environment-specific URLs.
• Never commit secrets; use CI secret stores.
• CI detection via process.env.CI tunes retries/timeouts.
• Fixtures can wrap env for typed access.