Assertions autocompletion / TypeScript definitions for cy and Cypress

[pawelgalazka]

• Cypress Version: 1.0.3

Is this a Feature or Bug?

Feature

Current behavior:

If I want to use should assert, very often I need to look up the documentation https://docs.cypress.io/guides/references/assertions.html to check what's the assert is, what's the string should be. Which consumes additional time when writing asserts. Also some asserts doesn't seems to be clear, like checking text content against regexp.

It's hard to get autocompletion and arguments suggestion from the editor if assert is a string.

Desired behavior:

Would be great to have assert constructs which would help editors/IDE's with autocompletion, especially if TypeScript type definitions could be used.

Current work around which I'm wondering to use for our team, which is not ideal but it works could be:

const be = {
  visible: ['be.visible']
}

const do = {
  have: {
     attr: () => (name, value) => ['have.attr', name, value]
  }
}

cy
  .get('.someElement')
  .should(...be.visible)
  .and(...do.have.attr('content', 'abc'))

Editor will do autocompletion in that case, which speeds up the process of writing asserts. Would be great to have some solution to it, built-in Cypress, but it would probably require different approach how asserts are made.

Just a proposition. So far, writing asserts is the biggest pain point in Cypress in our team as it too often requires docs look up.

[bahmutov]

We should bring @types/cypress (and update them) to ship with Cypress NPM module.

https://www.npmjs.com/package/@types/cypress

[pawelgalazka]

@bahmutov @types/cypress is not everything, even after bringing it it still won't be possible to suggest options for asserts which are written as a string.

[bahmutov]

Agree with you @pawelgalazka - it is just Cypress API, not the assertions, but it is a start.

[brian-mann]

Released in 1.1.3.

[brian-mann]

@pawelgalazka this is what you are asking for here: https://github.com/cypress-io/cypress/pull/1059

I'm going to reopen this issue because what you were asking for was not released in 1.1.3 - but it will be released soon!

[pawelgalazka]

@brian-mann This is great! Great job guys!

[NicholasBoll]

1059 has many happy-path autocompletes. I'm also adding some documentation to each chainer override with a short description, example and links to the appropriate chai, sinon-chai or chai-jquery docs. I'll open another PR for that added functionality later.

[brian-mann]

Fixed by https://github.com/cypress-io/cypress/pull/1059.

[Karolis92]

@brian-mann our project is really looking into using Cypress for e2e, but we use Intellij (should be similar to WebStorm) and it doesn't seem to autocomplete with method overrides. Maybe I'm doing something wrong?

I found that creating objects like theses work for autocomplete:

const be = {
  visible: 'be.visible',
  false:   'be.false'
};