Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support XPath based selectors #1178

georgiy-abbasov opened this issue Jan 26, 2017 · 18 comments

Support XPath based selectors #1178

georgiy-abbasov opened this issue Jan 26, 2017 · 18 comments


Copy link

@georgiy-abbasov georgiy-abbasov commented Jan 26, 2017

Are you requesting a feature or reporting a bug?


What is the current behavior?

TestCafe admits CSS and ClientFunction based selectors. It would be nice, if XPath selectors were supported too.

What is the expected behavior?

something like

let submitBtn    = Selector('//form/input[text()="Submit"]')
let submitForm   = Selector('//input[text()="Submit"]/../')
Copy link

@Jeroenhuisjes Jeroenhuisjes commented Feb 6, 2017

Would save a lot of time with making tests at the company I work for!

Copy link

@mkubrycz mkubrycz commented May 15, 2017

But you can do exactly the same thing using TestCafe API:

let submitBtn = Selector('form input').withText('Submit')
let submitForm = Selector(input).withText('Submit').parent()

IMHO it reads better than clumsy XPath

Copy link

@Uninen Uninen commented Jul 21, 2017


This would help a lot with porting old e2e tests to testcafe.

Copy link

@lnfnunes lnfnunes commented Nov 28, 2017

@mkubrycz regardless of better or not, it's a common option from other e2e test runners and will help to port old test-cases to testcafe.
Besides that, it will be an extra option to be used for anyone interested on it!

Copy link

@AlexanderMoskovkin AlexanderMoskovkin commented Dec 8, 2017

Although TestCafe doesn't support XPath based selectors out-of-the-box now you can use them in your tests. Take a look at my example:

// xpath-selector.js
import { Selector } from 'testcafe';

const elementByXPath = Selector(xpath => {
    const iterator = document.evaluate(xpath, document, null, XPathResult.UNORDERED_NODE_ITERATOR_TYPE, null )
    const items = [];

    let item = iterator.iterateNext();

    while (item) {
        item = iterator.iterateNext();

    return items;

export default function (xpath) {
    return Selector(elementByXPath(xpath));
// test.js
import XPathSelector from './xpath-selector';

fixture `Use XPath`
    .page ``;

test('Check header links count', async t => {
    const headerLinkXPath = '/html/body/div[1]/header/div/div[2]/nav/ul/li/a';
    const headerLink =      XPathSelector(headerLinkXPath);
    await t
Copy link

@neilmatillano neilmatillano commented Jan 15, 2018

@AlexanderMoskovkin : I want to reuse this function inside my testcafe tests, but it seems like we always need to have it specify the exact path from "/html/...", I am updating the function now as we speak, but if you already have created the updated version of this function, it would be great ;)

XPath formats like this is a bit hard to distinguish...

Copy link

@AlexanderMoskovkin AlexanderMoskovkin commented Jan 17, 2018

Hi @neilmatillano,

I haven't worked on this yet, so it would be nice if you add you improved version of this function.

Copy link

@neilmatillano neilmatillano commented Feb 28, 2018

@xcb6 : Sounds good, do you have more examples of the usage? One that is working well
I get this error in testcafe even just calling console.log

TypeError: xpath_to_css_1.default is not a function

Copy link

@xcb6 xcb6 commented Mar 1, 2018

work well for me

import { Selector } from 'testcafe'
import xPathToCss from 'xpath-to-css'
const xPath = '//div[@id="foo"][2]/span[@class="bar"]//a[contains(@class, "baz")]//img[1]'
const css = xPathToCss(xPath)
Copy link

@neilmatillano neilmatillano commented Mar 1, 2018

@xcb6 : Maybe it's my version of testcafe. I am using this version : 0.18.7-dev20180206
Which version are you using?

Copy link

@neilmatillano neilmatillano commented Mar 1, 2018

@xcb6 : Found the issue, i am using typescript ... so I should follow the es6 format of importing which is import * as xPathToCss from 'xpath-to-css'

Copy link

@Andrei1982 Andrei1982 commented Mar 10, 2018

When I use xpath-to-css recive this issue: "

Invalid or unsupported XPath: .//a[text()="Регистрация"]

Probably, this library isn't work with cyrillic. If transform this locator on this:


That is all right.
Is it possible to add support of cyrillic for this package?

Copy link

@AlexanderMoskovkin AlexanderMoskovkin commented Apr 19, 2018

I'm closing this since it can be done with third-party modules (like xpath-to-css). So, we are not going to implement this in the near future.

Copy link

@lock lock bot commented Mar 27, 2019

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs or feature requests. For TestCafe API, usage and configuration inquiries, we recommend asking them on StackOverflow.

@lock lock bot locked as resolved and limited conversation to collaborators Mar 27, 2019
@miherlosev miherlosev reopened this Apr 11, 2019
Copy link

@miherlosev miherlosev commented Apr 11, 2019

I believe it make sense to have build-in XPath support in TestCafe.
One more question -

@AndreyBelym AndreyBelym added this to Test API Suggestions in Enhancements processing Jul 15, 2019
Copy link

@miherlosev miherlosev commented Dec 5, 2019

Copy link

@wentwrong wentwrong commented Jun 26, 2020

Here's one more case. Probably, it should be implemented along with this.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Enhancements processing
Test API Suggestions
Linked pull requests

Successfully merging a pull request may close this issue.

None yet