Add support for "focus" assertion (to work effectively as Chai jQuery assertion does)

[jennifer-shehane]

Chai jQuery added a focus assertion recently.

Cypress needs support for focus assertions so I can assert whether a DOM element has or does not have focus.

Example

cy
  .get('input')
    .type('Foo').should('have.focus')
    .blur().should('not.have.focus')

[anniekvandijk]

Hi, I need a test for checking focus too and I think this could be a nice workaround?

Instead of checking if the element you select is focussed, you get the focussed element and check if the properties/attributes or whatever are conform expectations. In my case, I needed a focus on the field with a name

cy.focused().should('have.attr', 'name', fieldName);

[kuceb]

Hi, after this PR #3219 , you will be able to do the following assertions:

cy.get('div').should('have.focus')
cy.get('div').should('not.have.focus')
cy.get('div').should('be.focused')
cy.get('div').should('not.be.focused')

expect(div).to.have.focus
expect(div).to.not.have.focus
expect(div).to.be.focused
expect(div).to.not.be.focused

[brian-mann]

Fixed by #3219

[jennifer-shehane]

The code for this is done in #3219, but this has yet to be released. We'll update this issue and reference the changelog when it's released.

[cypress-bot]

Released in 3.3.0.

[denkristoffer]

I'm getting "CypressError: The chainer: 'focus' was not found. Could not build assertion." with Cypress 3.3.0 when I do cy.get('search_input').should('have.focus'). Am I using it wrong or should I create a new issue?

[wojciech-sygier]

I'm getting "CypressError: The chainer: 'focus' was not found. Could not build assertion." with Cypress 3.3.0 when I do cy.get('search_input').should('have.focus'). Am I using it wrong or should I create a new issue?

I second that. Whether I use have.focus or be.focused I always get the error. It looks as if it wasn't even present in this version.

[kuceb]

I'm getting "CypressError: The chainer: 'focus' was not found. Could not build assertion." with Cypress 3.3.0 when I do cy.get('search_input').should('have.focus'). Am I using it wrong or should I create a new issue?

Currently looking into this

Edit: looks like it never made it into the develop branch https://github.com/cypress-io/cypress/compare/v3.3.0

We'll have this fixed soon

[cypress-bot]

The code for this is done in cypress-io/cypress#4274, but has yet to be released.
We'll update this issue and reference the changelog when it's released.

[cypress-bot]

Released in 3.3.1.

[alirezamirian]

Would be nice to have another assertion to check if the element is either focus, or contains focused element.
Currently contains.focus or have.focus both check if the element has focus. the former can become broader.