typescript 用页面对象用打字稿编写的量角器 e2e 测试
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/33694246/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Protractor e2e test written in typescript with page object
提问by Bj?rn S?rensen
I'm trying to write some e2e tests in typescript using Protractor and Jasmine syntax using a Page Object to abstract the DOM structure from the tests.
我正在尝试使用 Protractor 和 Jasmine 语法在打字稿中编写一些 e2e 测试，使用页面对象从测试中抽象出 DOM 结构。
When running protractor I get an error telling me that my my page object is not a function.
运行量角器时，我收到一个错误，告诉我我的页面对象不是函数。
Here is the page object as a typescript class: home.po.spec.ts
这是作为打字稿类的页面对象： home.po.spec.ts
module Tests.e2e.Home {
export class HomePage {
emailInput;
constructor() {
this.emailInput = element(by.model('email'));
}
get(): void {
browser.get('https://localhost:44300');
}
get email(): string {
return this.emailInput.getText();
}
set email(value: string) {
this.emailInput.sendKeys(value);
}
}
}
This is my test: home.e2e.spec.ts
这是我的测试： home.e2e.spec.ts
///<reference path="home.po.spec.ts"/>
module Tests.e2e.Home {
describe('home view', () => {
it('should mark invalid email in field', () => {
// arrange
var homePage = new HomePage();
homePage.get();
var emailField = homePage.emailInput;
// act
homePage.email = 'some invalid email';
// assert
expect(emailField.getAttribute('class')).toMatch('ng-invalid');
});
});
}
I'm writing the tests in Visual Studio 2013 and running protractor with a gulp task on nodejs.
我正在 Visual Studio 2013 中编写测试，并在 nodejs 上使用 gulp 任务运行量角器。
Here is the error message:
这是错误消息：
Starting selenium standalone server...
[launcher] Running 1 instances of WebDriver
Selenium standalone server started at http://192.168.5.153:23704/wd/hub
F
Failures:
1) home view should mark invalid email in field
Message:
TypeError: Home.HomePage is not a function
Stacktrace:
TypeError: Home.HomePage is not a function
at [object Object].<anonymous>(C:\Users\BSO\Documents\Git repos\app\Prese
ntation.Web\Tests\home.e2e.spec.ts:5:28)
at C: \Users\BSO\AppData\Roaming\npm\node_modules\protractor\node_modules\jas
minewd\index.js:94:14
at goog.async.run.processWorkQueue(C:\Users\BSO\AppData\Roaming\npm\node_mo
dules\protractor\node_modules\selenium - webdriver\lib\goog\async\run.js:130:15)
From: Task: Asynchronous test function: it()
at[object Object].<anonymous> (C:\Users\BSO\AppData\Roaming\npm\node_module
s\protractor\node_modules\jasminewd\index.js:93:33)
at[object Object].<anonymous> (C:\Users\BSO\AppData\Roaming\npm\node_module
s\protractor\node_modules\minijasminenode\lib\async - callback.js:45:37)
at[object Object].jasmine.Block.execute(C:\Users\BSO\AppData\Roaming\npm\n
ode_modules\protractor\node_modules\minijasminenode\lib\jasmine - 1.3.1.js:1174:17
)
at[object Object].jasmine.Queue.next_(C:\Users\BSO\AppData\Roaming\npm\nod
e_modules\protractor\node_modules\minijasminenode\lib\jasmine - 1.3.1.js:2209:31)
at[object Object]._onTimeout(C:\Users\BSO\AppData\Roaming\npm\node_modules
\protractor\node_modules\minijasminenode\lib\jasmine - 1.3.1.js:2199:18)
Error
at[object Object].<anonymous> (C:\Users\BSO\Documents\Git repos\app\Prese
ntation.Web\Tests\home.e2e.spec.ts:3:9)
at[object Object].jasmine.Env.describe_(C:\Users\BSO\AppData\Roaming\npm\n
ode_modules\protractor\node_modules\minijasminenode\lib\jasmine - 1.3.1.js:913:21)
at[object Object].jasmine.Env.describe(C:\Users\BSO\AppData\Roaming\npm\no
de_modules\protractor\node_modules\minijasminenode\lib\jasmine - 1.3.1.js:898:15)
at describe (C:\Users\BSO\AppData\Roaming\npm\node_modules\protractor\node_m
odules\minijasminenode\lib\jasmine - 1.3.1.js:658:27)
at e2e.Home.e2e.Home(C:\Users\BSO\Documents\Git repos\app\Presentation.We
b\Tests\home.e2e.spec.ts:2:5)
at Tests.e2e.Tests.e2e(C:\Users\BSO\Documents\Git repos\app\Presentation.
Web\Tests\home.e2e.spec.ts:16:2)
at Tests (C:\Users\BSO\Documents\Git repos\app\Presentation.Web\Tests\home
.e2e.spec.ts:16:2)
at Object.<anonymous>(C:\Users\BSO\Documents\Git repos\app\Presentation.W
eb\Tests\home.e2e.spec.ts:16:2)
Finished in 0.031 seconds
1 test, 1 assertion, 1 failure
Shutting down selenium standalone server.
[launcher] 0 instance(s) of WebDriver still running
[launcher] chrome #1 failed 1 test(s)
[launcher] overall: 1 failed spec(s)
[launcher] Process exited with error code 1
Can anyone help me with this? How can I make the test file reference
谁能帮我这个？如何制作测试文件参考
Solution
解决方案
The solution is to not use internal modules in TypeScript for this.
By changing to commonjs module system and use typescripts import something = require('path to someting')it works as expected.
解决方案是不要为此在 TypeScript 中使用内部模块。通过更改为 commonjs 模块系统并使用打字稿，import something = require('path to someting')它可以按预期工作。
Here is a sample of the setup.
The page object home.po.spec.ts:
这是设置示例。页面对象home.po.spec.ts：
class HomePage {
getPage(): void {
browser.get('https://localhost:44300/');
}
nameElement = element(by.id('name'));
get nameInput(): string {
var value: string;
this.nameElement.getAttribute('value').then(v => value = v);
return value;
}
set nameInput(value: string) {
this.nameElement.sendKeys(value);
}
}
export = HomePage;
And the test spec home.e2e.spec.ts:
和测试规范home.e2e.spec.ts：
import HomePo = require('./home.po.spec');
describe('home view', () => {
it('name input should be writeable', () => {
// arrange
var pageObject: HomePo = new ItProjectEditPo();
pageObject.getPage();
// act
pageObject.nameInput = 'SomeName';
// assert
expect(pageObject.nameInput).toBe('SomeName');
});
});
Some notes on the solution. The page object needs to resolve the element getAttribute promise when using TypeScript properties, getAttribute returns a promise but sendKeys takes a string.
关于解决方案的一些说明。页面对象在使用 TypeScript 属性时需要解析元素 getAttribute 承诺，getAttribute 返回一个承诺但 sendKeys 接受一个字符串。
TypeScript modules documentation is here. It took me some time to understand it, but it makes good sense now. By using this module structure it is also possible to import nodejs packages.
TypeScript 模块文档在这里。我花了一些时间来理解它，但现在它很有意义。通过使用这种模块结构，还可以导入 nodejs 包。
采纳答案by gilamran
You probably told protractor to include all your *.spec.tsfiles, so protractor will include them by the order of the abc. This means that the file home.e2e.spec.tswill be included before the home.po.spec.tsfile.
您可能告诉量角器包含所有*.spec.ts文件，因此量角器将按 abc 的顺序包含它们。这意味着该文件home.e2e.spec.ts将被包含在该home.po.spec.ts文件之前。
You have two options:
您有两个选择：
- Change the order of the files (Bad idea).
- Tell TypeScript to export into commonjs module format, so it will be possible to do
importto the page object (Instead of reference files)
- 更改文件的顺序（坏主意）。
- 告诉 TypeScript 导出为 commonjs 模块格式，因此可以对
import页面对象（而不是参考文件）进行操作
There's another issue that you didn't see: You initialized the emailInputin the constructor but called getafter it was initialized...
还有一个您没有看到的问题：您emailInput在构造函数中初始化了，但get在初始化后调用了...
