我刚刚开始在我的 React Typescript 项目中使用 Cypress。我有一些简单的测试要运行:
describe('settings page', () => {
beforeEach(() => {
cy.visit('http://localhost:3000')
});
it('starts in a waiting state, with no settings.', () => {
cy.contains('Waiting for settings...')
});
it('shows settings once settings are received', () => {
const state = cy.window().its('store').invoke('getState')
console.log(state) // different question: how do I get this to be the state and not a $Chainer?
});
});
它在 Cypress 中运行得很好。但是我在 Webstorm 中收到 Typescript 错误,说它cy
没有定义(TS 和 ESlint 错误)和describe
说all files must be modules when the --isolatedModules flag is provided
.
我可以把它变成一个 JS 文件而不是一个 TS 文件,然后我仍然cy
没有定义。
我试过了,import cy from 'cypress'
但后来我得到ParseError: 'import' and 'export' may appear only with 'sourceType: module'
了另一个完整的蠕虫罐头(我正在采取婴儿步骤编写我的测试并且还没有导入任何东西......)
/// <reference types="cypress" />
不起作用。
更新(有点)
我已按照此处的说明进行操作并取得了一些进展。在我已经非常完整的 React webpack.config.dev.js 中,我添加了推荐的代码:
{ // TODO inserted for cypress https://stackoverflow.com/a/56693706/6826164
rules: [
{
test: /\.tsx?$/,
use: 'ts-loader',
exclude: /node_modules/
}
]
},
到规则列表的末尾(就在文件加载器之前)。
当我这样做并按照plugins/index
文章中的说明设置文件时,cypress“主屏幕”运行但是当我点击打开我的测试时,它需要很长时间,然后显示很多错误,从
integration\settings.spec.ts
This occurred while Cypress was compiling and bundling your test code. This is usually caused by:
A missing file or dependency
A syntax error in the file or one of its dependencies
Fix the error in your code and re-run your tests.
./cypress/integration/settings.spec.ts
Module build failed (from ./node_modules/ts-loader/index.js):
Error: TypeScript emitted no output for C:\Users\...\...\front_end\cypress\integration\settings.spec.ts.
@ multi ./cypress/integration/settings.spec.ts main[0]
其次是,实际上,很多 Typescript 输出如下:
C:\Users\jtuzman\dev\...\...\src\__tests__\Errors.test.tsx
[tsl] ERROR in C:\Users\jtuzman\dev\...\...\src\__tests__\Errors.test.tsx(37,41)
TS2339: Property 'toBeTruthy' does not exist on type 'Assertion'.
C:\Users\jtuzman\dev\...\...\src\__tests__\Errors.test.tsx
[tsl] ERROR in C:\Users\jtuzman\dev\...\...\src\__tests__\Errors.test.tsx(41,45)
TS2339: Property 'toBeDefined' does not exist on type 'Assertion'.
请注意,这些现在是测试文件之外的代码的错误(尽管这可能是有道理的)。其中许多是针对我使用 Jest 而不是 Cypress 的文件,正如您所看到的,许多错误似乎与它推断出不是 Jest的Assertion
类型有关expect
,因此它认为toEqual
匹配器是错误的。
一直以来,在 Webstorm 中,ESLint 仍在抱怨我的所有内容,cy
而 TypeScript 正在强调输出中提到的所有那些 Jest 断言。
这一切都与 ts 测试文件有关。如果我将文件重命名为 js,它会说该文件没有测试。
有什么帮助吗?我喜欢 Cypress,但我很难让它完全正常工作!