如何在 Visual Studio Code 中使用 Typescript 和 Jasmine 框架编写 Protractor 测试脚本？

Posted 2023-03-13

【中文标题】如何在 Visual Studio Code 中使用 Typescript 和 Jasmine 框架编写 Protractor 测试脚本？

【英文标题】：How to write Protractor test scripts using Typescript along with Jasmine framework in Visual studio Code?

【发布时间】：2017-01-13 21:07:31

【问题描述】：

我的项目正在从独立到 Web，我们的新网站是在 AngularJS 中创建的，所以 Protractor 是测试自动化选择的工具。

我想将 Typescript 与 Jasmine 和 Node 的依赖项集成，这样我就不会收到诸如

之类的错误

cannot find name Describe
cannot find name it
cannot find name Expect

谁能告诉我如何添加 Jasmine 和 Protractor 依赖项，这样当我点击 ctrl + 空格时，我将获得所有可用选项。

我已经安装了 Typescript。而且我得到了量角器依赖项，例如浏览器、元素等。

describe,it,expect (Jasmine stuffs) 我应该怎么做？

【问题讨论】：

检查我在这个问题中的答案。它不完全相同，但我相信你有同样的问题。您需要 jasmine 的类型定义文件..***.com/questions/39058504/…

在哪里可以找到 jasmine.d.ts 文件？我遇到了与balaji 相同的错误。

/typings/main/ambient/jasmine/jasmine.d.ts 没有这样的路径。

***.com/questions/40284366/… 谁能帮我解决这个问题？

【参考方案1】：

我同意给出的答案。只是想和你分享一个技巧。

您不再需要将 Typescript 代码转换为 JavaScript。

创建一个launch.js 文件

require('ts-node').register(
  compilerOptions: 
    module: 'commonjs'
  ,
  disableWarnings: true,
  fast: true
);
exports.config = require('./config/protractor.conf.ts').config;

然后开始量角器执行，例如：

> protractor launch 

每次更改打字稿文件时，您都可以免于转译的麻烦。

测试愉快！

【参考方案2】：

我每天都使用 Visual Studio Code 来编写我的脚本，它是我目前最喜欢的 Protractor 编辑器，因为它内置了对 TypeScript 的支持！

以下是我想到的可以帮助您设置框架的事情-

下载最新的VS Code版本-https://code.visualstudio.com/download 全局安装打字稿npm install -g typescript 全局安装量角器npm install -g protractor 创建您的项目文件夹

为 git、node 和 typescript 设置项目文件夹 -

npm init -f // will create default package.json stating its nodejs project
git init  // will create .git file, you project is now git project
tsc --init  // will create tsconfig.json stating its typescript project

安装类型和开发依赖项-

npm install --save-dev protractor // this will install protractor as a dev dependency
npm install --save-dev typescript // this will install typescript as a dev dependency
npm install --save-dev @types/jasmine // jasmine typings
npm install --save-dev @types/node    // node typings

此时您已经设置了基本的protractor-typescript 项目，您可以在package.json 中看到所有类型和依赖项。现在你可以编写你的打字脚本了:)。

现在通过运行编译你的脚本 -

tsc or tsc -w 

编译成功后会生成所有的javascript文件。

跑步量角器

protractor config.js

您还可以设置您的 vs 代码以使用我在这里提到的量角器进行调试 - Protractor -VS Code Debugging

更多详情请参考TypeScript Tutorial,Protractor API

您观察到的 Typescript 错误是由于 VS Code 无法识别全局 typescript 2.0 版本。

要解决这个打开vscode去preferences--> user settings--> settings.json会被打开并输入高亮显示的路径，如图

保存您的文件并重新启动 VSCode 现在您可以开始了:)

【讨论】：

我按照你建议的所有步骤，Ram。我创建了我的第一个文件为 test.ts。它仍然说找不到名称“描述”并且找不到“它”。我添加了屏幕截图。请看。

从'D:/nsWeb/node_modules/protractor/globals'导入$；这是选项吗？

无需提供绝对路径，您可以只提供import $ from 'protractor/globals' 和您看到的打字稿错误，这是一个存在的问题，他们正在处理它，您会看到它会显示为这样，但它实际上编译成功，这将在即将发布的版本中修复！

我的描述错误现在也消失了... Yupieeee。非常感谢公羊。真的，我很感激你从头开始的努力。我会一直联系你寻求帮助。我可以吗？

现在可以直接导入了-` import $ from 'protractor' `