eslint-plugin-playwright 1.6.2 → 1.7.0

package/README.md

@@ -194,6 +194,8 @@ CLI option\
 | [prefer-hooks-in-order](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/prefer-hooks-in-order.md)             | Prefer having hooks in a consistent order                          |     |     |     |
 | [prefer-hooks-on-top](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/prefer-hooks-on-top.md)                 | Suggest having hooks before any test cases                         |     |     |     |
 | [prefer-lowercase-title](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/prefer-lowercase-title.md)           | Enforce lowercase test names                                       |     | 🔧  |     |
+| [prefer-native-locators](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/prefer-native-locators.md)           | Suggest built-in locators over `page.locator()`                    |     | 🔧  |     |
+| [prefer-locator](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/prefer-locator.md)                           | Suggest locators over page methods                                 |     |     |     |
 | [prefer-strict-equal](https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/prefer-strict-equal.md)                 | Suggest using `toStrictEqual()`                                    |     |     | 💡  |
 | [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()`                                        |     | 🔧  |     |

package/dist/index.d.mts

@@ -41,7 +41,9 @@ declare const _default: {
                         'prefer-equality-matcher': eslint.Rule.RuleModule;
                         'prefer-hooks-in-order': eslint.Rule.RuleModule;
                         'prefer-hooks-on-top': eslint.Rule.RuleModule;
+                        'prefer-locator': eslint.Rule.RuleModule;
                         'prefer-lowercase-title': eslint.Rule.RuleModule;
+                        'prefer-native-locators': eslint.Rule.RuleModule;
                         'prefer-strict-equal': eslint.Rule.RuleModule;
                         'prefer-to-be': eslint.Rule.RuleModule;
                         'prefer-to-contain': eslint.Rule.RuleModule;
@@ -106,7 +108,9 @@ declare const _default: {
                         'prefer-equality-matcher': eslint.Rule.RuleModule;
                         'prefer-hooks-in-order': eslint.Rule.RuleModule;
                         'prefer-hooks-on-top': eslint.Rule.RuleModule;
+                        'prefer-locator': eslint.Rule.RuleModule;
                         'prefer-lowercase-title': eslint.Rule.RuleModule;
+                        'prefer-native-locators': eslint.Rule.RuleModule;
                         'prefer-strict-equal': eslint.Rule.RuleModule;
                         'prefer-to-be': eslint.Rule.RuleModule;
                         'prefer-to-contain': eslint.Rule.RuleModule;
@@ -273,7 +277,9 @@ declare const _default: {
         'prefer-equality-matcher': eslint.Rule.RuleModule;
         'prefer-hooks-in-order': eslint.Rule.RuleModule;
         'prefer-hooks-on-top': eslint.Rule.RuleModule;
+        'prefer-locator': eslint.Rule.RuleModule;
         'prefer-lowercase-title': eslint.Rule.RuleModule;
+        'prefer-native-locators': eslint.Rule.RuleModule;
         'prefer-strict-equal': eslint.Rule.RuleModule;
         'prefer-to-be': eslint.Rule.RuleModule;
         'prefer-to-contain': eslint.Rule.RuleModule;

package/dist/index.d.ts

@@ -41,7 +41,9 @@ declare const _default: {
                         'prefer-equality-matcher': eslint.Rule.RuleModule;
                         'prefer-hooks-in-order': eslint.Rule.RuleModule;
                         'prefer-hooks-on-top': eslint.Rule.RuleModule;
+                        'prefer-locator': eslint.Rule.RuleModule;
                         'prefer-lowercase-title': eslint.Rule.RuleModule;
+                        'prefer-native-locators': eslint.Rule.RuleModule;
                         'prefer-strict-equal': eslint.Rule.RuleModule;
                         'prefer-to-be': eslint.Rule.RuleModule;
                         'prefer-to-contain': eslint.Rule.RuleModule;
@@ -106,7 +108,9 @@ declare const _default: {
                         'prefer-equality-matcher': eslint.Rule.RuleModule;
                         'prefer-hooks-in-order': eslint.Rule.RuleModule;
                         'prefer-hooks-on-top': eslint.Rule.RuleModule;
+                        'prefer-locator': eslint.Rule.RuleModule;
                         'prefer-lowercase-title': eslint.Rule.RuleModule;
+                        'prefer-native-locators': eslint.Rule.RuleModule;
                         'prefer-strict-equal': eslint.Rule.RuleModule;
                         'prefer-to-be': eslint.Rule.RuleModule;
                         'prefer-to-contain': eslint.Rule.RuleModule;
@@ -273,7 +277,9 @@ declare const _default: {
         'prefer-equality-matcher': eslint.Rule.RuleModule;
         'prefer-hooks-in-order': eslint.Rule.RuleModule;
         'prefer-hooks-on-top': eslint.Rule.RuleModule;
+        'prefer-locator': eslint.Rule.RuleModule;
         'prefer-lowercase-title': eslint.Rule.RuleModule;
+        'prefer-native-locators': eslint.Rule.RuleModule;
         'prefer-strict-equal': eslint.Rule.RuleModule;
         'prefer-to-be': eslint.Rule.RuleModule;
         'prefer-to-contain': eslint.Rule.RuleModule;
@@ -291,4 +297,4 @@ declare const _default: {
     };
 };
 
-export { _default as default };
+export = _default;

package/dist/index.js

@@ -21,6 +21,28 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));
+var __accessCheck = (obj, member, msg) => {
+  if (!member.has(obj))
+    throw TypeError("Cannot " + msg);
+};
+var __privateGet = (obj, member, getter) => {
+  __accessCheck(obj, member, "read from private field");
+  return getter ? getter.call(obj) : member.get(obj);
+};
+var __privateAdd = (obj, member, value) => {
+  if (member.has(obj))
+    throw TypeError("Cannot add the same private member more than once");
+  member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+};
+var __privateSet = (obj, member, value, setter) => {
+  __accessCheck(obj, member, "write to private field");
+  setter ? setter.call(obj, value) : member.set(obj, value);
+  return value;
+};
+var __privateMethod = (obj, member, method) => {
+  __accessCheck(obj, member, "access private method");
+  return method;
+};
 
 // src/index.ts
 var import_globals = __toESM(require("globals"));
@@ -82,20 +104,45 @@ var VALID_CHAINS = /* @__PURE__ */ new Set([
 ]);
 var joinChains = (a, b) => a && b ? [...a, ...b] : null;
 var isSupportedAccessor = (node, value) => isIdentifier(node, value) || isStringNode(node, value);
-function getNodeChain(node) {
+var _nodes, _leaves, _buildChain, buildChain_fn;
+var Chain = class {
+  constructor(node) {
+    __privateAdd(this, _buildChain);
+    __privateAdd(this, _nodes, null);
+    __privateAdd(this, _leaves, /* @__PURE__ */ new WeakSet());
+    __privateSet(this, _nodes, __privateMethod(this, _buildChain, buildChain_fn).call(this, node));
+  }
+  isLeaf(node) {
+    return __privateGet(this, _leaves).has(node);
+  }
+  get nodes() {
+    return __privateGet(this, _nodes);
+  }
+};
+_nodes = new WeakMap();
+_leaves = new WeakMap();
+_buildChain = new WeakSet();
+buildChain_fn = function(node, insideCall = false) {
   if (isSupportedAccessor(node)) {
+    if (insideCall) {
+      __privateGet(this, _leaves).add(node);
+    }
     return [node];
   }
   switch (node.type) {
     case "TaggedTemplateExpression":
-      return getNodeChain(node.tag);
+      return __privateMethod(this, _buildChain, buildChain_fn).call(this, node.tag);
     case "MemberExpression":
-      return joinChains(getNodeChain(node.object), getNodeChain(node.property));
+      return joinChains(
+        __privateMethod(this, _buildChain, buildChain_fn).call(this, node.object),
+        __privateMethod(this, _buildChain, buildChain_fn).call(this, node.property, insideCall)
+      );
     case "CallExpression":
-      return getNodeChain(node.callee);
+      return __privateMethod(this, _buildChain, buildChain_fn).call(this, node.callee, true);
+    default:
+      return null;
   }
-  return null;
-}
+};
 var resolvePossibleAliasedGlobal = (context, global) => {
   const globalAliases = context.settings.playwright?.globalAliases ?? {};
   const alias = Object.entries(globalAliases).find(
@@ -126,7 +173,7 @@ function determinePlaywrightFnGroup(name) {
   return "unknown";
 }
 var modifiers = /* @__PURE__ */ new Set(["not", "resolves", "rejects"]);
-var findModifiersAndMatcher = (members) => {
+var findModifiersAndMatcher = (chain, members, stage) => {
   const modifiers2 = [];
   for (const member of members) {
     const name = getStringValue(member);
@@ -140,6 +187,9 @@ var findModifiersAndMatcher = (members) => {
         return "modifier-unknown";
       }
     } else if (name !== "not") {
+      if (stage === "modifiers") {
+        return null;
+      }
       if (member.parent?.type === "MemberExpression" && member.parent.parent?.type === "CallExpression") {
         return {
           matcher: member,
@@ -150,6 +200,9 @@ var findModifiersAndMatcher = (members) => {
       }
       return "modifier-unknown";
     }
+    if (chain.isLeaf(member)) {
+      stage = "matchers";
+    }
     modifiers2.push(member);
   }
   return "matcher-not-found";
@@ -157,8 +210,15 @@ var findModifiersAndMatcher = (members) => {
 function getExpectArguments(call) {
   return findParent(call.head.node, "CallExpression")?.arguments ?? [];
 }
-var parseExpectCall = (call) => {
-  const modifiersAndMatcher = findModifiersAndMatcher(call.members);
+var parseExpectCall = (chain, call, stage) => {
+  const modifiersAndMatcher = findModifiersAndMatcher(
+    chain,
+    call.members,
+    stage
+  );
+  if (!modifiersAndMatcher) {
+    return null;
+  }
   if (typeof modifiersAndMatcher === "string") {
     return modifiersAndMatcher;
   }
@@ -190,19 +250,15 @@ var findTopMostCallExpression = (node) => {
   return top;
 };
 function parse(context, node) {
-  const chain = getNodeChain(node);
-  if (!chain?.length) {
+  const chain = new Chain(node);
+  if (!chain.nodes?.length)
     return null;
-  }
-  const [first, ...rest] = chain;
+  const [first, ...rest] = chain.nodes;
   const resolved = resolveToPlaywrightFn(context, first);
   if (!resolved)
     return null;
   let name = resolved.original ?? resolved.local;
   const links = [name, ...rest.map((link) => getStringValue(link))];
-  if (name !== "expect" && !VALID_CHAINS.has(links.join("."))) {
-    return null;
-  }
   if (name === "test" && links.length > 1) {
     const nextLinkName = links[1];
     const nextLinkGroup = determinePlaywrightFnGroup(nextLinkName);
@@ -210,6 +266,9 @@ function parse(context, node) {
       name = nextLinkName;
     }
   }
+  if (name !== "expect" && !VALID_CHAINS.has(links.join("."))) {
+    return null;
+  }
   const parsedFnCall = {
     head: { ...resolved, node: first },
     // every member node must have a member expression as their parent
@@ -219,7 +278,14 @@ function parse(context, node) {
   };
   const group = determinePlaywrightFnGroup(name);
   if (group === "expect") {
-    const result = parseExpectCall(parsedFnCall);
+    let stage = chain.isLeaf(parsedFnCall.head.node) ? "matchers" : "modifiers";
+    if (isIdentifier(rest[0], "expect")) {
+      stage = chain.isLeaf(rest[0]) ? "matchers" : "modifiers";
+      parsedFnCall.members.shift();
+    }
+    const result = parseExpectCall(chain, parsedFnCall, stage);
+    if (!result)
+      return null;
     if (typeof result === "string" && findTopMostCallExpression(node) !== node) {
       return null;
     }
@@ -230,7 +296,7 @@ function parse(context, node) {
     }
     return result;
   }
-  if (chain.slice(0, chain.length - 1).some((n) => getParent(n)?.type !== "MemberExpression")) {
+  if (chain.nodes.slice(0, chain.nodes.length - 1).some((n) => getParent(n)?.type !== "MemberExpression")) {
     return null;
   }
   const parent = getParent(node);
@@ -275,7 +341,7 @@ function getRawValue(node) {
   return node.type === "Literal" ? node.raw : void 0;
 }
 function isIdentifier(node, name) {
-  return node.type === "Identifier" && (!name || (typeof name === "string" ? node.name === name : name.test(node.name)));
+  return node?.type === "Identifier" && (!name || (typeof name === "string" ? node.name === name : name.test(node.name)));
 }
 function isLiteral(node, type, value) {
   return node.type === "Literal" && (value === void 0 ? typeof node.value === type : node.value === value);
@@ -292,7 +358,8 @@ function isStringNode(node, value) {
   return node && (isStringLiteral(node, value) || isTemplateLiteral(node, value));
 }
 function isPropertyAccessor(node, name) {
-  return getStringValue(node.property) === name;
+  const value = getStringValue(node.property);
+  return typeof name === "string" ? value === name : name.test(value);
 }
 function getParent(node) {
   return node.parent;
@@ -2240,6 +2307,66 @@ var prefer_hooks_on_top_default = createRule({
   }
 });
 
+// src/rules/prefer-locator.ts
+var pageMethods2 = /* @__PURE__ */ new Set([
+  "click",
+  "dblclick",
+  "dispatchEvent",
+  "fill",
+  "focus",
+  "getAttribute",
+  "hover",
+  "innerHTML",
+  "innerText",
+  "inputValue",
+  "isChecked",
+  "isDisabled",
+  "isEditable",
+  "isEnabled",
+  "isHidden",
+  "isVisible",
+  "press",
+  "selectOption",
+  "setChecked",
+  "setInputFiles",
+  "tap",
+  "textContent",
+  "uncheck"
+]);
+function isSupportedMethod2(node) {
+  if (node.callee.type !== "MemberExpression")
+    return false;
+  const name = getStringValue(node.callee.property);
+  return pageMethods2.has(name) && isPageMethod(node, name);
+}
+var prefer_locator_default = createRule({
+  create(context) {
+    return {
+      CallExpression(node) {
+        if (!isSupportedMethod2(node))
+          return;
+        context.report({
+          messageId: "preferLocator",
+          node
+        });
+      }
+    };
+  },
+  meta: {
+    docs: {
+      category: "Best Practices",
+      description: "Suggest locators over page methods",
+      recommended: false,
+      url: "https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/prefer-locator.md"
+    },
+    messages: {
+      preferLocator: "Prefer locator methods instead of page methods"
+    },
+    schema: [],
+    type: "suggestion"
+  }
+});
+
 // src/rules/prefer-lowercase-title.ts
 var prefer_lowercase_title_default = createRule({
   create(context) {
@@ -2335,6 +2462,113 @@ var prefer_lowercase_title_default = createRule({
   }
 });
 
+// src/rules/prefer-native-locators.ts
+var compilePatterns = ({
+  testIdAttribute
+}) => {
+  const patterns = [
+    {
+      attribute: "aria-label",
+      messageId: "unexpectedLabelQuery",
+      replacement: "getByLabel"
+    },
+    {
+      attribute: "role",
+      messageId: "unexpectedRoleQuery",
+      replacement: "getByRole"
+    },
+    {
+      attribute: "placeholder",
+      messageId: "unexpectedPlaceholderQuery",
+      replacement: "getByPlaceholder"
+    },
+    {
+      attribute: "alt",
+      messageId: "unexpectedAltTextQuery",
+      replacement: "getByAltText"
+    },
+    {
+      attribute: "title",
+      messageId: "unexpectedTitleQuery",
+      replacement: "getByTitle"
+    },
+    {
+      attribute: testIdAttribute,
+      messageId: "unexpectedTestIdQuery",
+      replacement: "getByTestId"
+    }
+  ];
+  return patterns.map(({ attribute, ...pattern }) => ({
+    ...pattern,
+    pattern: new RegExp(`^\\[${attribute}=['"]?(.+?)['"]?\\]$`)
+  }));
+};
+var prefer_native_locators_default = createRule({
+  create(context) {
+    const { testIdAttribute } = {
+      testIdAttribute: "data-testid",
+      ...context.options?.[0] ?? {}
+    };
+    const patterns = compilePatterns({ testIdAttribute });
+    return {
+      CallExpression(node) {
+        if (node.callee.type !== "MemberExpression")
+          return;
+        const query = getStringValue(node.arguments[0]);
+        if (!isPageMethod(node, "locator"))
+          return;
+        for (const pattern of patterns) {
+          const match = query.match(pattern.pattern);
+          if (match) {
+            context.report({
+              fix(fixer) {
+                const start = node.callee.type === "MemberExpression" ? node.callee.property.range[0] : node.range[0];
+                const end = node.range[1];
+                const rangeToReplace = [start, end];
+                const newText = `${pattern.replacement}("${match[1]}")`;
+                return fixer.replaceTextRange(rangeToReplace, newText);
+              },
+              messageId: pattern.messageId,
+              node
+            });
+            return;
+          }
+        }
+      }
+    };
+  },
+  meta: {
+    docs: {
+      category: "Best Practices",
+      description: "Prefer native locator functions",
+      recommended: false,
+      url: "https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/prefer-native-locators.md"
+    },
+    fixable: "code",
+    messages: {
+      unexpectedAltTextQuery: "Use getByAltText() instead",
+      unexpectedLabelQuery: "Use getByLabel() instead",
+      unexpectedPlaceholderQuery: "Use getByPlaceholder() instead",
+      unexpectedRoleQuery: "Use getByRole() instead",
+      unexpectedTestIdQuery: "Use getByTestId() instead",
+      unexpectedTitleQuery: "Use getByTitle() instead"
+    },
+    schema: [
+      {
+        additionalProperties: false,
+        properties: {
+          testIdAttribute: {
+            default: "data-testid",
+            type: "string"
+          }
+        },
+        type: "object"
+      }
+    ],
+    type: "suggestion"
+  }
+});
+
 // src/rules/prefer-strict-equal.ts
 var prefer_strict_equal_default = createRule({
   create(context) {
@@ -2544,16 +2778,18 @@ var prefer_to_contain_default = createRule({
 });
 
 // src/rules/prefer-to-have-count.ts
+var matchers = /* @__PURE__ */ new Set([...equalityMatchers, "toHaveLength"]);
 var prefer_to_have_count_default = createRule({
   create(context) {
     return {
       CallExpression(node) {
         const call = parseFnCall(context, node);
-        if (call?.type !== "expect" || !equalityMatchers.has(call.matcherName)) {
+        if (call?.type !== "expect" || !matchers.has(call.matcherName)) {
           return;
         }
+        const accessor = call.matcherName === "toHaveLength" ? "all" : "count";
         const argument = dereference(context, call.args[0]);
-        if (argument?.type !== "AwaitExpression" || argument.argument.type !== "CallExpression" || argument.argument.callee.type !== "MemberExpression" || !isPropertyAccessor(argument.argument.callee, "count")) {
+        if (argument?.type !== "AwaitExpression" || argument.argument.type !== "CallExpression" || argument.argument.callee.type !== "MemberExpression" || !isPropertyAccessor(argument.argument.callee, accessor)) {
           return;
         }
         const callee = argument.argument.callee;
@@ -3479,17 +3715,19 @@ var compileMatcherPattern = (matcherMaybeWithMessage) => {
   const [matcher, message] = Array.isArray(matcherMaybeWithMessage) ? matcherMaybeWithMessage : [matcherMaybeWithMessage];
   return [new RegExp(matcher, "u"), message];
 };
-var compileMatcherPatterns = (matchers) => {
-  if (typeof matchers === "string" || Array.isArray(matchers)) {
-    const compiledMatcher = compileMatcherPattern(matchers);
+var compileMatcherPatterns = (matchers2) => {
+  if (typeof matchers2 === "string" || Array.isArray(matchers2)) {
+    const compiledMatcher = compileMatcherPattern(matchers2);
     return {
       describe: compiledMatcher,
+      step: compiledMatcher,
       test: compiledMatcher
     };
   }
   return {
-    describe: matchers.describe ? compileMatcherPattern(matchers.describe) : null,
-    test: matchers.test ? compileMatcherPattern(matchers.test) : null
+    describe: matchers2.describe ? compileMatcherPattern(matchers2.describe) : null,
+    step: matchers2.step ? compileMatcherPattern(matchers2.step) : null,
+    test: matchers2.test ? compileMatcherPattern(matchers2.test) : null
   };
 };
 var MatcherAndMessageSchema = {
@@ -3506,6 +3744,7 @@ var valid_title_default = createRule({
       disallowedWords = [],
       ignoreSpaces = false,
       ignoreTypeOfDescribeName = false,
+      ignoreTypeOfStepName = true,
       ignoreTypeOfTestName = false,
       mustMatch,
       mustNotMatch
@@ -3519,7 +3758,7 @@ var valid_title_default = createRule({
     return {
       CallExpression(node) {
         const call = parseFnCall(context, node);
-        if (call?.type !== "test" && call?.type !== "describe") {
+        if (call?.type !== "test" && call?.type !== "describe" && call?.type !== "step") {
           return;
         }
         const [argument] = node.arguments;
@@ -3529,7 +3768,7 @@ var valid_title_default = createRule({
           if (argument.type === "BinaryExpression" && doesBinaryExpressionContainStringNode(argument)) {
             return;
           }
-          if (!(call.type === "describe" && ignoreTypeOfDescribeName || call.type === "test" && ignoreTypeOfTestName) && argument.type !== "TemplateLiteral") {
+          if (!(call.type === "describe" && ignoreTypeOfDescribeName || call.type === "test" && ignoreTypeOfTestName || call.type === "step" && ignoreTypeOfStepName) && argument.type !== "TemplateLiteral") {
             context.report({
               loc: argument.loc,
               messageId: "titleMustBeString"
@@ -3643,7 +3882,7 @@ var valid_title_default = createRule({
                 additionalProperties: {
                   oneOf: [{ type: "string" }, MatcherAndMessageSchema]
                 },
-                propertyNames: { enum: ["describe", "test"] },
+                propertyNames: { enum: ["describe", "test", "step"] },
                 type: "object"
               }
             ]
@@ -3662,6 +3901,10 @@ var valid_title_default = createRule({
             default: false,
             type: "boolean"
           },
+          ignoreTypeOfStepName: {
+            default: true,
+            type: "boolean"
+          },
           ignoreTypeOfTestName: {
             default: false,
             type: "boolean"
@@ -3709,7 +3952,9 @@ var index = {
     "prefer-equality-matcher": prefer_equality_matcher_default,
     "prefer-hooks-in-order": prefer_hooks_in_order_default,
     "prefer-hooks-on-top": prefer_hooks_on_top_default,
+    "prefer-locator": prefer_locator_default,
     "prefer-lowercase-title": prefer_lowercase_title_default,
+    "prefer-native-locators": prefer_native_locators_default,
     "prefer-strict-equal": prefer_strict_equal_default,
     "prefer-to-be": prefer_to_be_default,
     "prefer-to-contain": prefer_to_contain_default,

package/dist/index.mjs

@@ -5,22 +5,30 @@ var __esm = (fn, res) => function __init() {
 var __commonJS = (cb, mod) => function __require() {
   return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
 };
+var __accessCheck = (obj, member, msg) => {
+  if (!member.has(obj))
+    throw TypeError("Cannot " + msg);
+};
+var __privateGet = (obj, member, getter) => {
+  __accessCheck(obj, member, "read from private field");
+  return getter ? getter.call(obj) : member.get(obj);
+};
+var __privateAdd = (obj, member, value) => {
+  if (member.has(obj))
+    throw TypeError("Cannot add the same private member more than once");
+  member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+};
+var __privateSet = (obj, member, value, setter) => {
+  __accessCheck(obj, member, "write to private field");
+  setter ? setter.call(obj, value) : member.set(obj, value);
+  return value;
+};
+var __privateMethod = (obj, member, method) => {
+  __accessCheck(obj, member, "access private method");
+  return method;
+};
 
 // src/utils/parseFnCall.ts
-function getNodeChain(node) {
-  if (isSupportedAccessor(node)) {
-    return [node];
-  }
-  switch (node.type) {
-    case "TaggedTemplateExpression":
-      return getNodeChain(node.tag);
-    case "MemberExpression":
-      return joinChains(getNodeChain(node.object), getNodeChain(node.property));
-    case "CallExpression":
-      return getNodeChain(node.callee);
-  }
-  return null;
-}
 function determinePlaywrightFnGroup(name) {
   if (name === "step")
     return "step";
@@ -38,19 +46,15 @@ function getExpectArguments(call) {
   return findParent(call.head.node, "CallExpression")?.arguments ?? [];
 }
 function parse(context, node) {
-  const chain = getNodeChain(node);
-  if (!chain?.length) {
+  const chain = new Chain(node);
+  if (!chain.nodes?.length)
     return null;
-  }
-  const [first, ...rest] = chain;
+  const [first, ...rest] = chain.nodes;
   const resolved = resolveToPlaywrightFn(context, first);
   if (!resolved)
     return null;
   let name = resolved.original ?? resolved.local;
   const links = [name, ...rest.map((link) => getStringValue(link))];
-  if (name !== "expect" && !VALID_CHAINS.has(links.join("."))) {
-    return null;
-  }
   if (name === "test" && links.length > 1) {
     const nextLinkName = links[1];
     const nextLinkGroup = determinePlaywrightFnGroup(nextLinkName);
@@ -58,6 +62,9 @@ function parse(context, node) {
       name = nextLinkName;
     }
   }
+  if (name !== "expect" && !VALID_CHAINS.has(links.join("."))) {
+    return null;
+  }
   const parsedFnCall = {
     head: { ...resolved, node: first },
     // every member node must have a member expression as their parent
@@ -67,7 +74,14 @@ function parse(context, node) {
   };
   const group = determinePlaywrightFnGroup(name);
   if (group === "expect") {
-    const result = parseExpectCall(parsedFnCall);
+    let stage = chain.isLeaf(parsedFnCall.head.node) ? "matchers" : "modifiers";
+    if (isIdentifier(rest[0], "expect")) {
+      stage = chain.isLeaf(rest[0]) ? "matchers" : "modifiers";
+      parsedFnCall.members.shift();
+    }
+    const result = parseExpectCall(chain, parsedFnCall, stage);
+    if (!result)
+      return null;
     if (typeof result === "string" && findTopMostCallExpression(node) !== node) {
       return null;
     }
@@ -78,7 +92,7 @@ function parse(context, node) {
     }
     return result;
   }
-  if (chain.slice(0, chain.length - 1).some((n) => getParent(n)?.type !== "MemberExpression")) {
+  if (chain.nodes.slice(0, chain.nodes.length - 1).some((n) => getParent(n)?.type !== "MemberExpression")) {
     return null;
   }
   const parent = getParent(node);
@@ -107,7 +121,7 @@ function parseFnCall(context, node) {
   const call = parseFnCallWithReason(context, node);
   return typeof call === "string" ? null : call;
 }
-var testHooks, VALID_CHAINS, joinChains, isSupportedAccessor, resolvePossibleAliasedGlobal, resolveToPlaywrightFn, modifiers, findModifiersAndMatcher, parseExpectCall, findTopMostCallExpression, cache, isTypeOfFnCall;
+var testHooks, VALID_CHAINS, joinChains, isSupportedAccessor, _nodes, _leaves, _buildChain, buildChain_fn, Chain, resolvePossibleAliasedGlobal, resolveToPlaywrightFn, modifiers, findModifiersAndMatcher, parseExpectCall, findTopMostCallExpression, cache, isTypeOfFnCall;
 var init_parseFnCall = __esm({
   "src/utils/parseFnCall.ts"() {
     "use strict";
@@ -168,6 +182,44 @@ var init_parseFnCall = __esm({
     ]);
     joinChains = (a, b) => a && b ? [...a, ...b] : null;
     isSupportedAccessor = (node, value) => isIdentifier(node, value) || isStringNode(node, value);
+    Chain = class {
+      constructor(node) {
+        __privateAdd(this, _buildChain);
+        __privateAdd(this, _nodes, null);
+        __privateAdd(this, _leaves, /* @__PURE__ */ new WeakSet());
+        __privateSet(this, _nodes, __privateMethod(this, _buildChain, buildChain_fn).call(this, node));
+      }
+      isLeaf(node) {
+        return __privateGet(this, _leaves).has(node);
+      }
+      get nodes() {
+        return __privateGet(this, _nodes);
+      }
+    };
+    _nodes = new WeakMap();
+    _leaves = new WeakMap();
+    _buildChain = new WeakSet();
+    buildChain_fn = function(node, insideCall = false) {
+      if (isSupportedAccessor(node)) {
+        if (insideCall) {
+          __privateGet(this, _leaves).add(node);
+        }
+        return [node];
+      }
+      switch (node.type) {
+        case "TaggedTemplateExpression":
+          return __privateMethod(this, _buildChain, buildChain_fn).call(this, node.tag);
+        case "MemberExpression":
+          return joinChains(
+            __privateMethod(this, _buildChain, buildChain_fn).call(this, node.object),
+            __privateMethod(this, _buildChain, buildChain_fn).call(this, node.property, insideCall)
+          );
+        case "CallExpression":
+          return __privateMethod(this, _buildChain, buildChain_fn).call(this, node.callee, true);
+        default:
+          return null;
+      }
+    };
     resolvePossibleAliasedGlobal = (context, global) => {
       const globalAliases = context.settings.playwright?.globalAliases ?? {};
       const alias = Object.entries(globalAliases).find(
@@ -185,7 +237,7 @@ var init_parseFnCall = __esm({
       };
     };
     modifiers = /* @__PURE__ */ new Set(["not", "resolves", "rejects"]);
-    findModifiersAndMatcher = (members) => {
+    findModifiersAndMatcher = (chain, members, stage) => {
       const modifiers2 = [];
       for (const member of members) {
         const name = getStringValue(member);
@@ -199,6 +251,9 @@ var init_parseFnCall = __esm({
             return "modifier-unknown";
           }
         } else if (name !== "not") {
+          if (stage === "modifiers") {
+            return null;
+          }
           if (member.parent?.type === "MemberExpression" && member.parent.parent?.type === "CallExpression") {
             return {
               matcher: member,
@@ -209,12 +264,22 @@ var init_parseFnCall = __esm({
           }
           return "modifier-unknown";
         }
+        if (chain.isLeaf(member)) {
+          stage = "matchers";
+        }
         modifiers2.push(member);
       }
       return "matcher-not-found";
     };
-    parseExpectCall = (call) => {
-      const modifiersAndMatcher = findModifiersAndMatcher(call.members);
+    parseExpectCall = (chain, call, stage) => {
+      const modifiersAndMatcher = findModifiersAndMatcher(
+        chain,
+        call.members,
+        stage
+      );
+      if (!modifiersAndMatcher) {
+        return null;
+      }
       if (typeof modifiersAndMatcher === "string") {
         return modifiersAndMatcher;
       }
@@ -263,7 +328,7 @@ function getRawValue(node) {
   return node.type === "Literal" ? node.raw : void 0;
 }
 function isIdentifier(node, name) {
-  return node.type === "Identifier" && (!name || (typeof name === "string" ? node.name === name : name.test(node.name)));
+  return node?.type === "Identifier" && (!name || (typeof name === "string" ? node.name === name : name.test(node.name)));
 }
 function isLiteral(node, type, value) {
   return node.type === "Literal" && (value === void 0 ? typeof node.value === type : node.value === value);
@@ -278,7 +343,8 @@ function isStringNode(node, value) {
   return node && (isStringLiteral(node, value) || isTemplateLiteral(node, value));
 }
 function isPropertyAccessor(node, name) {
-  return getStringValue(node.property) === name;
+  const value = getStringValue(node.property);
+  return typeof name === "string" ? value === name : name.test(value);
 }
 function getParent(node) {
   return node.parent;
@@ -2516,6 +2582,74 @@ var init_prefer_hooks_on_top = __esm({
   }
 });
 
+// src/rules/prefer-locator.ts
+function isSupportedMethod2(node) {
+  if (node.callee.type !== "MemberExpression")
+    return false;
+  const name = getStringValue(node.callee.property);
+  return pageMethods2.has(name) && isPageMethod(node, name);
+}
+var pageMethods2, prefer_locator_default;
+var init_prefer_locator = __esm({
+  "src/rules/prefer-locator.ts"() {
+    "use strict";
+    init_ast();
+    init_createRule();
+    pageMethods2 = /* @__PURE__ */ new Set([
+      "click",
+      "dblclick",
+      "dispatchEvent",
+      "fill",
+      "focus",
+      "getAttribute",
+      "hover",
+      "innerHTML",
+      "innerText",
+      "inputValue",
+      "isChecked",
+      "isDisabled",
+      "isEditable",
+      "isEnabled",
+      "isHidden",
+      "isVisible",
+      "press",
+      "selectOption",
+      "setChecked",
+      "setInputFiles",
+      "tap",
+      "textContent",
+      "uncheck"
+    ]);
+    prefer_locator_default = createRule({
+      create(context) {
+        return {
+          CallExpression(node) {
+            if (!isSupportedMethod2(node))
+              return;
+            context.report({
+              messageId: "preferLocator",
+              node
+            });
+          }
+        };
+      },
+      meta: {
+        docs: {
+          category: "Best Practices",
+          description: "Suggest locators over page methods",
+          recommended: false,
+          url: "https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/prefer-locator.md"
+        },
+        messages: {
+          preferLocator: "Prefer locator methods instead of page methods"
+        },
+        schema: [],
+        type: "suggestion"
+      }
+    });
+  }
+});
+
 // src/rules/prefer-lowercase-title.ts
 var prefer_lowercase_title_default;
 var init_prefer_lowercase_title = __esm({
@@ -2620,6 +2754,121 @@ var init_prefer_lowercase_title = __esm({
   }
 });
 
+// src/rules/prefer-native-locators.ts
+var compilePatterns, prefer_native_locators_default;
+var init_prefer_native_locators = __esm({
+  "src/rules/prefer-native-locators.ts"() {
+    "use strict";
+    init_ast();
+    init_createRule();
+    compilePatterns = ({
+      testIdAttribute
+    }) => {
+      const patterns = [
+        {
+          attribute: "aria-label",
+          messageId: "unexpectedLabelQuery",
+          replacement: "getByLabel"
+        },
+        {
+          attribute: "role",
+          messageId: "unexpectedRoleQuery",
+          replacement: "getByRole"
+        },
+        {
+          attribute: "placeholder",
+          messageId: "unexpectedPlaceholderQuery",
+          replacement: "getByPlaceholder"
+        },
+        {
+          attribute: "alt",
+          messageId: "unexpectedAltTextQuery",
+          replacement: "getByAltText"
+        },
+        {
+          attribute: "title",
+          messageId: "unexpectedTitleQuery",
+          replacement: "getByTitle"
+        },
+        {
+          attribute: testIdAttribute,
+          messageId: "unexpectedTestIdQuery",
+          replacement: "getByTestId"
+        }
+      ];
+      return patterns.map(({ attribute, ...pattern }) => ({
+        ...pattern,
+        pattern: new RegExp(`^\\[${attribute}=['"]?(.+?)['"]?\\]$`)
+      }));
+    };
+    prefer_native_locators_default = createRule({
+      create(context) {
+        const { testIdAttribute } = {
+          testIdAttribute: "data-testid",
+          ...context.options?.[0] ?? {}
+        };
+        const patterns = compilePatterns({ testIdAttribute });
+        return {
+          CallExpression(node) {
+            if (node.callee.type !== "MemberExpression")
+              return;
+            const query = getStringValue(node.arguments[0]);
+            if (!isPageMethod(node, "locator"))
+              return;
+            for (const pattern of patterns) {
+              const match = query.match(pattern.pattern);
+              if (match) {
+                context.report({
+                  fix(fixer) {
+                    const start = node.callee.type === "MemberExpression" ? node.callee.property.range[0] : node.range[0];
+                    const end = node.range[1];
+                    const rangeToReplace = [start, end];
+                    const newText = `${pattern.replacement}("${match[1]}")`;
+                    return fixer.replaceTextRange(rangeToReplace, newText);
+                  },
+                  messageId: pattern.messageId,
+                  node
+                });
+                return;
+              }
+            }
+          }
+        };
+      },
+      meta: {
+        docs: {
+          category: "Best Practices",
+          description: "Prefer native locator functions",
+          recommended: false,
+          url: "https://github.com/playwright-community/eslint-plugin-playwright/tree/main/docs/rules/prefer-native-locators.md"
+        },
+        fixable: "code",
+        messages: {
+          unexpectedAltTextQuery: "Use getByAltText() instead",
+          unexpectedLabelQuery: "Use getByLabel() instead",
+          unexpectedPlaceholderQuery: "Use getByPlaceholder() instead",
+          unexpectedRoleQuery: "Use getByRole() instead",
+          unexpectedTestIdQuery: "Use getByTestId() instead",
+          unexpectedTitleQuery: "Use getByTitle() instead"
+        },
+        schema: [
+          {
+            additionalProperties: false,
+            properties: {
+              testIdAttribute: {
+                default: "data-testid",
+                type: "string"
+              }
+            },
+            type: "object"
+          }
+        ],
+        type: "suggestion"
+      }
+    });
+  }
+});
+
 // src/rules/prefer-strict-equal.ts
 var prefer_strict_equal_default;
 var init_prefer_strict_equal = __esm({
@@ -2857,7 +3106,7 @@ var init_prefer_to_contain = __esm({
 });
 
 // src/rules/prefer-to-have-count.ts
-var prefer_to_have_count_default;
+var matchers, prefer_to_have_count_default;
 var init_prefer_to_have_count = __esm({
   "src/rules/prefer-to-have-count.ts"() {
     "use strict";
@@ -2865,16 +3114,18 @@ var init_prefer_to_have_count = __esm({
     init_createRule();
     init_fixer();
     init_parseFnCall();
+    matchers = /* @__PURE__ */ new Set([...equalityMatchers, "toHaveLength"]);
     prefer_to_have_count_default = createRule({
       create(context) {
         return {
           CallExpression(node) {
             const call = parseFnCall(context, node);
-            if (call?.type !== "expect" || !equalityMatchers.has(call.matcherName)) {
+            if (call?.type !== "expect" || !matchers.has(call.matcherName)) {
               return;
             }
+            const accessor = call.matcherName === "toHaveLength" ? "all" : "count";
             const argument = dereference(context, call.args[0]);
-            if (argument?.type !== "AwaitExpression" || argument.argument.type !== "CallExpression" || argument.argument.callee.type !== "MemberExpression" || !isPropertyAccessor(argument.argument.callee, "count")) {
+            if (argument?.type !== "AwaitExpression" || argument.argument.type !== "CallExpression" || argument.argument.callee.type !== "MemberExpression" || !isPropertyAccessor(argument.argument.callee, accessor)) {
               return;
             }
             const callee = argument.argument.callee;
@@ -3892,17 +4143,19 @@ var init_valid_title = __esm({
       const [matcher, message] = Array.isArray(matcherMaybeWithMessage) ? matcherMaybeWithMessage : [matcherMaybeWithMessage];
       return [new RegExp(matcher, "u"), message];
     };
-    compileMatcherPatterns = (matchers) => {
-      if (typeof matchers === "string" || Array.isArray(matchers)) {
-        const compiledMatcher = compileMatcherPattern(matchers);
+    compileMatcherPatterns = (matchers2) => {
+      if (typeof matchers2 === "string" || Array.isArray(matchers2)) {
+        const compiledMatcher = compileMatcherPattern(matchers2);
         return {
           describe: compiledMatcher,
+          step: compiledMatcher,
           test: compiledMatcher
         };
       }
       return {
-        describe: matchers.describe ? compileMatcherPattern(matchers.describe) : null,
-        test: matchers.test ? compileMatcherPattern(matchers.test) : null
+        describe: matchers2.describe ? compileMatcherPattern(matchers2.describe) : null,
+        step: matchers2.step ? compileMatcherPattern(matchers2.step) : null,
+        test: matchers2.test ? compileMatcherPattern(matchers2.test) : null
       };
     };
     MatcherAndMessageSchema = {
@@ -3919,6 +4172,7 @@ var init_valid_title = __esm({
           disallowedWords = [],
           ignoreSpaces = false,
           ignoreTypeOfDescribeName = false,
+          ignoreTypeOfStepName = true,
           ignoreTypeOfTestName = false,
           mustMatch,
           mustNotMatch
@@ -3932,7 +4186,7 @@ var init_valid_title = __esm({
         return {
           CallExpression(node) {
             const call = parseFnCall(context, node);
-            if (call?.type !== "test" && call?.type !== "describe") {
+            if (call?.type !== "test" && call?.type !== "describe" && call?.type !== "step") {
               return;
             }
             const [argument] = node.arguments;
@@ -3942,7 +4196,7 @@ var init_valid_title = __esm({
               if (argument.type === "BinaryExpression" && doesBinaryExpressionContainStringNode(argument)) {
                 return;
               }
-              if (!(call.type === "describe" && ignoreTypeOfDescribeName || call.type === "test" && ignoreTypeOfTestName) && argument.type !== "TemplateLiteral") {
+              if (!(call.type === "describe" && ignoreTypeOfDescribeName || call.type === "test" && ignoreTypeOfTestName || call.type === "step" && ignoreTypeOfStepName) && argument.type !== "TemplateLiteral") {
                 context.report({
                   loc: argument.loc,
                   messageId: "titleMustBeString"
@@ -4056,7 +4310,7 @@ var init_valid_title = __esm({
                     additionalProperties: {
                       oneOf: [{ type: "string" }, MatcherAndMessageSchema]
                     },
-                    propertyNames: { enum: ["describe", "test"] },
+                    propertyNames: { enum: ["describe", "test", "step"] },
                     type: "object"
                   }
                 ]
@@ -4075,6 +4329,10 @@ var init_valid_title = __esm({
                 default: false,
                 type: "boolean"
               },
+              ignoreTypeOfStepName: {
+                default: true,
+                type: "boolean"
+              },
               ignoreTypeOfTestName: {
                 default: false,
                 type: "boolean"
@@ -4124,7 +4382,9 @@ var require_src = __commonJS({
     init_prefer_equality_matcher();
     init_prefer_hooks_in_order();
     init_prefer_hooks_on_top();
+    init_prefer_locator();
     init_prefer_lowercase_title();
+    init_prefer_native_locators();
     init_prefer_strict_equal();
     init_prefer_to_be();
     init_prefer_to_contain();
@@ -4173,7 +4433,9 @@ var require_src = __commonJS({
         "prefer-equality-matcher": prefer_equality_matcher_default,
         "prefer-hooks-in-order": prefer_hooks_in_order_default,
         "prefer-hooks-on-top": prefer_hooks_on_top_default,
+        "prefer-locator": prefer_locator_default,
         "prefer-lowercase-title": prefer_lowercase_title_default,
+        "prefer-native-locators": prefer_native_locators_default,
         "prefer-strict-equal": prefer_strict_equal_default,
         "prefer-to-be": prefer_to_be_default,
         "prefer-to-contain": prefer_to_contain_default,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "eslint-plugin-playwright",
   "description": "ESLint plugin for Playwright testing.",
-  "version": "1.6.2",
+  "version": "1.7.0",
   "repository": "https://github.com/playwright-community/eslint-plugin-playwright",
   "author": "Mark Skelton <mark@mskelton.dev>",
   "packageManager": "pnpm@8.12.0",
@@ -30,7 +30,7 @@
     "dist"
   ],
   "scripts": {
-    "build": "tsup src/index.ts --format cjs,esm --dts --out-dir dist",
+    "build": "tsup src/index.ts --format cjs,esm --dts --out-dir dist --cjsInterop",
     "lint": "eslint .",
     "fmt": "prettier --write .",
     "fmt:check": "prettier --check .",