如何使用 Typescript 在 Atom 中集成 Protractor 测试用例？答案

【问题标题】：How to integrate Protractor test cases in Atom using Typescript?如何使用 Typescript 在 Atom 中集成 Protractor 测试用例？
【发布时间】：2017-01-10 02:29:48
【问题描述】：

我已经为 atom 安装了 typescript，用于编写自动化的量角器脚本。

我的代码是用 Jasmine 框架编写的，因为量角器很好地支持它。

我用这个结构写的。

 describe('Sign in',function(){
     it ('Verify Modules Present', function(){
     loginPage.enterUsernameAndPasswordWithSignIn('a','b');
     browser.sleep(3000);
     var module = element(by.xpath("//*[@ng-reflect-router-link='My']"));
     browser.wait(protractor.ExpectedConditions.elementToBeClickable(module),
                                  8000).thenCatch(function () {
              assert.fail(' element is not click able');
      });
    var expectedModuleName = ["My", "X","Y", "Z" ];
    var testArray = ["My", "X","Y", "Z" ];;
    logger.log('info','Checking All modules');
    for (var i = 0; i < testArray.length;i++) {
      var moduleName = text.verifyText("//*[@ng-reflect-router-link='"+ testArray[i] + "']");
      expect(moduleName).toBe(expectedModuleName[i]);
    }
  logger.log('info','Checked All modules');
  });
});

我收到以下错误。

我的理解是：Typescript 无法找到 Jasmine 库。该怎么做？

我经过：https://angular.io/docs/ts/latest/testing/jasmine-testing-101.html

但找不到太多。我也安装了打字。但我不知道如何使用它。

如何将 Jasmine Framework 配置为 Protractor 的 atom 以便解决此错误？

如果不是这样，哪个编辑器可以这样做以及如何做到这一点？

请指导我..

【问题讨论】：

在规范顶部添加以下两行，甚至还包括 /// - /// import bb = require ('主干');
您能详细说明一下吗？

标签： typescript jasmine protractor atom-editor

【解决方案1】：

显然，其中一些问题（例如 require 和 loginPage）不一定与 Jasmine 有任何关系。但是，问题是这些是全局变量，TS 编译器找不到它们的声明。解决此问题的最简单方法是按以下方式在文件顶部声明每个：

declare var describe: any;

这将解决describe 和it 的问题。其他问题，例如require 将是因为您没有使用module import syntax。

【讨论】：

【解决方案2】：

您必须安装 jasmine 和 node 类型，以便打字稿识别它们。现在有更好的方法，不需要typings文件夹和typings.json。我们有相同的 @types 依赖项。

所以你可以通过以下步骤来做到这一点-

转到您的项目文件夹并安装依赖项 -

 npm install --save-dev @types/jasmine //this would install jasmine typings as a dev dependency in your package.json
 npm install --save-dev @types/node   //this would install node typings as a dev dependency in your package.json

安装后尝试使用tsc 或tsc -w 观看模式编译它，现在您应该不会看到那些TS 语法错误！

你必须从protractor/globals 导入browser 才能使用它的方法，像这样-

import {browser} from 'protractor/globals';

更多细节你可以查看我的代表protractor with typescript的初始设置，它使用黄瓜，你可以查看官方protractor-typescript example

【讨论】：

我没有让你兄弟.. npm install --save-dev @types/node 失败。我们可以聊聊吗？
我可以为 Visual Studio 代码准备好所有东西吗？使用 Jasmine 框架在 Typescripts 中编写 Protractor 测试脚本？
我尝试安装两者。我得到了@Types 文件夹，其中有 jasmine 和 node 文件夹。使用 import {browser} from 'protractor/globals' 正确导入浏览器；但是描述，它，期望仍然显示错误。请帮忙
你试过用tsc编译吗？它应该工作！有一些小故障，它在编辑器中显示错误，但实际上可以编译，打字稿人正在努力。同时试一试！
还要确保您使用的是最新的Typscript 2.0

【解决方案3】：

这并没有完全解决我的问题。除了安装茉莉类型（以上答案）

我必须打开 tsconfig.json 并确保 jasmine 在 compilerOptions 下的 types 列表中。例如 { "compileOnSave": false, "compilerOptions": { "outDir": "./dist/out-tsc", "baseUrl": "src", "sourceMap": true, "declaration": false, "moduleResolution": "node", "emitDecoratorMetadata": true, "experimentalDecorators": true, "allowJs": true, "target": "es5", "paths": { "environments": [ "./environments" ] }, "types": [ "node", "jasmine" ], "typeRoots": [ "node_modules/@types" ], "lib": [ "es2016", "dom" ] } } 添加"jasmine"作为类型后，错误立即在Atom中消失。

【讨论】：