javascript - 迁移到 TypeScript。为什么我的功能无法识别？

Question

我正在尝试将工作中的 JavaScript 项目迁移到 TypeScript。该项目使用 nightwatch.js

这是我的主要测试课程：

declare function require(path: string): any;

import * as dotenv from "dotenv";
import signinPage = require("../built/pages/signinPage.js");
import instancesPage = require("../built/pages/instancesPage.js");
dotenv.config();

module.exports = {
    'User can sign in'(client) {

        console.log("Sign in as email: " + process.env.EMAIL);

        signinPage
            //   .navigate()
            .signin(process.env.EMAIL, process.env.PASSWORD);

        // give it time to load

        client.pause(5000);

        instancesPage.expect.element('@homepageWelcomeTitle').text.to.contain('Welcome to the CJDocs Home!');

        client.end();
    }
}

这是 pageObject，包含有问题的函数：

  module.exports = {  
  signin: function(email, password) {
    return this
      .waitForElementVisible('@emailInput')
      .setValue('@emailInput', email)
      .setValue('@passwordInput', password)
      .waitForElementVisible('@signinButton')
      .click('@signinButton')
  },
  elements: {
    emailInput: {
      selector: 'input[type=email]'
    },
    passwordInput: {
      selector: 'input[name=password]'
    },
    signinButton: {
      selector: 'button[type=submit]'
    }
  }
};

当我运行这个（使用 NPM 测试从终端运行）时，我得到一个错误：

TypeError: signinPage.signin is not a function

据我所知， signinPage.signin 是一个函数。

为什么它无法识别我的功能？

标签： javascripttypescriptnpm

Answer 1

这段代码仍然是非常多的 JS/ES5 而不是 TS。尝试更改import signinPage为import * as signinPage. 也许这有帮助。

但实际上我建议查找 ES6 / TS 功能，例如类。所以制作signinPage.ts：

export default class signinPage {
  signin(email, password) {
    return this
      .waitForElementVisible('@emailInput')
      .setValue('@emailInput', email)
      .setValue('@passwordInput', password)
      .waitForElementVisible('@signinButton')
      .click('@signinButton')
  }
  get elements() {
    return {
      emailInput: {
        selector: 'input[type=email]'
      },
      passwordInput: {
        selector: 'input[name=password]'
      },
      signinButton: {
        selector: 'button[type=submit]'
      }
    }
  }
}

然后将您的导入更改为import singinPage from "../src/pages/signinPage"

所以你从 TS 文件指向另一个 TS 文件，但你不需要 .ts 扩展名。