Click(a:contains) not working?

Testing
1

In reference to my previous post, [SOLVED] Cannot run acceptance tests 'click' helper not defined - #3 by stuartluscombe, I cannot get the click helper to work as:

a:contains("Contact")' is not a valid selector

I’ve carried out some searches on this and while :contains seems to be a valid jQuery selector I cannot get it to work.

Given I’m using ember 3.0 is there something else I should be using here?

I’ve looked through the documentation but the click method that was listed under Ember.Test for 2.15 (which is linked to from the Tutorial docs) has been deprecated?

My test:

  test('should link to information about the company.', async function (assert) {
    await visit('/');
    await click('a:contains("About")');
    assert.equal(currentURL(), '/about', 'should navigate to about');
  });
2

The new testing API’s are designed to be smallish wrappers over “plain DOM”.

If you definitely want to use contains, you have to explicitly use jQuery and pass the first element into click:

  test('should link to information about the company.', async function (assert) {
    await visit('/');
    await click($('a:contains("About")')[0]);
    assert.equal(currentURL(), '/about', 'should navigate to about');
  });
3

Thanks for the response.

Is there a cleaner way to achieve the same result?

Using that method is causing an ESLint message of “Do not use global ‘$’ or ‘jQuery’”

1 Like
4

:contains is not a real CSS selector. jQuery provides it.