英文:
How test which HTML element I get back in Cypress without using class selectors?
问题
我试图确定由Cypress选择的元素是“p-inputmask”还是“input”，如果我能使用hasClass()就好了，但我不能。这是我的当前代码：
Cypress.Commands.add('textInputWithLabelTest', (inputId,isDisabled,expectedLabel) => {
let mask = false;
cy.get([for="${inputId}"]).should('contain',expectedLabel);
cy.get(#${inputId}).then( ($el) => {
cy.log($el.find('.ng-pristine'));
console.log($el.find('p-inputmask')); //TODO fix this
})
if(mask) {
cy.get(`#${inputId}`).siblings('input').should(isDisabled?'be.disabled':'not.be.disabled');
} else {
cy.get(`#${inputId}`).should(isDisabled?'be.disabled':'not.be.disabled');
}
})
我尝试使用JSON.stringify()和includes('p-inputmask')，但对象是循环的，无法解析。
我尝试了Jquery.toString()，但不知何故jQuery不想在文件中，即使我像这样导入它：const $ = require("jquery")( window );
我尝试使用.it('p-inputmask')，但没用。
我尝试使用.find('p-inputmask')，但由于某种原因，即使$el没有p-inputmask，它也会返回一个值。
我尝试使用.has()，但没用。
我尝试了所有这些，包括$el[0]和$el，但都没用。
这是console.log($el[0]);对于这两种不同的元素输出的内容。
英文:
I'm trying to determine if an element selected by cypress is a "p-inputmask" or a "input" it would all be fine if I could use hasClass() but I cannot. Here is my current code:
Cypress.Commands.add('textInputWithLabelTest', (inputId,isDisabled,expectedLabel) => {
let mask = false;
cy.get(`[for="${inputId}"]`).should('contain',expectedLabel);
cy.get(`#${inputId}`).then( ($el) => {
cy.log($el.find('.ng-pristine'));
console.log($el.find('p-inputmask')); //TODO fix this
})
if(mask) {
cy.get(`#${inputId}`).siblings('input').should(isDisabled?'be.disabled':'not.be.disabled');
} else {
cy.get(`#${inputId}`).should(isDisabled?'be.disabled':'not.be.disabled');
}
})
I tried JSON.stringify() with includes('p-inputmask') but the object is circular and it cannot be parsed.
I tried Jquery.toString() but jQuery doesn't want to be in the file for some reason even if I import it like : const $ = require( "jquery" )( window );
I tried it with .it('p-inputmask') it didn't work.
I tried it with .find('p-inputmask') and for some reason this returns a value even if the $el doesn't have a p-inputmask.
I tried it with .has(), it didn't work.
I tried all of these with both $el[0] and $el, nothing worked.
Here is what console.log($el[0]); outputs for the two different elements.
There must be a trivial solution to this, but what? Could someone please help?
答案1
得分: 1
尝试使用tagName属性。
Cypress.Commands.add('textInputWithLabelTest', (inputId, isDisabled, expectedLabel) => {
cy.get(`[for="${inputId}"]`).should('contain', expectedLabel);
cy.get(`#${inputId}`).then($el => {
if ($el[0].tagName === 'INPUT') {
cy.get(`#${inputId}`).should(isDisabled ? 'be.disabled' : 'not.be.disabled')
} else {
cy.get(`#${inputId}`)
.siblings('input')
.should(isDisabled ? 'be.disabled' : 'not.be.disabled')
}
})
})
我颠倒了你的if-else顺序，因为我知道<input>具有INPUT的tagName属性，但我不确定其他元素。您可以尝试我所展示的内容。
英文:
Try using the tagName property.
Cypress.Commands.add('textInputWithLabelTest', (inputId,isDisabled,expectedLabel) => {
cy.get(`[for="${inputId}"]`).should('contain',expectedLabel);
cy.get(`#${inputId}`).then($el => {
if($el[0].tagName === 'INPUT') {
cy.get(`#${inputId}`).should(isDisabled ? 'be.disabled' : 'not.be.disabled')
} else {
cy.get(`#${inputId}`)
.siblings('input')
.should(isDisabled ? 'be.disabled' : 'not.be.disabled')
}
})
})
I reversed the order of your if-else because I know an <input> has a tagName of INPUT, but I'm not sure about the other element. You can experiment with what I've shown.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论