- Cypress Tutorial
- Cypress - Home
- Cypress - Introduction
- Cypress - Architecture and Environment Setup
- Cypress - Test Runner
- Cypress - Build First Test
- Cypress - Supported Browsers
- Cypress - Basic Commands
- Cypress - Variables
- Cypress - Aliases
- Cypress - Locators
- Cypress - Assertions
- Cypress - Text Verification
- Cypress - Asynchronous Behavior
- Cypress - Working with XHR
- Cypress - jQuery
- Cypress - Checkbox
- Cypress - Tabs
- Cypress - Dropdown
- Cypress - Alerts
- Cypress - Child Windows
- Cypress - Hidden Elements
- Cypress - Frames
- Cypress - Web Tables
- Cypress - Mouse Actions
- Cypress - Cookies
- Cypress - Get and Post
- Cypress - File Upload
- Cypress - Data Driven Testing
- Cypress - Prompt Pop-up Window
- Cypress - Dashboards
- Cypress - Screenshots and Videos
- Cypress - Debugging
- Cypress - Custom Commands
- Cypress - Fixtures
- Cypress - Environment Variables
- Cypress - Hooks
- Cypress - Configuration of JSON File
- Cypress - Reports
- Cypress - Plugins
- Cypress - GitHub
- Cypress Useful Resources
- Cypress - Quick Guide
- Cypress - Useful Resources
- Cypress - Discussion
Cypress - Child Windows
Cypress does not have a specific command to work with child windows. It has a workaround method in jQuery through which it handles the child windows. In the html code, a link or button opens to a child window, because of the attribute target.
If the target attribute has value blank, it opens to a child window. Cypress uses the jQuery method removeAttr, which is invoked by the invoke command in Cypress. The removeAttr deletes the attribute, which is passed as one of the parameters to the invoke method.
Once the target=blank is removed, then a link/button opens in the parent window and after performing operations on it, we can shift back to the parent URL with the go command.
The Html code for opening a child window in Cypress is as follows −
Implementation
Given below is an implementation of the commands for child windows in Cypress −
describe('Tutorialspoint', function () { // test case it('Scenario 1', function (){ // url launch cy.visit("https://the-internet.herokuapp.com/windows") // delete target attribute with invoke for link cy.get('.example > a') .invoke('removeAttr', 'target').click() // verify child window url cy.url() .should('include', 'https://the-internet.herokuapp.com/windows/new') // shift to parent window cy.go('back'); }); });
Execution Results
The output is as follows −
The output logs show the deletion of the target attribute and launching of the child window within the parent window.
To Continue Learning Please Login
Login with Google