не удается найти iframe с помощью кипариса

Я использую кипарисовик для тестирования своего сайта, чего я хочу достичь: по этой ссылке: https://www.glassboxdigital.shop/product-page/classic, когда я нажимаю «Добавить в корзину» введите описание изображения здесь

справа есть боковая панель:  введите описание изображения здесь

Я хочу нажать на кнопку «Просмотр корзины», мой первый шаг был наивным - я получил указатель элемента и щелкнул по нему, поскольку я увидел, что это не удалось, я немного исследовал и обнаружил, что это «iframe», который я пытался использовать » iframe ', указав на него следующее:

cy.get("iframe[frameborder='0']:nth-child(2)").then(function($elem){
     var ifele = $elem.contents().find("a[id*='view-cart-button']")
     cy.wrap(ifele).click()

но когда я запустил его, результат был:

Expected to find element: undefined, but never found it

cy.get("iframe[frameborder='0']:nth-child(2)").then(function($elem){
  16 |             var ifele = $elem.contents().find("a[id*='view-cart-button']")
> 17 |             cy.wrap(ifele).click()
     |                ^
  18 |         })
  19 |     
  20 |     }

person tupac shakur    schedule 03.02.2021    source источник


Ответы (2)


Он не может найти элемент, потому что боковая панель создается в html при вызове боковой панели, но Cypress ищет элемент на странице до вызова боковой панели.

Отредактируйте код, чтобы выполнить любой сценарий, формирующий боковую панель, а затем используйте расположение элемента, которое вы пробовали ранее.

person user7778287    schedule 03.02.2021
comment
Я не совсем понял ваше решение - person tupac shakur; 03.02.2021
comment
Указатель элементов находит объекты в HTML-файле, но ваш HTML-файл изменяется. HTML выглядит по-разному, когда боковая панель отображается и когда она скрыта. Возможно, вы пытаетесь получить HTML-код боковой панели до того, как он действительно существует. - person user7778287; 03.02.2021

Поскольку cypress не предоставляет собственный способ работы с iframe, поэтому мы создадим настраиваемую команду, в основном для прохождения через iframe. Зайдите в cypress/support/command.js и напишите:

Cypress.Commands.add('getIframe', (iframe) => {
    return cy.get(iframe)
        .its('0.contentDocument.body')
        .should('be.visible')
        .then(cy.wrap);
})

Ваш тест должен выглядеть так:

it('Go inside iframe and click', function() {
  
    //Visit webpage
    cy.visit("https://www.glassboxdigital.shop/product-page/classic")
  
    //Wait till the Let's Chat header is visible
    cy.get('#comp-jor13ajz > .yuKeh').should('be.visible')
  
    //Click on the Add to Cart button
    cy.get('[data-hook="add-to-cart"]').click()
  
    //Go inside iframe and click View cart button
    cy.getIframe('iframe[name*="tpapopup"]').contains('View Cart').click({
        force: true
    })
})

После казни:

введите описание изображения здесь

person Alapan Das    schedule 03.02.2021