Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
Static Dropdown verification with Cypress
Cypress handles static dropdowns with the help of its in built commands. For a static dropdown, the tagname of the element should be <select> and its child elements should have the tagname <option>.
The command used is select(). This command needs to be chained with a command that gives DOM elements having tagname as select. The various usage of select commands are listed below −
select(value) − The select() command with argument value selects the option with that value. The get method should have the css selector of the static dropdown when chained with select().
cy.get('select').select('value1')select(text) − The select() command with argument text selects the option with that text content. The get method should have the css selector of the static dropdown when chained with select().
cy.get('select').select('text')select('Value1', 'Value2') − The select() command with arguments selects the array of options with those values or text contents. The get method should have the css selector of the static dropdown when chained with select().
cy.get('select').select(['Tutorialspoint', 'Cypress'])select({ force: true }) − The select() command with option as argument changes the default behavior of static dropdown. There can be three types of options − log, force and timeout having default values as true, false and defaultCommandTimeout (4000 milliseconds) respectively.
cy.get('select').select('Cypress', { force: true})The option force is used by Cypress to interact with hidden elements and then forces to select an option from the dropdown internally.
We can apply assertions with the select() command in Cypress.
Syntax
cy.get('select').select('Cypress').should('have.value', 'Cypress')Example
Code Implementation with select().
describe('Tutorialspoint Test', function () {
// test case
it('Test Case2', function (){
cy.visit("https://www.tutorialspoint.com/selenium /selenium_automation_practice.htm");
// checking by values
cy.get('input[type="checkbox"]')
.check(['Manual Tester','Automation Tester']);
// selecting a value from static dropdown
cy.get('select[name="continents"]').select('Europe')
// asserting the option selected
.should('have.text', 'Europe')
});
});
2K+ Views
