英文:
creating a cypress command that will get button and add infinite cypress action based on user input
问题
我想创建一个 Cypress 自定义命令,根据用户的参数添加 Cypress 动作并将它们链接在一起。
现在我有类似这样的东西:
Cypress.Commands.add(
'selectButton',
(text: string, ...actionType: ButtonActionTypes[]) => {
let cyActions = '';
for (let i = 0; i < actionType.length; i++) {
const cyAction = actionType[i];
const getActionType = getAction(text, cyAction);
if (getActionType !== null) {
cyActions += `${getActionType}`;
} else {
cyActions += cyAction;
}
`${cy.get('button')}.${cyActions}`;
}
}
);
function getAction(text, action) {
switch (action) {
case 'click':
'click()';
break;
case 'visible':
'should("be.visible")';
break;
case 'disabled':
'should("be.disabled")';
break;
case 'blur':
'blur()';
break;
case 'contains':
contains(${text});
break;
}
}
但是这并不按照我想要的方式工作。虽然它选择了按钮,但如果我想要创建这样的命令:
`cy.selectButton('Send').should('be.visible').should('be.disabled');`
基于这个
`cy.selectButton('Send', 'visible', 'disabled', 'click');`
我得到的是所有我网站上拥有的按钮。
英文:
I want to create a cypress custom command that based on user arguments will add cypress action and chain them together
Now I have something like this:
Cypress.Commands.add(
'selectButton',
(text: string, ...actionType: ButtonActionTypes[]) => {
let cyActions = '';
for (let i = 0; i < actionType.length; i++) {
const cyAction = actionType[i];
const getActionType = getAction(text, actionType);
if (getActionType !== null) {
cyActions += `${getActionType}`;
} else {
cyActions += cyAction;
}
`${cy.get('button')}.${cyActions}`;
}
}
);
function getAction(text, action) {
switch (action) {
case 'click':
'click()';
break;
case 'visible':
'should("be.visible")';
break;
case 'disabled':
'should("be.disabled")';
break;
case 'blur':
'blur()';
break;
case 'contains':
`contains(${text})`;
break;
}
}
But this is not working as i want. Although it is selecting buttons, but if i want to create this:
cy.selectButton('Send').should('be.visible').should('be.disabled');
based on that
cy.selectButton('Send', 'visible', 'disabled', 'click');
I am getting all buttons that i have on my site
答案1
得分: 2
你可以处理断言,因为.should('be.visible')下面的语法是expect(subject).to.be.visible,而.to、.be、.visible只是你断言主题的expect(subject)包装器的属性。
Cypress.Commands.add(
'selectButton',
(text: string, ...actionTypes: ButtonActionTypes[]) => {
let cyActions = '';
cy.get(text).then($el => {
const expectWrapper = expect($el) // 包装主题以进行一系列断言
[...actionTypes].forEach(actionType => {
expectWrapper[actionType]
})
}
)
关于命令,我不清楚,动态添加它们可能有点困难 - 可能是不可能的,因为Cypress喜欢在运行之前设置命令队列。
英文:
You could probably handle assertions since the syntax underlying .should('be.visible') is expect(subject).to.be.visible and the .to, .be, .visible are just properties of the expect(subject) wrapper of your assertion subject.
Cypress.Commands.add(
'selectButton',
(text: string, ...actionTypes: ButtonActionTypes[]) => {
let cyActions = '';
cy.get(text).then($el => {
const expectWrapper = expect($el) // wraps subject for chain of assertions
[...actionTypes].forEach(actionType => {
expectWrapper[actionType]
})
}
)
I don't know about the commands, it's a little more difficult to add those dynamically - might be impossible, since Cypress likes to set up the command queue before running it.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。


评论