Invoke a function on the previously yielded subject.
If you want to get a property that is not a function on the previously yielded subject, use
.its().
Syntax
.invoke(functionName) .invoke(functionName, args...)
Usage
Correct Usage
cy.wrap({ animate: fn }).invoke('animate') // Invoke the 'animate' function
cy.get('.modal').invoke('show') // Invoke the jQuery 'show' function
Incorrect Usage
cy.invoke('convert') // Errors, cannot be chained off 'cy'
cy.wrap({ name: 'Jane' }).invoke('name') // Errors, 'name' is not a function
Arguments
functionName (String)
Name of function to be invoked.
args…
Additional arguments to be given to the function call. There is no limit to the number of arguments.
Examples
Function
Assert on a function’s return value
const fn = () => {
return 'bar'
}
cy.wrap({ foo: fn }).invoke('foo').should('eq', 'bar') // true
Use .invoke() to test HTML content
Properties that are functions are invoked
In the example below, we use .invoke() to force a hidden div to be 'display: block' so we can interact with its children elements.
cy.get('div.container').should('be.hidden') // true
.invoke('show') // call jquery method 'show' on the '.container'
.should('be.visible') // true
.find('input').type('Cypress is great')
Use .invoke('show') and .invoke('trigger')
Function with Arguments
Send specific arguments to the function
const fn = (a, b, c) => {
return a + b + c
}
cy
.wrap({ sum: fn })
.invoke('sum', 2, 4, 6)
.should('be.gt', 10) // true
.and('be.lt', 20) // true
Use cy.invoke('removeAttr', 'target') to get around new tab
Arguments are automatically forwarded to the function
cy
.get('img').invoke('attr', 'src')
.should('include', 'myLogo')
Notes
Third Party Plugins
Using a Kendo DropDown
If you are using jQuery then the jQuery wrapped elements will automatically have your 3rd party plugins available to be called.
cy.get('input').invoke('getKendoDropDownList').then((dropDownList) => {
// yields the return of $input.getKendoDropDownList()
return dropDownList.select('apples')
})
We can rewrite the previous example in a more terse way and add an assertion.
cy
.get('input')
.invoke('getKendoDropDownList')
.invoke('select', 'apples')
.invoke('val').should('match', /apples/)
Rules
Requirements
.invoke()requires being chained off a previous command.
Assertions
.invoke()will wait for thefunctionto exist on the subject before running..invoke()will automatically retry until assertions you've chained all pass.
Timeouts
.invoke()can time out waiting for assertions you've added to pass.
Command Log
Invoke jQuery show method on element
cy.get('.connectors-div').should('be.hidden')
.invoke('show').should('be.visible')
The commands above will display in the Command Log as:
When clicking on invoke within the command log, the console outputs the following:
