3

我在 Cypress 测试中使用 JavaScript 文件。

在commands.js我创建了一个自定义命令：

Cypress.Commands.add('selectDropdown', (dropdown) => {
    cy.get('#' + dropdown).click();
})

And in my test file I call it:

```lang-javascript
cy.selectDropdown('dropdown1');

当我在测试运行器中运行测试时，这工作正常。唯一的问题是，我的 IDE (PhpStorm) 无法识别该命令。

未解析的函数或方法 selectDropdown()

如何“告诉”IDE，这样的命令存在？

更新：

我index.d.ts在支持文件夹下创建了一个文件（但是我只使用赛普拉斯的 JS 文件，我已经index.js有了）。

在那个 ts 文件中我放了：

/// <reference types="cypress" />

declare namespace Cypress {
    interface Chainable<Subject> {
        selectDropdownValue(dropdown, value): Chainable<(string)>;
    }
}

现在该cy.selectDropdownValue命令已在 IDE 中被识别，并且在测试运行程序中似乎工作正常，但存在一些问题：

  1. 我最好避免创建一个新的 TypeScript 文件，因为我已经index.js有了，而且我在项目中只使用 JS 文件

  2. 声明命名空间 - 不允许使用“命名空间”和“模块”（无命名空间）——这是一个 Lint 警告，因此需要以某种方式替换它

  3. 未使用的接口可链接。不确定我是否需要Chainable那里，因为它未使用，也在这里selectDropdownValue(dropdown, value): Chainable<(string)>;

谁能帮忙，如何通过 IDE 以 JavaScript 方式而不是 TypeScript 识别自定义命令？

4

2 回答 2

4

好的，所以我在更新中以这种方式解决了它，只是禁用了 lint 检查。

我已经检查了内置 cypress 可链接的一些原始 cypress 命令，并且具有相同的结构，所以我以相同的方式进行操作并且它可以工作。

// tslint:disable-next-line:no-namespace
declare namespace Cypress {
    interface Chainable<Subject = any> {
        selectDropdownValue(dropdown: string, value: string): Chainable<Subject>;
    }
}
于 2021-05-13T13:02:01.127 回答
3

如果您希望 IDE 为您的自定义命令获取 IntelliSense。看看这个文件。谢谢 https://github.com/cypress-io/cypress-example-todomvc#cypress-intellisense

于 2021-05-06T13:39:10.813 回答