Утверждают, что элемент не действует в Cypress - PullRequest
Новая
       40

Утверждают, что элемент не действует в Cypress

0 голосов
/ 29 августа 2018

Если элемент не активен на странице (в данном случае он покрыт другим элементом) и вы пытаетесь щелкнуть по нему, Cypress выдаст ошибку, подобную этой: 

CypressError: Timed out retrying: cy.click() failed because this element:

<span>...</span>

is being covered by another element:

Отлично! Но есть ли способ утверждать, что это так, иначе элемент не может быть нажат?

Это не работает:

  • should.not.exist - элемент существует
  • should.be.disabled - элемент не отключен
  • should.not.be.visible - элемент видим (просто покрыт другим прозрачным элементом)
  • с использованием cy.on('uncaught:exception', ...), поскольку это не исключение

1 Ответ

0 голосов
/ 03 сентября 2018

См. Cypress тесты на click_spec.coffee . 

it "throws when a non-descendent element is covering subject", (done) ->

  $btn = $("<button>button covered</button>")
    .attr("id", "button-covered-in-span")
    .prependTo(cy.$$("body"))

  span = $("<span>span on button</span>")
    .css(position: "absolute", 
         left: $btn.offset().left, 
         top: $btn.offset().top, 
         padding: 5, display: "inline-block", 
         backgroundColor: "yellow")
    .prependTo(cy.$$("body"))

  cy.on "fail", (err) =>
    ...
    expect(err.message).to.include "cy.click() failed because this element"
    expect(err.message).to.include "is being covered by another element"
    ...
    done()

  cy.get("#button-covered-in-span").click()

Проще всего подражать этому тесту, хотя в документах рекомендуется использовать только cy.on('fail') для отладки.

Это похоже на модульное тестирование с использованием expect().to.throw() для проверки того, что исключение происходит, как и ожидалось, поэтому я чувствую, что шаблон здесь оправдан.

Чтобы быть точным, я бы включил вызов click({force: true}). 

it('should fail the click() because element is covered', (done) => {

  // Check that click succeeds when forced
  cy.get('button').click({ force: true })

  // Use once() binding for just this fail
  cy.once('fail', (err) => {

    // Capturing the fail event swallows it and lets the test succeed

    // Now look for the expected messages
    expect(err.message).to.include('cy.click() failed because this element');
    expect(err.message).to.include('is being covered by another element');

    done();
  });

  cy.get("#button-covered-in-span").click().then(x => {
    // Only here if click succeeds (so test fails)
    done(new Error('Expected button NOT to be clickable, but click() succeeded'));
  })

})

Как пользовательская команда

Я не уверен, как сделать запрашиваемое расширение Chai, но логика может быть заключена в пользовательскую команду

/ cypress / support / index.js 

Cypress.Commands.add("isNotActionable", function(selector, done) {
  cy.get(selector).click({ force: true })
  cy.once('fail', (err) => {
    expect(err.message).to.include('cy.click() failed because this element');
    expect(err.message).to.include('is being covered by another element');
    done();
  });
  cy.get("#button-covered-in-span").click().then(x => {
    done(new Error('Expected element NOT to be clickable, but click() succeeded'));
  })
})

/ кипарис / интеграция / myTest.spec.js 

it('should fail the click() because element is covered', (done) => {
  cy.isNotActionable('button', done)
});

Примечание

Я ожидал, что done() истечет время, когда предпосылка теста (то есть, что кнопка закрыта) ложна.

Этого не происходит (причина неизвестна), но при цепочке .then() при втором щелчке можно вызвать done() с сообщением об ошибке. Обратный вызов then() будет вызываться только в случае успешного щелчка, в противном случае обратный вызов cy.once('fail') обрабатывает сбой щелчка (согласно собственному тесту Cypress).

...