这与隐藏了其父元素的Access元素cypress.io相同，是基本问题，不同的是这个问题是angularjs + md-select，这个问题是angular +mdc-select。
但是，两个版本的 使用相同的技巧，在单击父控件以打开选项后，使父控件不可见（通过将width和height设置为0）。
不允许单击选项，因为它认为选项是不可见的，因为父级是不可见的。
解决方法是使用.then()来访问未包装的列表项，并使用 单击选择它而不是 单击。
我已经在Angular 5设置上对其进行了测试，并且由于问题的相似性，预计它可以与AngularJS设置一起使用。
describe('Testing material design select', function() {
it('selects an option by click sequence (fails due to visibility issue)', function() {
const doc = cy.visit('http://localhost:4200');
cy.get('[name="countries"]').click();
cy.get('md-option').contains('Country seven').click();
});
it('selects an option by click sequence', function() {
const doc = cy.visit('http://localhost:4200')
cy.get('[name="countries"]').click()
cy.get('md-option').contains('Country seven').then(option => {
// Confirm have correct option
cy.wrap(option).contains('Country seven');
option[0].click(); // this is jquery click() not cypress click()
// After click, md-select should hold the text of the selected option
cy.get('[name="countries"]').contains('Country seven')
});
});
});
describe('Testing material design select', function() {
it('selects an option by click sequence (fails due to visibility issue)', function() {
const doc = cy.visit('http://localhost:4200');
cy.get('[name="countries"]').click();
cy.get('mdc-select-item').contains('Country seven').click();
});
it('selects an option by click sequence', function() {
const doc = cy.visit('http://localhost:4200')
cy.get('[name="countries"]').click()
cy.get('mdc-select-item').contains('Country seven').then(option => {
// Confirm have correct option
cy.wrap(option).contains('Country seven');
option[0].click();
// After click, mdc-select should hold the text of the selected option
cy.get('[name="countries"]').contains('Country seven');
});
});
});
602392714
清零编程群