search

cypress-io / cypress

Fast, easy and reliable testing for anything that runs in a browser.
https://cypress.io
MIT License
47.02k stars 3.18k forks source link

cy.contains throws syntax error if searched text ends with backslash #14772

Closed JonahKK closed 3 years ago

JonahKK commented 3 years ago

Current behavior

If searched text has backslash (\) at the end, the cy.contains command ends with

Syntax error, unrecognized expression: :not(script,style):cy-contains('testValue'), [type='submit'][value~='testValue']

image

Desired behavior

cy.contains should search for a text with the backslash at the end.

Test code to reproduce

describe('page', () => {
  it('fails', () => {
    cy.contains('testValue\\').should('not.exist');
  })
})

Versions

Tested on newest 6.3.0.

jennifer-shehane commented 3 years ago

Cypress uses a modified jQuery selector, so you'd have to do what you would do in jQuery to find backslashes in selectors, which apparently means that you need to write four backslashes for every backslash you want to find in the app.

So:

  1. original content: testValue\
  2. escape backslash for jQuery selector testValue\\
  3. escape each backslash for JS string 'testValue\\\\'

index.html

<html>
<body>
  <button>testValue\</button>
</body>
</html>

spec.js

it('fails', () => {
  cy.visit('index.html')
  cy.contains('testValue\\\\')
})
Screen Shot 2021-01-28 at 1 52 54 PM