赛普拉斯看不到自定义 cy。命令

Question

赛普拉斯无法导入自定义命令

命令.js

Cypress.Commands.add('generateToken', ({secret}) => {
    const totp = require('totp-generator');
    const token = totp(secret); 
    });

支持/index.js

import './commands'

测试规范

/// <reference types="Cypress" />

context('Actions', () => {
    beforeEach(() => {})
  })
    it('Main test', () => {
        cy.generateToken('XXXX');
    })

在 test.spec.ts 中， generateToken() 一直带有下划线，并且出现错误：

Property 'generateToken' does not exist on type 'cy'.

index.js 和 commands.js 没有从原始目录中移动。cypress.json 文件为空。

Answer 1

由于您的规范是一个打字稿文件，您是否为support/index.js?

他们的文档似乎在这里很好地概述了它。但与他们的示例唯一不同的是，您没有从中返回任何内容，generateToken因此我认为您无法将其放入全局Chainable接口中。

您可以尝试将其添加到support/index.d.ts文件中，看看它是否会对您大喊大叫

declare namespace Cypress {
  interface Chainable {
    generateToken({secret}: {secret: string}): void
  }
}

Answer 2

由于 nshirley 提出的答案对我不起作用，我发现了这个评论。它非常相似，但declare global在顶部添加，以在全局范围内声明这些自定义命令。

这是一个工作示例：

赛普拉斯/支持/commands.ts：

declare global {
  namespace Cypress {
    interface Chainable<Subject> {
      /**
       * Provides a working example
       */
      generateToken(secret: any): Cypress.Chainable<Element>;
    }
  }
}

const generateToken = (secret: any) => {
  // Your Code
};

Cypress.Commands.add("generateToken", generateToken);

在你的测试中你可以使用它：

cy.generateToken("Example");

正如您所看到的，您甚至可以为您的方法提供一些文档，但这完全是可选的。

Answer 3

2021年全面投入工作。

对于support/index.ts文件

import './commands'

对于support/commands.ts文件

Cypress.Commands.add('generateToken', generateToken);
function generateToken({secret}): void {
    const totp = require('totp-generator');
    const token = totp(secret); 
}

// this is another example.
Cypress.Commands.add('login', login);
function login(username: string, password: string): void {
    // steps for login 
}

declare namespace Cypress {
    interface Chainable<Subject> {
       generateToken({secret}): void;

       /**
        * This will log user in
        * @param email string
        * @param password string
        */
       login(email: string, password: string): void;
    }
}

对于test.spec.ts文件

cy.login("somebody@domain.com", "something");
cy.generateToken("Example");

其他答案都不适合我。我想在 VS Code 中提供类型支持，并且不想遇到cypress Property does not exist on type 'cy & EventEmitter'运行时错误。

我添加了另一个使用 JSDoc 支持登录的示例。

Answer 4

以下是我如何通过 TypeScript 查看自定义命令：

命令.ts

declare namespace Cypress {
  interface Chainable<Subject> {
    generateToken(secret: any): Cypres.Chainable<void>;
  }
}

function generateToken(secret: any): void {
  // Generate token
}

Cypress.Commands.add('generateToken', generateToken);

测试规格

cy.generateToken(secret);