diff --git a/packages/create-playwright/assets/playwright.config.js b/packages/create-playwright/assets/playwright.config.js index 987f7ea270..3ba2ebcac0 100644 --- a/packages/create-playwright/assets/playwright.config.js +++ b/packages/create-playwright/assets/playwright.config.js @@ -7,63 +7,53 @@ const path = require('path'); * @type {import('@playwright/test').PlaywrightTestConfig} */ const config = { - // Timeout per test - timeout: 30 * 1000, - // Test directory - testDir: path.join(__dirname, '{{testDir}}'), - // If a test fails on CI, retry it additional 2 times - retries: process.env.CI ? 2 : 0, - // Artifacts folder where screenshots, videos, and traces are stored. - outputDir: 'test-results/', + testDir: path.join(__dirname, '{{testDir}}'), /* Test directory */ + // timeout: 30 * 1000, /* Timeout per test */ + // retries: process.env.CI ? 2 : 0, /* If a test fails on CI, retry it additional 2 times */ + // outputDir: 'test-results/', /* Artifacts folder where screenshots, videos, and traces are stored. */ - // Run your local dev server before starting the tests: - // https://playwright.dev/docs/test-advanced#launching-a-development-web-server-during-the-tests - // webServer: { - // command: 'npm run start', + // webServer: { /* Run your local dev server before starting the tests: */ + // command: 'npm run start', /* https://playwright.dev/docs/test-advanced#launching-a-development-web-server-during-the-tests */ // port: 3000, // }, use: { - // Retry a test if its failing with enabled tracing. This allows you to analyse the DOM, console logs, network traffic etc. - // More information: https://playwright.dev/docs/trace-viewer - trace: 'on-first-retry', - - // All available context options: https://playwright.dev/docs/api/class-browser#browser-new-context - contextOptions: { + trace: 'on-first-retry', /* Retry a test if its failing with enabled tracing. This allows you to analyse the DOM, console logs, network traffic etc. */ + contextOptions: { /* All available context options: https://playwright.dev/docs/api/class-browser#browser-new-context */ ignoreHTTPSErrors: true, }, }, projects: [ { - name: 'Desktop Chrome', + name: 'chromium', use: { ...devices['Desktop Chrome'], }, }, { - name: 'Desktop Firefox', + name: 'firefox', use: { ...devices['Desktop Firefox'], }, }, { - name: 'Desktop Safari', + 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 mobile viewports. */ + // { + // name: 'Mobile Chrome', + // use: { + // ...devices['Pixel 5'], + // }, + // }, + // { + // name: 'Mobile Safari', + // use: devices['iPhone 12'], + // }, ], }; module.exports = config; diff --git a/packages/create-playwright/assets/playwright.config.ts b/packages/create-playwright/assets/playwright.config.ts index 62fa2e8f8f..46bd949152 100644 --- a/packages/create-playwright/assets/playwright.config.ts +++ b/packages/create-playwright/assets/playwright.config.ts @@ -3,63 +3,53 @@ import path from 'path'; // Reference: https://playwright.dev/docs/test-configuration const config: PlaywrightTestConfig = { - // Timeout per test - timeout: 30 * 1000, - // Test directory - testDir: path.join(__dirname, '{{testDir}}'), - // If a test fails on CI, retry it additional 2 times - retries: process.env.CI ? 2 : 0, - // Artifacts folder where screenshots, videos, and traces are stored. - outputDir: 'test-results/', + testDir: path.join(__dirname, '{{testDir}}'), /* Test directory */ + // timeout: 30 * 1000, /* Timeout per test */ + // retries: process.env.CI ? 2 : 0, /* If a test fails on CI, retry it additional 2 times */ + // outputDir: 'test-results/', /* Artifacts folder where screenshots, videos, and traces are stored. */ - // Run your local dev server before starting the tests: - // https://playwright.dev/docs/test-advanced#launching-a-development-web-server-during-the-tests - // webServer: { - // command: 'npm run start', + // webServer: { /* Run your local dev server before starting the tests: */ + // command: 'npm run start', /* https://playwright.dev/docs/test-advanced#launching-a-development-web-server-during-the-tests */ // port: 3000, // }, use: { - // Retry a test if its failing with enabled tracing. This allows you to analyse the DOM, console logs, network traffic etc. - // More information: https://playwright.dev/docs/trace-viewer - trace: 'on-first-retry', - - // All available context options: https://playwright.dev/docs/api/class-browser#browser-new-context - contextOptions: { + trace: 'on-first-retry', /* Retry a test if its failing with enabled tracing (analyse the DOM, console logs, network traffic): https://playwright.dev/docs/trace-viewer */ + contextOptions: { /* All available context options: https://playwright.dev/docs/api/class-browser#browser-new-context */ ignoreHTTPSErrors: true, }, }, projects: [ { - name: 'Desktop Chrome', + name: 'chromium', use: { ...devices['Desktop Chrome'], }, }, { - name: 'Desktop Firefox', + name: 'firefox', use: { ...devices['Desktop Firefox'], }, }, { - name: 'Desktop Safari', + 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 mobile viewports. */ + // { + // name: 'Mobile Chrome', + // use: { + // ...devices['Pixel 5'], + // }, + // }, + // { + // name: 'Mobile Safari', + // use: devices['iPhone 12'], + // }, ], }; export default config; diff --git a/packages/create-playwright/src/generator.ts b/packages/create-playwright/src/generator.ts index b04a1391d8..7529a8436a 100644 --- a/packages/create-playwright/src/generator.ts +++ b/packages/create-playwright/src/generator.ts @@ -26,6 +26,7 @@ export type PromptOptions = { installGitHubActions: boolean, language: 'JavaScript' | 'TypeScript' addExamples: boolean, + installPlaywrightDependencies: boolean, }; const assetsDir = path.join(__dirname, '..', 'assets'); @@ -72,7 +73,7 @@ export class Generator { type: 'text', name: 'testDir', message: 'Where to put your end-to-end tests?', - initial: 'e2e' + initial: fs.existsSync(path.join(this.rootDir, 'tests')) ? 'e2e' : 'tests', }, { type: 'confirm', @@ -81,11 +82,19 @@ export class Generator { initial: true, }, { + type: 'confirm', + name: 'installPlaywrightDependencies', + message: 'Install Playwright operating system dependencies (requires sudo / root - can be done manually via \sudo npx playwright install-deps\')?', + initial: true, + }, + // Avoid installing dependencies on Windows (vast majority does not run create-playwright on Windows) + // Avoid installing dependencies on Mac (there are no dependencies) + ...(process.platform === 'linux' ? [{ type: 'confirm', name: 'addExamples', message: 'Add common examples which demonstrate Playwright\'s capabilities?', initial: true, - }, + }] : []), ]); } @@ -125,7 +134,7 @@ export class Generator { commands.push({ name: 'Downloading browsers', - command: 'npx playwright install --with-deps', + command: 'npx playwright install' + (answers.installPlaywrightDependencies ? ' --with-deps' : ''), }); return { files, commands }; diff --git a/packages/create-playwright/tests/integration.spec.ts b/packages/create-playwright/tests/integration.spec.ts index 80909269c9..4b4f18f84b 100644 --- a/packages/create-playwright/tests/integration.spec.ts +++ b/packages/create-playwright/tests/integration.spec.ts @@ -22,9 +22,9 @@ for (const packageManager of ['npm', 'yarn'] as ('npm' | 'yarn')[]) { test.use({ packageManager }); test('should generate a project in the current directory', async ({ run }) => { - const { exitCode, dir, stdout } = await run([], { installGitHubActions: true, testDir: 'e2e', language: 'TypeScript', addExamples: false }); + const { exitCode, dir, stdout } = await run([], { installGitHubActions: true, testDir: 'tests', language: 'TypeScript', addExamples: false, installPlaywrightDependencies: true }); expect(exitCode).toBe(0); - expect(fs.existsSync(path.join(dir, 'e2e/example.spec.ts'))).toBeTruthy(); + expect(fs.existsSync(path.join(dir, 'tests/example.spec.ts'))).toBeTruthy(); expect(fs.existsSync(path.join(dir, 'package.json'))).toBeTruthy(); if (packageManager === 'npm') expect(fs.existsSync(path.join(dir, 'package-lock.json'))).toBeTruthy(); @@ -32,7 +32,7 @@ for (const packageManager of ['npm', 'yarn'] as ('npm' | 'yarn')[]) { expect(fs.existsSync(path.join(dir, 'yarn.lock'))).toBeTruthy(); expect(fs.existsSync(path.join(dir, 'playwright.config.ts'))).toBeTruthy(); const playwrightConfigContent = fs.readFileSync(path.join(dir, 'playwright.config.ts'), 'utf8'); - expect(playwrightConfigContent).toContain('e2e'); + expect(playwrightConfigContent).toContain('tests'); expect(fs.existsSync(path.join(dir, '.github/workflows/playwright.yml'))).toBeTruthy(); expect(fs.existsSync(path.join(dir, '.gitignore'))).toBeTruthy(); if (packageManager === 'npm') { @@ -42,13 +42,13 @@ for (const packageManager of ['npm', 'yarn'] as ('npm' | 'yarn')[]) { expect(stdout).toContain('Initializing Yarn project (yarn init -y)…'); expect(stdout).toContain('Installing Playwright Test (yarn add --dev @playwright/test)…'); } - expect(stdout).toContain('npx playwright install --with-deps'); + expect(stdout).toContain('npx playwright install' + process.platform === 'linux' ? ' --with-deps' : ''); }); test('should generate a project in a given directory', async ({ run }) => { - const { exitCode, dir } = await run(['foobar'], { installGitHubActions: true, testDir: 'e2e', language: 'TypeScript', addExamples: false }); + const { exitCode, dir } = await run(['foobar'], { installGitHubActions: true, testDir: 'tests', language: 'TypeScript', addExamples: false, installPlaywrightDependencies: true }); expect(exitCode).toBe(0); - expect(fs.existsSync(path.join(dir, 'foobar/e2e/example.spec.ts'))).toBeTruthy(); + expect(fs.existsSync(path.join(dir, 'foobar/tests/example.spec.ts'))).toBeTruthy(); expect(fs.existsSync(path.join(dir, 'foobar/package.json'))).toBeTruthy(); if (packageManager === 'npm') expect(fs.existsSync(path.join(dir, 'foobar/package-lock.json'))).toBeTruthy(); @@ -59,7 +59,7 @@ for (const packageManager of ['npm', 'yarn'] as ('npm' | 'yarn')[]) { }); test('should generate a project with JavaScript and without GHA', async ({ run }) => { - const { exitCode, dir } = await run([], { installGitHubActions: false, testDir: 'tests', language: 'JavaScript', addExamples: false }); + const { exitCode, dir } = await run([], { installGitHubActions: false, testDir: 'tests', language: 'JavaScript', addExamples: false, installPlaywrightDependencies: true }); expect(exitCode).toBe(0); expect(fs.existsSync(path.join(dir, 'tests/example.spec.js'))).toBeTruthy(); expect(fs.existsSync(path.join(dir, 'package.json'))).toBeTruthy(); @@ -72,7 +72,7 @@ for (const packageManager of ['npm', 'yarn'] as ('npm' | 'yarn')[]) { }); test('should generate be able to run the examples successfully', async ({ run }) => { - const { exitCode, dir, exec } = await run([], { installGitHubActions: false, testDir: 'tests', language: 'TypeScript', addExamples: true }); + const { exitCode, dir, exec } = await run([], { installGitHubActions: false, testDir: 'tests', language: 'TypeScript', addExamples: true, installPlaywrightDependencies: true }); expect(exitCode).toBe(0); expect(fs.existsSync(path.join(dir, 'tests/example.spec.ts'))).toBeTruthy(); expect(fs.existsSync(path.join(dir, 'package.json'))).toBeTruthy();