Package Exports
- eslint-plugin-playwright
- eslint-plugin-playwright/lib/index.js
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (eslint-plugin-playwright) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
ESLint Plugin Playwright
ESLint plugin for your Playwright testing needs.
Installation
Yarn
yarn add -D eslint-plugin-playwright
NPM
npm install -D eslint-plugin-playwright
Usage
This plugin bundles two configurations to work with both @playwright/test
or jest-playwright
.
With Playwright test runner
{
"extends": ["plugin:playwright/playwright-test"]
}
With Jest Playwright
{
"extends": ["plugin:playwright/jest-playwright"]
}
Rules
missing-playwright-await
🔧
Identify false positives when async Playwright APIs are not properly awaited.
Example
Example of incorrect code for this rule:
expect(page).toMatchText("text");
test.step("clicks the button", async () => {
await page.click("button");
});
Example of correct code for this rule:
await expect(page).toMatchText("text");
await test.step("clicks the button", async () => {
await page.click("button");
});
Options
The rule accepts a non-required option which can be used to specify custom matchers which this rule should also warn about. This is useful when creating your own async expect
matchers.
{
"playwright/missing-playwright-await": [
"error",
{ "customMatchers": ["toBeCustomThing"] }
]
}
no-page-pause
Prevent usage of page.pause()
.
Example
Example of incorrect code for this rule:
await page.click('button');
await page.pause();
Example of correct code for this rule:
await page.click('button');
no-element-handle
Disallow the creation of element handles with page.$
or page.$$
.
Examples of incorrect code for this rule:
// Element Handle
const buttonHandle = await page.$('button');
await buttonHandle.click();
// Element Handles
const linkHandles = await page.$$('a');
Example of correct code for this rule:
const buttonLocator = page.locator('button');
await buttonLocator.click();
no-eval
Disallow usage of page.$eval
and page.$$eval
.
Examples of incorrect code for this rule:
const searchValue = await page.$eval('#search', el => el.value);
const divCounts = await page.$$eval('div', (divs, min) => divs.length >= min, 10);
await page.$eval('#search', el => el.value);
await page.$$eval('#search', el => el.value);
Example of correct code for this rule:
await page.locator('button').evaluate(node => node.innerText);
await page.locator('div').evaluateAll((divs, min) => divs.length >= min, 10);
no-focused-test
Disallow usage of .only()
annotation
Examples of incorrect code for this rule:
test.only('focus this test', async ({ page }) => {});
test.describe.only('focus two tests', () => {
test('one', async ({ page }) => {});
test('two', async ({ page }) => {});
});
test.describe.parallel.only('focus two tests in parallel mode', () => {
test('one', async ({ page }) => {});
test('two', async ({ page }) => {});
});
test.describe.serial.only('focus two tests in serial mode', () => {
test('one', async ({ page }) => {});
test('two', async ({ page }) => {});
});
Examples of correct code for this rule:
test('this test', async ({ page }) => {});
test.describe('two tests', () => {
test('one', async ({ page }) => {});
test('two', async ({ page }) => {});
});
test.describe.parallel('two tests in parallel mode', () => {
test('one', async ({ page }) => {});
test('two', async ({ page }) => {});
});
test.describe.serial('two tests in serial mode', () => {
test('one', async ({ page }) => {});
test('two', async ({ page }) => {});
});
no-wait-for-timeout
Disallow usage of page.waitForTimeout()
.
Example of incorrect code for this rule:
await page.waitForTimeout(5000);
Examples of correct code for this rule:
// Use signals such as network events, selectors becoming visible and others instead.
await page.waitForLoadState();
await page.waitForUrl('/home');
await page.waitForFunction(() => window.innerWidth < 100);
no-skipped-test
Disallow usage of the .skip()
annotation.
Examples of incorrect code for this rule:
test.skip('skip this test', async ({ page }) => {});
test.describe.skip('skip two tests', () => {
test('one', async ({ page }) => {});
test('two', async ({ page }) => {});
});
test.describe('skip test inside describe', () => {
test.skip();
});
test.describe('skip test conditionally', async ({ browserName }) => {
test.skip(browserName === 'firefox', 'Working on it');
});
Examples of correct code for this rule:
test('this test', async ({ page }) => {});
test.describe('two tests', () => {
test('one', async ({ page }) => {});
test('two', async ({ page }) => {});
});
no-force-option
Disallow usage of the { force: true }
option.
Examples of incorrect code for this rule:
await page.locator('button').click({ force: true });
await page.locator('check').check({ force: true });
await page.locator('input').fill('something', { force: true });
Examples of correct code for this rule:
await page.locator('button').click();
await page.locator('check').check();
await page.locator('input').fill('something');