mirror of
https://github.com/microsoft/playwright.git
synced 2024-08-17 08:00:23 +03:00
chore(create-playwright): enhance UX follow-ups and add more verbose Playwright Test config (#8942)
This commit is contained in:
parent
d82cb9a2ff
commit
f68ae4a2e0
@ -13,4 +13,3 @@ browser_patches/chromium/output/
|
||||
**/*.d.ts
|
||||
output/
|
||||
/test-results/
|
||||
packages/create-playwright/assets/**
|
||||
|
@ -5,3 +5,4 @@
|
||||
/tests/**/*
|
||||
/playwright.config.ts
|
||||
/tsconfig.json
|
||||
/assets/.eslintrc.js
|
||||
|
6
packages/create-playwright/assets/.eslintrc.js
Normal file
6
packages/create-playwright/assets/.eslintrc.js
Normal file
@ -0,0 +1,6 @@
|
||||
module.exports = {
|
||||
"extends": "../../../.eslintrc.js",
|
||||
"rules": {
|
||||
"notice/notice": 0
|
||||
}
|
||||
};
|
@ -5,7 +5,7 @@ on:
|
||||
pull_request:
|
||||
branches: [ main, master ]
|
||||
jobs:
|
||||
build:
|
||||
test:
|
||||
timeout-minutes: 60
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
@ -19,3 +19,8 @@ jobs:
|
||||
run: npx playwright install --with-deps
|
||||
- name: Run Playwright tests
|
||||
run: {{runTestsCommand}}
|
||||
- uses: actions/upload-artifact@v2
|
||||
if: failure()
|
||||
with:
|
||||
name: playwright-test-results
|
||||
path: test-results/
|
||||
|
@ -5,10 +5,16 @@ const path = require('path')
|
||||
/**
|
||||
* @see https://playwright.dev/docs/test-configuration
|
||||
* @type{import('@playwright/test').PlaywrightTestConfig}
|
||||
* */
|
||||
*/
|
||||
const config = {
|
||||
// Timeout per test
|
||||
timeout: 30 * 1000,
|
||||
// Test directory
|
||||
testDir: path.join(__dirname, '{{testDir}}'),
|
||||
// If a test fails, retry it additional 2 times
|
||||
retries: 2,
|
||||
// Artifacts folder where screenshots, videos, and traces are stored.
|
||||
outputDir: 'test-results/',
|
||||
|
||||
// Run your local dev server before starting the tests:
|
||||
// https://playwright.dev/docs/test-advanced#launching-a-development-web-server-during-the-tests
|
||||
@ -17,37 +23,48 @@ const config = {
|
||||
// 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: 'retry-with-trace',
|
||||
|
||||
// All available context options: https://playwright.dev/docs/api/class-browser#browser-new-context
|
||||
contextOptions: {
|
||||
ignoreHTTPSErrors: true,
|
||||
},
|
||||
},
|
||||
|
||||
projects: [
|
||||
{
|
||||
name: 'Desktop Chrome',
|
||||
use: {
|
||||
...devices['Desktop Chrome'],
|
||||
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'Desktop Firefox',
|
||||
use: {
|
||||
...devices['Desktop Firefox'],
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'Desktop Safari',
|
||||
use: {
|
||||
browserName: 'webkit',
|
||||
viewport: { width: 1200, height: 750 },
|
||||
}
|
||||
...devices['Desktop Safari'],
|
||||
},
|
||||
},
|
||||
// Test against mobile viewports.
|
||||
{
|
||||
name: 'Mobile Chrome',
|
||||
use: devices['Pixel 5'],
|
||||
use: {
|
||||
...devices['Pixel 5'],
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'Mobile Safari',
|
||||
use: devices['iPhone 12'],
|
||||
},
|
||||
{
|
||||
name: 'Desktop Firefox',
|
||||
use: {
|
||||
browserName: 'firefox',
|
||||
viewport: { width: 800, height: 600 },
|
||||
}
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
module.exports = config;
|
||||
|
@ -3,8 +3,14 @@ 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, retry it additional 2 times
|
||||
retries: 2,
|
||||
// Artifacts folder where screenshots, videos, and traces are stored.
|
||||
outputDir: 'test-results/',
|
||||
|
||||
// Run your local dev server before starting the tests:
|
||||
// https://playwright.dev/docs/test-advanced#launching-a-development-web-server-during-the-tests
|
||||
@ -13,36 +19,48 @@ const config: PlaywrightTestConfig = {
|
||||
// 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: 'retry-with-trace',
|
||||
|
||||
// All available context options: https://playwright.dev/docs/api/class-browser#browser-new-context
|
||||
contextOptions: {
|
||||
ignoreHTTPSErrors: true,
|
||||
},
|
||||
},
|
||||
|
||||
projects: [
|
||||
{
|
||||
name: 'Desktop Chrome',
|
||||
use: {
|
||||
...devices['Desktop Chrome'],
|
||||
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'Desktop Firefox',
|
||||
use: {
|
||||
...devices['Desktop Firefox'],
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'Desktop Safari',
|
||||
use: {
|
||||
browserName: 'webkit',
|
||||
viewport: { width: 1200, height: 750 },
|
||||
}
|
||||
...devices['Desktop Safari'],
|
||||
},
|
||||
},
|
||||
// Test against mobile viewports.
|
||||
{
|
||||
name: 'Mobile Chrome',
|
||||
use: devices['Pixel 5'],
|
||||
use: {
|
||||
...devices['Pixel 5'],
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'Mobile Safari',
|
||||
use: devices['iPhone 12'],
|
||||
},
|
||||
{
|
||||
name: 'Desktop Firefox',
|
||||
use: {
|
||||
browserName: 'firefox',
|
||||
viewport: { width: 800, height: 600 },
|
||||
}
|
||||
},
|
||||
],
|
||||
};
|
||||
export default config;
|
||||
|
@ -43,6 +43,7 @@ class Generator {
|
||||
const { files, commands } = await this._identifyChanges(answers);
|
||||
executeCommands(this.rootDir, commands);
|
||||
await createFiles(this.rootDir, files);
|
||||
this._patchGitIgnore();
|
||||
await this._patchPackageJSON();
|
||||
this._printOutro(answers);
|
||||
}
|
||||
@ -116,19 +117,18 @@ class Generator {
|
||||
command: 'npx playwright install --with-deps',
|
||||
});
|
||||
|
||||
files.set('.gitignore', this._buildGitIgnore());
|
||||
|
||||
return { files, commands };
|
||||
}
|
||||
|
||||
private _buildGitIgnore(): string {
|
||||
private _patchGitIgnore() {
|
||||
const gitIgnorePath = path.join(this.rootDir, '.gitignore');
|
||||
let gitIgnore = '';
|
||||
if (fs.existsSync(path.join(this.rootDir, '.gitignore')))
|
||||
gitIgnore = fs.readFileSync(path.join(this.rootDir, '.gitignore'), 'utf-8').trimEnd() + '\n';
|
||||
if (fs.existsSync(gitIgnorePath))
|
||||
gitIgnore = fs.readFileSync(gitIgnorePath, 'utf-8').trimEnd() + '\n';
|
||||
if (!gitIgnore.includes('node_modules'))
|
||||
gitIgnore += 'node_modules/\n';
|
||||
gitIgnore += 'test-results/\n';
|
||||
return gitIgnore;
|
||||
fs.writeFileSync(gitIgnorePath, gitIgnore);
|
||||
}
|
||||
|
||||
private _readAsset(asset: string): string {
|
||||
@ -153,24 +153,29 @@ class Generator {
|
||||
console.log(colors.green('✔ Success!') + ' ' + colors.bold(`Created a Playwright Test project at ${this.rootDir}`));
|
||||
const pathToNavigate = path.relative(process.cwd(), this.rootDir);
|
||||
const prefix = pathToNavigate !== '' ? ` cd ${pathToNavigate}\n` : '';
|
||||
const exampleSpecPath = `${answers.testDir}${path.sep}example.spec.${languagetoFileExtension(answers.language)}`;
|
||||
console.log(`Inside that directory, you can run several commands:
|
||||
|
||||
${colors.cyan(commandToRunTests(this.packageManager))}
|
||||
Runs the end-to-end tests.
|
||||
|
||||
${colors.cyan(commandToRunTests(this.packageManager) + ' -- --project=Desktop Chrome')}
|
||||
${colors.cyan(commandToRunTests(this.packageManager) + ' -- --project="Desktop Chrome"')}
|
||||
Runs the tests only on Desktop Chrome.
|
||||
|
||||
${colors.cyan(commandToRunTests(this.packageManager) + ` -- ${answers.testDir}${path.sep}example.spec.${languagetoFileExtension(answers.language)}`)}
|
||||
${colors.cyan(commandToRunTests(this.packageManager) + ` -- ${exampleSpecPath}`)}
|
||||
Runs the tests of a specific file.
|
||||
|
||||
${colors.cyan((this.packageManager === 'npm' ? 'npx' : 'yarn') + ' playwright debug ' + commandToRunTests(this.packageManager))}
|
||||
${colors.cyan(`${commandToRunTests(this.packageManager)} --debug`)}
|
||||
Runs the tests in debug mode.
|
||||
|
||||
We suggest that you begin by typing:
|
||||
|
||||
${colors.cyan(prefix + ' ' + commandToRunTests(this.packageManager))}
|
||||
|
||||
And check out the following files:
|
||||
- ./${pathToNavigate ? pathToNavigate + '/' : ''}${exampleSpecPath} - Example end-to-end test
|
||||
- ./${pathToNavigate ? pathToNavigate + '/' : ''}playwright.config.${languagetoFileExtension(answers.language)} - Playwright Test configuration
|
||||
|
||||
Visit https://playwright.dev/docs/intro for more information. ✨
|
||||
|
||||
Happy hacking! 🎭`);
|
||||
|
Loading…
Reference in New Issue
Block a user