CSS vs XPath Locators — When To Use Which

Default to CSS selectors. They're shorter, faster, and easier to read.

button.primary[type="submit"]

Use XPath when you need:

• Text content matching: //button[normalize-space()='Save']
• Traversing upward to a parent: //input[@id='email']/ancestor::form
• Sibling-based selection that's awkward in CSS.

Never use: absolute XPaths copied from DevTools. They break on the next UI tweak.