10 Web Elements - biswajitsundara/Cypress GitHub Wiki
We need to use check()
method to tick a checkbox and uncheck()
method to untick
DOM
<input type="checkbox" name="love" value="love" id="love"> <label for="love"> Check if you love this website!</label>
Code To Test
cy.visit('https://html.com/input-type-checkbox/'); //check cy.get('#love').check().should('be.checked').and('have.value', 'love'); cy.get('#love').next('label').should('have.text',' Check if you love this website!'); //uncheck cy.get('#love').uncheck().should('not.be.checked');
Here we can see the label has the text that displays for the checkbox
so if we want to validate then we need to use next('label')
method
it will check just after the checkbox the label tag has the specific text.
HTML drop downs will be like this
<select name="cars" id="cars"> <option value="volvo">Volvo</option> <option value="saab">Saab</option> <option value="mercedes">Mercedes</option> <option value="audi">Audi</option> </select>
cy.get("#cars").invoke('val').then((text)=>{ let defaultText = text.toString(); expect(defaultText).to.equals('volvo'); })
cy.get('#cars').select('mercedes').should('have.value','mercedes');
Cypress can handle web tables. This HTML element starts with tag <table> and for each row there's a <tr> and for each column there's a <td> tag. Based on the nature of the web element there are two types of web tables
- static - The row & column count remains same
- dynamic - The row & column count changes during run time.
cy.visit("http://testautomationpractice.blogspot.com/"); cy.get("table[name='BookTable']").contains('td', 'Selenium').should('be.visible');
cy.visit("http://testautomationpractice.blogspot.com/"); const i = 3, j = 3; cy.get("table[name='BookTable'] > tbody > tr:nth-child(" + i + ") > td:nth-child(" + j + ")") .contains('Java') .should('be.visible');
cy.visit("http://testautomationpractice.blogspot.com/"); cy.get("table[name='BookTable'] > tbody > tr td:nth-child(2)").each(($e, index, $list) => { const text = $e.text(); if (text.includes("Amod")) { cy.get("table[name='BookTable'] > tbody > tr td:nth-child(1)") .eq(index).then(function (bname) { const bookName = bname.text(); expect(bookName).to.equal('Master In Java'); }) } });
cy.get('td').contains('Learn Java').parent('tr').within(() => { // all searches are automatically rooted to the found tr element cy.get('td').eq(1).contains('Mukesh') cy.get('td').eq(2).contains('Java') cy.get('td').eq(3).contains('500') })
const rows= cy.get("table[name='BookTable'] > tbody > tr").its('length'); const cols = cy.get("table[name='BookTable'] > tbody > tr th").its('length'); console.log(rows) console.log(cols)