admin管理员组文章数量:1426026
I am trying to use cy.get() to select an element on poped up form which contains Name, Surname etc, but cypress automatically closes it down. I've tried to use window:alert or double click with {force: true}, but it wasn't successful.
Desired result: I push "Place Order" button and it opens a form with fill fields which i can use further.
/// <reference types="cypress" />
// sometimes cypress cannot execute methods because element is detached from DOM. In this case need to restart test
describe('Categories test', function () {
it('Delete cart', function () {
cy.visit('.html');
cy.get('a.list-group-item:nth-child(2)').click();
cy.get('#tbodyid > :nth-child(1)').contains('$360');
cy.get(
':nth-child(1) > .card > .card-block > .card-title > .hrefch'
).click({ force: true });
cy.get('.col-sm-12 > .btn', { timeout: 30000 }).click();
cy.go(-2);
cy.get('a.list-group-item:nth-child(3)', { timeout: 30000 })
.click()
.click();
cy.get(':nth-child(1) > .card > .card-block > .card-title > .hrefch', {
timeout: 30000,
})
.contains('Sony vaio i5')
.click({ force: true });
cy.get('.col-sm-12 > .btn', { timeout: 30000 }).click();
cy.go(-2);
cy.get('a.list-group-item:nth-child(4)', { timeout: 30000 })
.click()
.click();
cy.get(':nth-child(1) > .card > .card-block > .card-title > .hrefch', {
timeout: 30000,
}).click({ force: true });
cy.get('.col-sm-12 > .btn').click();
cy.get('#cartur').click();
cy.get('#tbodyid > :nth-child(1) > :nth-child(4) > a', {
timeout: 30000,
}).click({ multiple: true }, { force: true });
cy.get('#tbodyid > :nth-child(1) > :nth-child(4) > a', {
timeout: 30000,
}).click({ multiple: true }, { force: true });
cy.get('.success > :nth-child(4) > a', { timeout: 30000 }).click(
{ multiple: true },
{ force: true }
);
cy.get('.col-lg-1 > .btn').click({ force: true });
cy.get('#totalm').contains('Total:');
cy.get('#name').type('Test');
});
});
I am trying to use cy.get() to select an element on poped up form which contains Name, Surname etc, but cypress automatically closes it down. I've tried to use window:alert or double click with {force: true}, but it wasn't successful.
Desired result: I push "Place Order" button and it opens a form with fill fields which i can use further.
/// <reference types="cypress" />
// sometimes cypress cannot execute methods because element is detached from DOM. In this case need to restart test
describe('Categories test', function () {
it('Delete cart', function () {
cy.visit('https://www.demoblaze./index.html');
cy.get('a.list-group-item:nth-child(2)').click();
cy.get('#tbodyid > :nth-child(1)').contains('$360');
cy.get(
':nth-child(1) > .card > .card-block > .card-title > .hrefch'
).click({ force: true });
cy.get('.col-sm-12 > .btn', { timeout: 30000 }).click();
cy.go(-2);
cy.get('a.list-group-item:nth-child(3)', { timeout: 30000 })
.click()
.click();
cy.get(':nth-child(1) > .card > .card-block > .card-title > .hrefch', {
timeout: 30000,
})
.contains('Sony vaio i5')
.click({ force: true });
cy.get('.col-sm-12 > .btn', { timeout: 30000 }).click();
cy.go(-2);
cy.get('a.list-group-item:nth-child(4)', { timeout: 30000 })
.click()
.click();
cy.get(':nth-child(1) > .card > .card-block > .card-title > .hrefch', {
timeout: 30000,
}).click({ force: true });
cy.get('.col-sm-12 > .btn').click();
cy.get('#cartur').click();
cy.get('#tbodyid > :nth-child(1) > :nth-child(4) > a', {
timeout: 30000,
}).click({ multiple: true }, { force: true });
cy.get('#tbodyid > :nth-child(1) > :nth-child(4) > a', {
timeout: 30000,
}).click({ multiple: true }, { force: true });
cy.get('.success > :nth-child(4) > a', { timeout: 30000 }).click(
{ multiple: true },
{ force: true }
);
cy.get('.col-lg-1 > .btn').click({ force: true });
cy.get('#totalm').contains('Total:');
cy.get('#name').type('Test');
});
});
- Could you also include your HTML or a reproducible example? – Joshua Commented Dec 17, 2020 at 5:38
-
1
@konekoya
https://www.demoblaze./index.htmlis public-facing. – user14783414 Commented Dec 17, 2020 at 10:43
2 Answers
Reset to default 2Before clicking the Place Order button you have to add a bit of wait, because the tests are executing really fast, so by the time the items are being deleted, the click happens, hence the click is not registered by the web page. So I have added a wait of 500 milliseconds and then its working.
it("Delete cart", function () {
cy.visit("https://www.demoblaze./index.html")
cy.get("a.list-group-item:nth-child(2)").click()
cy.get("#tbodyid > :nth-child(1)").contains('$360')
cy.get(":nth-child(1) > .card > .card-block > .card-title > .hrefch").click({ force: true })
cy.get(".col-sm-12 > .btn", { timeout: 30000 }).click()
cy.go(-2)
cy.get("a.list-group-item:nth-child(3)", { timeout: 30000 }).click().click()
cy.get(":nth-child(1) > .card > .card-block > .card-title > .hrefch", { timeout: 30000 }).contains('Sony vaio i5').click({ force: true })
cy.get(".col-sm-12 > .btn", { timeout: 30000 }).click()
cy.go(-2)
cy.get("a.list-group-item:nth-child(4)", { timeout: 30000 }).click().click()
cy.get(":nth-child(1) > .card > .card-block > .card-title > .hrefch", { timeout: 30000 }).click({ force: true })
cy.get(".col-sm-12 > .btn").click()
cy.get("#cartur").click()
cy.get("#tbodyid > :nth-child(1) > :nth-child(4) > a", { timeout: 30000 }).click({ multiple: true }, { force: true })
cy.get("#tbodyid > :nth-child(1) > :nth-child(4) > a", { timeout: 30000 }).click({ multiple: true }, { force: true })
//cy.get(".success > :nth-child(4) > a", {timeout: 30000}).click({multiple: true}, {force:true})
//The above line is not working for me hence I mented it out
//Your Answer
cy.wait(500)
cy.get(".col-lg-1 > .btn").click({ force: true })
cy.get('#orderModalLabel').contains('Place order')
cy.get('#name').click().type('Test')
cy.get('#country').type('Test')
cy.get('#city').type('Test')
cy.get('#card').type('1234 1234 1234 1234')
cy.get('#month').type('Mar')
cy.get('#year').type('2021')
})
Execution result:
OR, A better approach if you don't want to use cy.wait() would be to intercept the POST Delete Request and wait till it is executed.
it("Delete cart", function () {
cy.visit("https://www.demoblaze./index.html")
cy.get("a.list-group-item:nth-child(2)").click()
cy.get("#tbodyid > :nth-child(1)").contains('$360')
cy.get(":nth-child(1) > .card > .card-block > .card-title > .hrefch").click({ force: true })
cy.get(".col-sm-12 > .btn", { timeout: 30000 }).click()
cy.go(-2)
cy.get("a.list-group-item:nth-child(3)", { timeout: 30000 }).click().click()
cy.get(":nth-child(1) > .card > .card-block > .card-title > .hrefch", { timeout: 30000 }).contains('Sony vaio i5').click({ force: true })
cy.get(".col-sm-12 > .btn", { timeout: 30000 }).click()
cy.go(-2)
cy.get("a.list-group-item:nth-child(4)", { timeout: 30000 }).click().click()
cy.get(":nth-child(1) > .card > .card-block > .card-title > .hrefch", { timeout: 30000 }).click({ force: true })
cy.get(".col-sm-12 > .btn").click()
cy.get("#cartur").click()
//Intercept the Delete Request
cy.intercept('POST', '/deleteitem').as('deleteitem')
//Delete Item
cy.get("#tbodyid > :nth-child(1) > :nth-child(4) > a", { timeout: 30000 }).click({ multiple: true }, { force: true })
//Wait till the POST request is executed
cy.wait('@deleteitem')
//cy.get(".success > :nth-child(4) > a", {timeout: 30000}).click({multiple: true}, {force:true})
//The above line is not working for me hence I mented it out
//Your Answer
cy.get(".col-lg-1 > .btn").click({ force: true })
cy.get('#orderModalLabel').contains('Place order')
cy.get('#name').click().type('Test')
cy.get('#country').type('Test')
cy.get('#city').type('Test')
cy.get('#card').type('1234 1234 1234 1234')
cy.get('#month').type('Mar')
cy.get('#year').type('2021')
})
Execution result:
Please don't add arbitrary waits to your test.
Instead, confirm text on the page the same way a user would.
Try to use cy.contains(text) or cy.contains(selector, text) rather than cy.get(selector).contains(text). They are better at waiting for loading text.
Do this at points where the page reloads (where the Cypress log has an '(xhr)' entry). This stops the test continuing faster than the web page can change.
cy.visit("https://www.demoblaze./index.html")
cy.contains("Phones").click()
cy.contains("Samsung galaxy s6").click()
cy.contains("Add to cart").click()
cy.contains("Home").click()
cy.contains("Laptops").click()
cy.contains('Sony vaio i5').click()
cy.contains("Add to cart").click()
cy.contains("Home").click()
cy.contains("Monitors").click()
cy.contains('Apple monitor 24').click()
cy.contains("Add to cart").click()
cy.get("#cartur").click()
// Confirm the cart page has loaded
cy.get('table').should('contain', 'Samsung galaxy s6')
cy.get('table').should('contain', 'Sony vaio i5')
cy.get('table').should('contain', 'Apple monitor 24')
cy.contains('tr', 'Samsung galaxy s6')
.children().contains('Delete').click();
cy.get('table').should('not.contain', 'Samsung galaxy s6')
cy.contains('tr', 'Sony vaio i5')
.children().contains('Delete').click();
cy.get('table').should('not.contain', 'Sony vaio i5');
cy.contains('tr', 'Apple monitor 24')
.children().contains('Delete').click();
cy.get('table').should('not.contain', 'Apple monitor 24')
cy.contains('button', 'Place Order').click()
cy.contains('label', 'Name')
// test the form here
本文标签： javascriptCypress JS how to catch Pop up formStack Overflow
版权声明：本文标题：javascript - Cypress JS how to catch Pop up form - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1745468218a2659627.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论