英文:
Cypress 12 + angular 15 + input chain failling randomly
问题
我刚刚将我的应用程序从 Angular 12 迁移到 Angular 15（和 Material 15）。
Cypress 也从 8.7.0 迁移到了 12.3.0。
自迁移以来，现有的 Cypress 测试在执行时不一致。我遇到了两种问题：
- 无法通过 id 或 css 类名获取元素。错误消息是“...被另一个元素遮挡”
- 输入链式操作的同步性不完美。例如：
cy.get('#birthPlace_id')
.clear()
.type('London')
.should('have.class', 'ng-valid');
在这个测试代码执行中，输入操作开始时清除指令尚未完全完成。这导致输入值错误，混合了先前和新输入的值。
这是我的配置：
defaultCommandTimeout: 60000,
execTimeout: 60000,
pageLoadTimeout: 60000,
requestTimeout: 60000,
responseTimeout: 60000,
taskTimeout: 60000,
videoUploadOnPasses: true,
screenshotOnRunFailure: false,
videoCompression: false,
numTestsKeptInMemory: 0,
animationDistanceThreshold: 20,
waitForAnimations: false,
env: { 'NO_COLOR': '1' },
retries: {
runMode: 4,
openMode: 0
},
fileServerFolder: '.',
modifyObstructiveCode: false,
video: false,
chromeWebSecurity: true,
component: {
devServer: {
framework: 'angular',
bundler: 'webpack'
}
}
我已经尝试过：
- 添加 "force: true"
- 添加等待（1000）或其他值
- 在之前使用 click() 方法
- 在配置文件中增加了超时时间
但是同样的行为仍然随机，有时可以完美工作，但大多数情况下不行。
我期望 clear()、type()、should() 的调用完全同步，不会在前一个操作完成之前开始。
我的问题是：是否有更好的方法来进行链式操作？自 Cypress 8 以来在元素上链式操作有何变化？
英文:
I just migrate my application from angular 12 to angular 15 (and material 15).
The cypress also migrated from 8.7.0 to 12.3.0
Since the migration, the existing cypress tests are not constant in execution.
I have too kinds of issue:
- Cannot get element by id or css class. The error is “…is being covered by another element“
- Synchronisation is not perfect on input chaining. As example :
cy.get('#birthPlace_id')
.clear()
.type('London')
.should('have.class', 'ng-valid');`
In this test code execution, the type starts meanwhile the clear instruction is not completely finished. This give a wrong input value with a mix of previous and new typed values.
Here is my configuration:
defaultCommandTimeout: 60000,
execTimeout: 60000,
pageLoadTimeout: 60000,
requestTimeout: 60000,
responseTimeout: 60000,
taskTimeout: 60000,
videoUploadOnPasses: true,
screenshotOnRunFailure: false,
videoCompression: false,
numTestsKeptInMemory: 0,
animationDistanceThreshold: 20,
waitForAnimations: false,
env: { 'NO_COLOR': '1' },
retries: {
runMode: 4,
openMode: 0
},
fileServerFolder: '.,',
modifyObstructiveCode: false,
video: false,
chromeWebSecurity: true,
component: {
devServer: {
framework: 'angular',
bundler: 'webpack'
}
}
I already tried to:
- Add “force: true”
- Add a wait(1000) or another value
- Use click() method before
- I increased the timeout in the config file for all
But same comportment randomly it can also work perfectly, but major time not at all.
I would expect that the call to clear(), type(), should() are perfectly synchronised and does not start before the previous one is not finished yet.
My question: is there a better way to do chaining ? Does something change since Cypress 8 to chain instruction on element ?
答案1
得分: 3
在这个测试代码执行中，类型开始时清除指令尚未完全完成。
您可以通过在.clear()后添加一个断言来防止这种情况发生。
这将重复测试流程，直到控制被清除。
cy.get('#birthPlace_id')
.clear()
.should('have.value', '')
.type('London')
.should('have.value', 'London')
英文:
> In this test code execution, the type starts meanwhile the clear instruction is not completely finished.
You can guard against this by adding an assertion after .clear().
This retries the test flow until the control has been cleared.
cy.get('#birthPlace_id')
.clear()
.should('have.value', '')
.type('London')
.should('have.value', 'London')
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论