This post is a continuation of Advance Cypress Interview Questions – Part 1 for any QA Automation interview.
8. What is trigger function in Cypress?
Trigger function can be used to trigger any event on DOM element
Example:
cy.get('a').trigger('mousedown') // Triggers mouse down event on link
cy.get('button').trigger('focus') //Focus shifts to button
9. How can I use mouseover in cypress?
Cypress doesn’t offer any direct method to mouse over action, so we need to use work around using trigger() event. That means we need to trigger mouseover event.
cy.get('button').trigger('mouseover')
10. How can I perform dragNdrop in cypress?
Cypress doesn’t offer any drag and drop functionality, for this we need to rely on trigger function and call appropriate events.
Example:
cy.get('[data-cy=draggable]')
.trigger('mousedown', { which: 1, pageX: 600, pageY: 100 })
.trigger('mousemove', { which: 1, pageX: 600, pageY: 600 })
.trigger('mouseup')
11. How can I get location Object in Cypress?
We can get the location object by specifying the cy.location();
With location object you can get window.location() properties such as hash, host, hostname, href, origin, pathname, port, protocol etc.
Example:
let myhost = cy.location('host')
12. How can filter the DOM element?
Cypress offers a way to get the filtered element, that means you can match specific values against DOM element when you select.
Example:
<ul>
<li>Home</li>
<li>Services</li>
<li>Advanced Services</li>
<li>Pricing</li>
<li>Contact</li>
</ul>
Consider I have 5 list element, where I need to get all the li elements which matches services then I can use below code
cy.get('li').filter(':contains("Services")').should('have.length', 2)
13. How can I chain multiple assertion in cypress?
Cypress provides way to chain assertions, if you want to validate more than one conditions in your tests you can just use and to chain the assertions.
Example:
cy.get('button').should('have.class', 'active').and('not.be.disabled')
14. How to handle window alert in cypress?
In order to handle the alert or browser pop ups we need to implement uncaught:exception in our code, then it will automatically handles the alert. If it’s alert box, it internally handles and clicks on OK button always.
Example:
Cypress.on("uncaught:exception", (err, runnable) => {
// returning false here prevents Cypress from
// failing the test
return false;
});
cy.visit("https://test.com/popups");
cy.get('[name="alert"]').click(); //This will handle the pop up internally
15. How can I skip tests?
Cypress uses mocha framework internally, so we can use mocha’s .skip() or .only() to skip or execute tests in cypress.
Option 1 : Use describe.only() or it.only()
describe('Example', function() {
it.only('Test1', function() {
// this test will be run
});
it.only('Test2', function() {
// this test will also be run
});
it('Test 3', function() {
// this test will not be run
});
});
Option 2: Use it.skip() or describe.skip()
describe.skip('Example',()=> { //this describe block will be skipped
it('Test1', function() {
//Some code
});
});
16. Consider I have table and list of rows and data, How can I iterate and get the text?
OR, I have HTML table how can I iterate in cypress without using any loop?
Let’s take an example we have table something like below
<table id='customers'>
<tr>
<th>Company</th>
<th>Contact</th>
<th>Country</th>
</tr>
<tr>
<td>Alfreds Futterkiste</td>
<td>Maria Anders</td>
<td>Germany</td>
</tr>
</table>
With the above example, we can get all the text using below code.
cy.get('#customers').get('tbody tr td').each(($ele)=>{
cy.log($ele.text());
})
Output will be:
Company
Contact
Country
Alfreds Futterkiste
Maria Anders
Germany
17. How can I execute JavaScript Command in Cypress?
Or How can I use selenium equivalent JavaScriptExecutor in Cypress
Cypress doesn’t have JavascriptExecuter command, since cypress doesn’t use webdriver. Most of the time it interacts with DOM element directly. In the line of Javascript executor we have different options in cypress.
Executing commands with Native HTML DOM (Jquery) element
Using windows object, execute the command directly on browser window.
Option 1 : Get the native HTML DOM and execute action on it
Example:
cy.visit('https://www.google.com')
cy.get('input[name="q"]').then(($ele)=>{
$ele.get(0).value="Something"
})
Option 2: Using window object, execute command on browser
Example:
cy.window().then((win) =>{
win.eval("document.querySelector('input[name=\"q\"]').value='Some Text'")
})
18. What is before:run event in cypress?
before:run event is executed before any test starts in cypress, this is very helpful if you want load any external resource, or delete some folder or clean up folder etc. This before:run typically used in plugin files.
Example: <plugin/index.js> Delete reports folder before running.
module.exports = (on, config) => {
on('before:run', async (details) => {
await exec("IF EXIST cypress\\reports rmdir /Q /S cypress\\reports")
});
}