Как использовать Cypress для обнаружения вывода setCustomValidity при проверке формы HTML5 - PullRequest
0 голосов
/ 04 июля 2018

Я использую последнюю версию Cypress для создания функциональных тестов для моего приложения Javascript. Я запускаю их как во встроенном браузере Electron, так и в Chrome на Mac OS X (все обновления / обновления применяются как к браузеру, так и к ОС). У меня та же проблема при запуске тестов в обоих браузерах.

Одна из моих функций JS вызывается при изменении значения формы. Он проверяет значение и, если оно недопустимо, использует функцию HTML5 setCustomValidity () для этого ввода, чтобы установить сообщение и предотвратить отправку формы. Это имеет правильный эффект в браузере.

В Cypress я думал, что смогу написать тестовую проверку, чтобы увидеть, был ли сделан этот вызов setCustomValidity (), выполнив что-то вроде:

cy.get('#myinputelement').its('validationMessage').should('have.value', 'My custom validation message')

Но он жалуется, что элемент input не имеет атрибута validationMessage (даже если он отображается в DOM в консоли браузера). Элемент input, соответствующий селектору, безусловно, существует, так как вызов .type () для него правильно заполняет его значением.

Может ли Cypress вообще видеть атрибут validityMessage? Если нет, то как мне пройти тестирование вызовов JS для setCustomValidity () из Cypress?

1 Ответ

0 голосов
/ 05 июля 2018

Разобрался:

cy.get('#mydatefield').type('2010-01-55')
    .should(($mydatefield) => {
        expect($mydatefield.get(0).checkValidity()).to.equal(false);
        expect($mydatefield.get(0).validationMessage).to.equal('Invalid date');
     });
...