.eslintrc

@@ -1,3 +1,11 @@
 {
-  "extends": "@mskelton"
+  "extends": "@mskelton",
+  "overrides": [
+    {
+      "files": "**/*.spec.ts",
+      "rules": {
+        "no-template-curly-in-string": "off"
+      }
+    }
+  ]
 }

README.md

@@ -33,6 +33,26 @@ This plugin bundles two configurations to work with both `@playwright/test` or
 
 ### With [Playwright test runner](https://playwright.dev/docs/writing-tests)
 
+[Flat config](https://eslint.org/docs/latest/use/configure/configuration-files-new)
+(**eslint.config.js**)
+
+```javascript
+import playwright from 'eslint-plugin-playwright';
+
+export default [
+  playwright.configs['flat/recommended'],
+  {
+    rules: {
+      // Customize Playwright rules
+      // ...
+    },
+  },
+];
+```
+
+[Legacy config](https://eslint.org/docs/latest/use/configure/configuration-files)
+(**.eslintrc**)
+
 ```json
 {
   "extends": ["plugin:playwright/recommended"]
@@ -41,6 +61,30 @@ This plugin bundles two configurations to work with both `@playwright/test` or
 
 ### With [Jest Playwright](https://github.com/playwright-community/jest-playwright)
 
+[Flat config](https://eslint.org/docs/latest/use/configure/configuration-files-new)
+(**eslint.config.js**)
+
+```javascript
+import playwright from 'eslint-plugin-playwright';
+import jest from 'eslint-plugin-jest';
+
+export default [
+  playwright.configs['flat/jest-playwright'],
+  {
+    plugins: {
+      jest,
+    },
+    rules: {
+      // Customize Playwright rules
+      // ...
+    },
+  },
+];
+```
+
+[Legacy config](https://eslint.org/docs/latest/use/configure/configuration-files)
+(**.eslintrc**)
+
 ```json
 {
   "extends": ["plugin:playwright/jest-playwright"]
@@ -63,6 +107,24 @@ under the `playwright` key. It supports the following settings:
 
 You can configure these settings like so:
 
+[Flat config](https://eslint.org/docs/latest/use/configure/configuration-files-new)
+(**eslint.config.js**)
+
+```javascript
+export default [
+  {
+    settings: {
+      playwright: {
+        additionalAssertFunctionNames: ['assertCustomCondition'],
+      },
+    },
+  },
+];
+```
+
+[Legacy config](https://eslint.org/docs/latest/use/configure/configuration-files)
+(**.eslintrc**)
+
 ```json
 {
   "settings": {
@@ -81,31 +143,33 @@ command line option.\
 💡: Some problems reported by this rule are manually fixable by editor
 [suggestions](https://eslint.org/docs/latest/developer-guide/working-with-rules#providing-suggestions).
 
-|  ✔  | 🔧  | 💡  | Rule                                                                                                                                                | Description                                                       |
+| ✔  | 🔧  | 💡  | Rule                                                                                                                                                | Description                                                       |
 | :-: | :-: | :-: | --------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------- |
-|  ✔  |     |     | [expect-expect](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/expect-expect.md)                             | Enforce assertion to be made in a test body                       |
-|  ✔  |     |     | [max-nested-describe](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/max-nested-describe.md)                 | Enforces a maximum depth to nested describe calls                 |
-|  ✔  | 🔧  |     | [missing-playwright-await](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/missing-playwright-await.md)       | Enforce Playwright APIs to be awaited                             |
-|  ✔  |     |     | [no-conditional-in-test](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/no-conditional-in-test.md)           | Disallow conditional logic in tests                               |
-|  ✔  |     | 💡  | [no-element-handle](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/no-element-handle.md)                     | Disallow usage of element handles                                 |
-|  ✔  |     |     | [no-eval](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/no-eval.md)                                         | Disallow usage of `page.$eval` and `page.$$eval`                  |
-|  ✔  |     | 💡  | [no-focused-test](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/no-focused-test.md)                         | Disallow usage of `.only` annotation                              |
-|  ✔  |     |     | [no-force-option](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/no-force-option.md)                         | Disallow usage of the `{ force: true }` option                    |
-|  ✔  |     |     | [no-nested-step](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/no-nested-step.md)                           | Disallow nested `test.step()` methods                             |
-|  ✔  |     |     | [no-networkidle](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/no-networkidle.md)                           | Disallow usage of the `networkidle` option                        |
+| ✔  |     |     | [expect-expect](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/expect-expect.md)                             | Enforce assertion to be made in a test body                       |
+| ✔  |     |     | [max-nested-describe](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/max-nested-describe.md)                 | Enforces a maximum depth to nested describe calls                 |
+| ✔  | 🔧  |     | [missing-playwright-await](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/missing-playwright-await.md)       | Enforce Playwright APIs to be awaited                             |
+| ✔  |     |     | [no-conditional-in-test](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/no-conditional-in-test.md)           | Disallow conditional logic in tests                               |
+| ✔  |     | 💡  | [no-element-handle](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/no-element-handle.md)                     | Disallow usage of element handles                                 |
+| ✔  |     |     | [no-eval](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/no-eval.md)                                         | Disallow usage of `page.$eval` and `page.$$eval`                  |
+| ✔  |     | 💡  | [no-focused-test](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/no-focused-test.md)                         | Disallow usage of `.only` annotation                              |
+| ✔  |     |     | [no-force-option](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/no-force-option.md)                         | Disallow usage of the `{ force: true }` option                    |
+| ✔  |     |     | [no-nested-step](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/no-nested-step.md)                           | Disallow nested `test.step()` methods                             |
+| ✔  |     |     | [no-networkidle](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/no-networkidle.md)                           | Disallow usage of the `networkidle` option                        |
 |     |     |     | [no-nth-methods](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/no-nth-methods.md)                           | Disallow usage of `first()`, `last()`, and `nth()` methods        |
-|  ✔  |     |     | [no-page-pause](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/no-page-pause.md)                             | Disallow using `page.pause`                                       |
-|  ✔  | 🔧  |     | [no-useless-await](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/no-useless-await.md)                       | Disallow unnecessary `await`s for Playwright methods              |
+| ✔  |     |     | [no-page-pause](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/no-page-pause.md)                             | Disallow using `page.pause`                                       |
+|     |     |     | [no-raw-locators](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/no-raw-locators.md)                         | Disallow using raw locators                                       |
+| ✔  | 🔧  |     | [no-useless-await](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/no-useless-await.md)                       | Disallow unnecessary `await`s for Playwright methods              |
 |     |     |     | [no-restricted-matchers](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/no-restricted-matchers.md)           | Disallow specific matchers & modifiers                            |
-|  ✔  |     | 💡  | [no-skipped-test](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/no-skipped-test.md)                         | Disallow usage of the `.skip` annotation                          |
-|  ✔  | 🔧  |     | [no-useless-not](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/no-useless-not.md)                           | Disallow usage of `not` matchers when a specific matcher exists   |
-|  ✔  |     | 💡  | [no-wait-for-timeout](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/no-wait-for-timeout.md)                 | Disallow usage of `page.waitForTimeout`                           |
+| ✔  |     | 💡  | [no-skipped-test](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/no-skipped-test.md)                         | Disallow usage of the `.skip` annotation                          |
+| ✔  | 🔧  |     | [no-useless-not](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/no-useless-not.md)                           | Disallow usage of `not` matchers when a specific matcher exists   |
+| ✔  |     | 💡  | [no-wait-for-timeout](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/no-wait-for-timeout.md)                 | Disallow usage of `page.waitForTimeout`                           |
 |     |     | 💡  | [prefer-strict-equal](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/prefer-strict-equal.md)                 | Suggest using `toStrictEqual()`                                   |
 |     | 🔧  |     | [prefer-lowercase-title](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/prefer-lowercase-title.md)           | Enforce lowercase test names                                      |
 |     | 🔧  |     | [prefer-to-be](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/prefer-to-be.md)                               | Suggest using `toBe()`                                            |
 |     | 🔧  |     | [prefer-to-contain](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/prefer-to-contain.md)                     | Suggest using `toContain()`                                       |
+|     | 🔧  |     | [prefer-to-have-count](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/prefer-to-have-count.md)               | Suggest using `toHaveCount()`                                     |
 |     | 🔧  |     | [prefer-to-have-length](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/prefer-to-have-length.md)             | Suggest using `toHaveLength()`                                    |
-|  ✔  | 🔧  |     | [prefer-web-first-assertions](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/prefer-web-first-assertions.md) | Suggest using web first assertions                                |
+| ✔  | 🔧  |     | [prefer-web-first-assertions](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/prefer-web-first-assertions.md) | Suggest using web first assertions                                |
 |     |     |     | [require-top-level-describe](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/require-top-level-describe.md)   | Require test cases and hooks to be inside a `test.describe` block |
 |     | 🔧  |     | [require-soft-assertions](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/require-soft-assertions.md)         | Require assertions to use `expect.soft()`                         |
-|  ✔  |     |     | [valid-expect](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/valid-expect.md)                               | Enforce valid `expect()` usage                                    |
+| ✔  |     |     | [valid-expect](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/valid-expect.md)                               | Enforce valid `expect()` usage                                    |

docs/rules/no-eval.md

@@ -10,7 +10,7 @@ const searchValue = await page.$eval('#search', (el) => el.value);
 const divCounts = await page.$$eval(
   'div',
   (divs, min) => divs.length >= min,
-  10
+  10,
 );
 
 await page.$eval('#search', (el) => el.value);

docs/rules/prefer-to-have-count.md

@@ -0,0 +1,23 @@
+# Suggest using `toHaveCount()` (`prefer-to-have-count`)
+
+In order to have a better failure message, `toHaveCount()` should be used upon
+asserting expectations on locators `count()` method.
+
+## Rule details
+
+This rule triggers a warning if `toBe()`, `toEqual()` or `toStrictEqual()` is
+used to assert locators `count()` method.
+
+The following patterns are considered warnings:
+
+```javascript
+expect(await files.count()).toBe(1);
+expect(await files.count()).toEqual(1);
+expect(await files.count()).toStrictEqual(1);
+```
+
+The following pattern is **not** a warning:
+
+```javascript
+await expect(files).toHaveCount(1);
+```

examples/eslint.config.js

@@ -0,0 +1,25 @@
+import playwright from 'eslint-plugin-playwright';
+
+export default [
+  playwright.configs['flat/recommended'],
+  {
+    languageOptions: {
+      sourceType: 'module',
+      ecmaVersion: 2022,
+    },
+    rules: {
+      'playwright/prefer-lowercase-title': 'warn',
+      'playwright/prefer-to-be': 'warn',
+      'playwright/prefer-to-have-length': 'warn',
+      'playwright/prefer-strict-equal': 'warn',
+      'playwright/max-nested-describe': ['warn', { max: 1 }],
+      'playwright/no-restricted-matchers': [
+        'error',
+        {
+          toBeFalsy: 'Use `toBe(false)` instead.',
+          not: null,
+        },
+      ],
+    },
+  },
+];

examples/package.json

@@ -5,8 +5,8 @@
     "lint": "eslint ."
   },
   "dependencies": {
-    "@playwright/test": "^1.35.1",
-    "eslint": "^8.43.0",
-    "eslint-plugin-playwright": "workspace:*"
+    "@playwright/test": "^1.38.1",
+    "eslint": "^8.51.0",
+    "eslint-plugin-playwright": "file:../"
   }
 }

jest.config.js

@@ -1,4 +1,4 @@
-/** @type {import('ts-jest/dist/types').InitialOptionsTsJest} */
+/** @type {import('ts-jest/dist/types').JestConfigWithTsJest} */
 module.exports = {
   preset: 'ts-jest',
   testEnvironment: 'node',

package.json

@@ -2,7 +2,7 @@
   "name": "eslint-plugin-playwright",
   "description": "ESLint plugin for Playwright testing.",
   "version": "0.0.0-semantically-released",
-  "packageManager": "pnpm@8.4.0",
+  "packageManager": "pnpm@8.8.0",
   "main": "lib/index.js",
   "repository": "https://github.com/playwright-community/eslint-plugin-playwright",
   "author": "Mark Skelton <mark@mskelton.dev>",
@@ -23,20 +23,19 @@
     "ts": "tsc"
   },
   "devDependencies": {
-    "@mskelton/eslint-config": "^8.0.0",
-    "@types/dedent": "^0.7.0",
-    "@types/eslint": "^8.40.2",
-    "@types/estree": "^1.0.1",
-    "@typescript-eslint/eslint-plugin": "^5.59.11",
-    "@typescript-eslint/parser": "^5.59.11",
-    "dedent": "^0.7.0",
-    "eslint": "^8.43.0",
+    "@mskelton/eslint-config": "^8.4.0",
+    "@types/eslint": "^8.44.3",
+    "@types/estree": "^1.0.2",
+    "@typescript-eslint/eslint-plugin": "^6.7.3",
+    "@typescript-eslint/parser": "^6.7.3",
+    "dedent": "^1.5.1",
+    "eslint": "^8.50.0",
     "eslint-plugin-sort": "^2.10.0",
-    "jest": "^29.5.0",
-    "prettier": "^2.8.8",
-    "semantic-release": "^21.0.5",
-    "ts-jest": "^29.1.0",
-    "typescript": "^5.1.3"
+    "jest": "^29.7.0",
+    "prettier": "^3.0.3",
+    "semantic-release": "^22.0.5",
+    "ts-jest": "^29.1.1",
+    "typescript": "^5.2.2"
   },
   "peerDependencies": {
     "eslint": ">=7",
@@ -46,5 +45,8 @@
     "eslint-plugin-jest": {
       "optional": true
     }
+  },
+  "dependencies": {
+    "globals": "^13.23.0"
   }
 }