# Connectors

Examples of connecting commands in Cypress, for a full reference of commands, go to docs.cypress.io

#### .each()

To iterate over the elements of a current subject, use the `.each()` command.

    cy.get('.connectors-each-ul>li')
      .each(function($el, index, $list){
        console.log($el, index, $list)
      })

- Lara Williams
- William Grey
- Monica Pharrel

#### .its()

To get the properties on the current subject, use the `.its()` command.

    cy.get('.connectors-its-ul>li')
      // calls the 'length' property returning that value
      .its('length')
      .should('be.gt', 2)

- Chai
- Chai-jQuery
- Chai-Sinon

#### .invoke()

To invoke a function on a current subject, use the `.invoke()` command.

    cy.get('.connectors-div').should('be.hidden')
      // call the jquery method 'show' on the 'div.container'
      .invoke('show')
      .should('be.visible')

This is a div

#### .spread()

To spread an array as individual arguments to a callback function, use the `.spread()` command.

    const arr = ['foo', 'bar', 'baz']

    cy.wrap(arr).spread(function(foo, bar, baz){
      expect(foo).to.eq('foo')
      expect(bar).to.eq('bar')
      expect(baz).to.eq('baz')
    })

#### .then()

To invoke a callback function with the current subject, use the `.then()` command.

    cy.get('.connectors-list>li').then(function($lis){
      expect($lis).to.have.length(3)
      expect($lis.eq(0)).to.contain('Walk the dog')
      expect($lis.eq(1)).to.contain('Feed the cat')
      expect($lis.eq(2)).to.contain('Write JavaScript')
    })

If the callback function returns a value, it is yielded to the next callback, just like in a Promise callback.

    cy.wrap(1)
      .then((num) => {
        expect(num).to.equal(1)

        return 2
      })
      .then((num) => {
        expect(num).to.equal(2)
      })

But unlike a Promise, if `undefined` is returned, then the original value passed into the `.then(cb)` is yielded to the next callback.

    cy.wrap(1)
      .then((num) => {
        expect(num).to.equal(1)
        // note that nothing is returned from this callback
      })
      .then((num) => {
        // this callback receives the original unchanged value 1
        expect(num).to.equal(1)
      })

If there are Cypress commands in the `.then(cb)` callback, then the value yielded by the last command will be passed to the next callback.

    cy.wrap(1)
      .then((num) => {
        expect(num).to.equal(1)
        // note how we run a Cypress command
        // the result yielded by this Cypress command
        // will be passed to the second ".then"
        cy.wrap(2)
      })
      .then((num) => {
        // this callback receives the value yielded by "cy.wrap(2)"
        expect(num).to.equal(2)
      })

- Walk the dog
- Feed the cat
- Write JavaScript