playwright-xpath
a playwright custom selector engine for xpath 3.1 using fontoxpath
installation
npm install playwright-xpathusage
import { selectors } from 'playwright'
import xpath3 from 'playwright-xpath'
selectors.register('xpath3', xpath3)
;(async () => {
await page.setContent('<button>Click me</button>')
// (the starts-with function is only available in xpath 2 and above)
await page.click("xpath3=//button[starts-with(., 'Click')]")
})()features
xpath 3.1
currently, all browsers (and playwright) only support xpath 1.0. however there are many useful features that were added in xpath 2 and above which are now supported thanks to fontoxpath
svg support
due to how xml namespaces work, svg elements do not work when using xpath on html. to work around this, the playwright-xpath selector engine allows you to specify the svg prefix:
await page.setContent('<svg><text>asdf</text></svg>')
await page.waitForSelector('xpath=//svg/text') // doesn't work
await page.waitForSelector('xpath3=//svg/text') // doesn't work
await page.waitForSelector('xpath=//svg:svg/svg:text') // doesn't work
await page.waitForSelector('xpath3=//svg:svg/svg:text') // worksfor more information, see this thread