Skip to content

Latest commit

 

History

History
 
 

extending-cypress__chai-assertions

Folders and files

NameName
Last commit message
Last commit date

parent directory

..
 
 
 
 
 
 
 
 
 
 

Adding Chai Assertions

Code completion

Even if you write your specs in JavaScript, you can have Intelligent Code Completion for custom assertions.

  1. Add a .d.ts file with type definition and good JSDoc comment, for example here is cypress/support/index.d.ts.
// cypress/support/index.d.ts file
// extends Cypress assertion Chainer interface with
// the new assertion methods

/// <reference types="cypress" />

declare namespace Cypress {
  interface Chainer<Subject> {
    /**
     * Custom Chai assertion that checks if given subject is string "foo"
     *
     * @example
     ```
    expect('foo').to.be.foo()
    cy.wrap('foo').should('be.foo')
    ```
    * */
    (chainer: 'be.foo'): Chainable<Subject>

    /**
     * Custom Chai assertion that checks if given subject is NOT string "foo"
     *
     * @example
     ```
    expect('bar').to.not.be.foo()
    cy.wrap('bar').should('not.be.foo')
    ```
    * */
   (chainer: 'not.be.foo'): Chainable<Subject>
  }
}
  1. In the spec file add special comment reference path pointing at the .d.ts file to load it.
/// <reference types="Cypress" />
/// <reference path="../support/index.d.ts" />

In a modern code editor like VSCode you should see IntelliSense pop up when hovering over the new assertion method.

Custom assertion code completion

Related: IntelliSense for custom Cypress commands