Found 26 Articles for Test Automation

Cypress handles static dropdowns with the help of its in built commands. For a static dropdown, the tagname of the element should be and its child elements should have the tagname .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 ... Read More

Cypress handles checking and unchecking of checkbox with the help of its in built functions. For a checkbox, the tagname of the element should be input and the type attribute in the html code should be checkbox.The command used is check(). This command needs to be chained with a command that gives DOM elements and the element should be of type checkbox. The various usage of check commands are listed below −check() − The check() command without argument checks all the checkboxes. The get method should have the [type="checkbox"] as the css selector when it is chained with check() method.cy.get('[type="checkbox"]').check()check() ... Read More

Cypress can work on JQuery objects and call its methods. Thus Cypress can act upon both Cypress and non- Cypress commands. Cypress is asynchronous in nature. It is handled by resolving promises for every Cypress command. This whole process is taken care of by Cypress internally and wrapped and hidden from the end user.However while dealing with JQuery methods, the promise cannot be resolved internally by Cypress and we need to manually resolve them with the help of the then() method in the code.Let us take the example of text() method which is a non-Cypress command and is based on ... Read More

Cypress is built on node.js server and it works with Javascript programming language. Anything which is dependent on node.js is asynchronous in nature and so Cypress commands work in that mode.When we have a group of test steps in a test case, all the steps start executing in parallel without waiting for the previous step to complete. In a synchronous execution, each test step runs in sequence and we move to the next step only if the previous step execution is done.Thus in asynchronous execution like Cypress, each test step is independent to each other even though the test steps ... Read More

Cypress can validate the text on an element with the help of jQuery text() method. This method shall help us to fetch the text content on the selected element. We can also put assertions on the text content of the element.cy.get('.product').should('have.text', 'Tutorialspoint');We can do validations on the text like verify what it contains or matches with the help of the Javascript methods match(), include() and so on. Thus Cypress commands can work on non-Cypress methods with the help of jQuery objects and invoke methods on them.ExampleCode Implementation with the text() method.// test suite describe('Tutorialspoint Test', function () { // test ... Read More

Cypress has the get() and find() methods to find elements based on locators on the page. The objective achieved by these two methods are almost identical. The get() method fetches one or a list of web elements with the help of the css locators specified as a parameter to that method.Syntaxcy.get(selector, args)The second parameter of the get() method is optional. There can be of three types of parameter as listed below −log − The default value of log parameter is true. This determines if there will be logging of the command on the console.cy.get('.product', { log: false });withinSubject − The ... Read More

After a test case is run on Cypress, we need to debug and understand the logs in case of a failure. Cypress has the feature to provide information to the user on what incident took place before and after the failure had happened.The above screenshots show a full log of the test cases executed with pass/ fail results. If we investigate more into the step by clicking on it, the element on which an action has been performed gets highlighted with a red circle. For example the type command in the screenshot.On further investigation we found out that we have ... Read More

Cypress has a list of common assertions that can be applied to any element on the browser. Assertions are the checkpoints that confirm if a test step of the automated test case passed or failed. Thus it checks the expected state of the application under test.Cypress bundles the Chai, JQuery and Sinon libraries for assertions. Some of the assertions are associated with the element along with the parent command and cannot be used as a standalone command. For example, should().However there are some assertions which act upon directly on the elements and not dependent upon other commands. For example, expect(). ... Read More

Apart from the css selector that Cypress uses for unique identification of elements, there is a Cypress plugin which automatically provides the css for each element. This plugin is called Open Selector Playground and comes with the Cypress Test Runner.This plugin appears in the left upper section of the Test Runner window. We need to click on that and next spy on the element that we want to identify. On spying on that element, css selector value gets populated by default.To identify the element, spy on that element. Please note the css value gets populated as #gsc-i-id1 along with the ... Read More

Cypress has to identify elements on the page to perform actions on them. The unique identification of the elements is done in Cypress with the help of jQuery selectors which is basically derived from css selectors.Other automation tools like Selenium supports locators like id, name, classname, link text, partial link text, xpath and css selector.The rules for writing css selector are listed below −With the help of class name attribute. The selection of elements based on the unique class name is done with the help of (.) symbol. The customized css expression should be (.classname).Let us consider the below html ... Read More