我在使用Protractor，Jasmine和Open Sauce测试Angular 2应用时遇到了一些麻烦。
我只想制作一系列基本测试，如下图所示。除了Microsoft Edge之外，测试在每个平台上都会成功。
以下是简单的测试：
app.po.ts文件：
import { browser, element, by } from 'protractor';
export class BookreaderPage {
navigateTo() {
browser.ignoreSynchronization = true;
return browser.get(browser.baseUrl);
}
getParagraphText() {
return element(by.css('app-root h1')).getText();
}
getBannerTitle() {
return element(by.css('app-root app-banner h1')).getText();
}
getBannerText() {
return element(by.css('app-root app-banner p')).getText();
}
}
app.e2e-spec.ts文件：
import { BookreaderPage } from './app.po';
describe('bookreader App', () => {
let page: BookreaderPage;
beforeEach(() => {
page = new BookreaderPage();
});
it('should display message saying app works', () => {
page.navigateTo();
expect(page.getParagraphText()).toEqual('APP WORKS!');
});
it('should display message saying banner title', () => {
page.navigateTo();
expect(page.getBannerTitle()).toEqual('BANNER TITLE');
});
it('should display message saying banner works', () => {
page.navigateTo();
expect(page.getBannerText()).toEqual('banner works!');
});
});
当在Edge上执行这些测试时，似乎找到了元素但是均衡不匹配。例如，使用Chrome，我得到以下结果：
[04:29:40] I/testLogger - [chrome Windows 10 #31-0] PID: 8245
[chrome Windows 10 #31-0] Specs: /home/travis/build/[secure]/bookreader/dist/out-tsc-e2e/app.e2e-spec.js
[chrome Windows 10 #31-0]
[chrome Windows 10 #31-0] [04:28:52] I/sauce - Using SauceLabs selenium server at https://ondemand.saucelabs.com:443/wd/hub
[chrome Windows 10 #31-0] Spec started
[chrome Windows 10 #31-0] [04:29:37] W/element - more than one element found for locator By(css selector, app-root h1) - the first result will be used
[chrome Windows 10 #31-0]
[chrome Windows 10 #31-0] bookreader App
[chrome Windows 10 #31-0] ✓ should display message saying app works
[chrome Windows 10 #31-0] ✓ should display message saying banner title
[chrome Windows 10 #31-0] ✓ should display message saying banner works
[chrome Windows 10 #31-0]
[chrome Windows 10 #31-0] Executed 3 of 3 specs SUCCESS in 3 secs.
[chrome Windows 10 #31-0] [04:29:39] I/sauce - SauceLabs results available at http://saucelabs.com/jobs/a377e39ebb074ad490b048df2a4cffb8
但是使用Microsoft Edge，我收到以下错误：
[04:29:43] I/testLogger - [MicrosoftEdge Windows 10 #81-0] PID: 8275
[MicrosoftEdge Windows 10 #81-0] Specs: /home/travis/build/[secure]/bookreader/dist/out-tsc-e2e/app.e2e-spec.js
[MicrosoftEdge Windows 10 #81-0]
[MicrosoftEdge Windows 10 #81-0] [04:28:52] I/sauce - Using SauceLabs selenium server at https://ondemand.saucelabs.com:443/wd/hub
[MicrosoftEdge Windows 10 #81-0] Spec started
[MicrosoftEdge Windows 10 #81-0] [04:29:40] W/element - more than one element found for locator By(css selector, app-root h1) - the first result will be used
[MicrosoftEdge Windows 10 #81-0]
[MicrosoftEdge Windows 10 #81-0] bookreader App
[MicrosoftEdge Windows 10 #81-0] ✗ should display message saying app works
[MicrosoftEdge Windows 10 #81-0] - Expected 'app works!' to equal 'APP WORKS!'.
[MicrosoftEdge Windows 10 #81-0] ✗ should display message saying banner title
[MicrosoftEdge Windows 10 #81-0] - Expected 'Banner title' to equal 'BANNER TITLE'.
[MicrosoftEdge Windows 10 #81-0] ✗ should display message saying banner works
[MicrosoftEdge Windows 10 #81-0] - Expected 'banner works!' to equal 'banner works!'.
[MicrosoftEdge Windows 10 #81-0]
[MicrosoftEdge Windows 10 #81-0] **************************************************
[MicrosoftEdge Windows 10 #81-0] * Failures *
[MicrosoftEdge Windows 10 #81-0] **************************************************
[MicrosoftEdge Windows 10 #81-0]
[MicrosoftEdge Windows 10 #81-0] 1) bookreader App should display message saying app works
[MicrosoftEdge Windows 10 #81-0] - Expected 'app works!' to equal 'APP WORKS!'.
[MicrosoftEdge Windows 10 #81-0]
[MicrosoftEdge Windows 10 #81-0] 2) bookreader App should display message saying banner title
[MicrosoftEdge Windows 10 #81-0] - Expected 'Banner title' to equal 'BANNER TITLE'.
[MicrosoftEdge Windows 10 #81-0]
[MicrosoftEdge Windows 10 #81-0] 3) bookreader App should display message saying banner works
[MicrosoftEdge Windows 10 #81-0] - Expected 'banner works!' to equal 'banner works!'.
[MicrosoftEdge Windows 10 #81-0]
[MicrosoftEdge Windows 10 #81-0] Executed 3 of 3 specs (3 FAILED) in 5 secs.
[MicrosoftEdge Windows 10 #81-0] [04:29:43] I/sauce - SauceLabs results available at http://saucelabs.com/jobs/d732c6621c7f4ccd9e8731c966cbb67a
起初，我认为这是因为，使用Edge，返回的响应是“app works！”使用Chrome（或Firefox或Safari）时，响应为“APP WORKS！”，但问题也会显示为小写文本。
这是我的protractor.sauce.conf.js文件：
var SpecReporter = require('jasmine-spec-reporter').SpecReporter;
var buildNumber = 'travis-build#'+process.env.TRAVIS_BUILD_NUMBER;
exports.config = {
sauceUser: process.env.SAUCE_USERNAME,
sauceKey: process.env.SAUCE_ACCESS_KEY,
allScriptsTimeout: 72000,
getPageTimeout: 72000,
specs: [
'../dist/out-tsc-e2e/**/*.e2e-spec.js',
'../dist/out-tsc-e2e/**/*.po.js'
],
multiCapabilities: [
{
browserName: 'safari',
platform: 'macOS 10.12',
name: "safari-osx-tests",
shardTestFiles: true,
maxInstances: 5
},
{
browserName: 'chrome',
platform: 'Linux',
name: "chrome-linux-tests",
shardTestFiles: true,
maxInstances: 5
},
{
browserName: 'chrome',
platform: 'macOS 10.12',
name: "chrome-macos-tests",
shardTestFiles: true,
maxInstances: 5
},
{
browserName: 'chrome',
platform: 'Windows 10',
name: "chrome-latest-windows-tests",
shardTestFiles: true,
maxInstances: 5
},
{
browserName: 'firefox',
platform: 'Linux',
name: "firefox-linux-tests",
shardTestFiles: true,
maxInstances: 5
},
{
browserName: 'firefox',
platform: 'macOS 10.12',
name: "firefox-macos-tests",
shardTestFiles: true,
maxInstances: 5
},
{
browserName: 'firefox',
platform: 'Windows 10',
name: "firefox-latest-windows-tests",
shardTestFiles: true,
maxInstances: 5
},
{
browserName: 'internet explorer',
platform: 'Windows 10',
name: "ie-latest-windows-tests",
shardTestFiles: true,
maxInstances: 5
},
{
browserName: 'MicrosoftEdge',
platform: 'Windows 10',
name: "edge-latest-windows-tests",
shardTestFiles: true,
maxInstances: 5
}
],
sauceBuild: buildNumber,
directConnect: false,
baseUrl: URL_TO_GITHUB_PAGE,
framework: 'jasmine',
jasmineNodeOpts: {
showColors: true,
defaultTimeoutInterval: 360000,
print: function() {}
},
useAllAngular2AppRoots: true,
beforeLaunch: function() {
require('ts-node').register({
project: 'e2e'
});
},
onPrepare: function() {
jasmine.getEnv().addReporter(new SpecReporter());
}
};
我的package.json文件：
{
"name": "bookreader",
"version": "0.0.0",
"license": "MIT",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test --code-coverage true --watch false && cat ./coverage/*/lcov.info | ./node_modules/coveralls/bin/coveralls.js",
"lint": "ng lint",
"pree2e": "webdriver-manager update --standalone false --gecko false",
"e2e": "protractor",
"build-gh-pages": "ng build --prod --base-href \"/bookreader/\"",
"deploy-gh-pages": "angular-cli-ghpages --repo=https://GH_TOKEN@MY_REPOSITORY --name=USERNAME --email=EMAIL"
},
"private": true,
"dependencies": {
"@angular/common": "^4.0.0",
"@angular/compiler": "^4.0.0",
"@angular/core": "^4.0.0",
"@angular/forms": "^4.0.0",
"@angular/http": "^4.0.0",
"@angular/platform-browser": "^4.0.0",
"@angular/platform-browser-dynamic": "^4.0.0",
"@angular/router": "^4.0.0",
"core-js": "^2.4.1",
"rxjs": "^5.1.0",
"zone.js": "^0.8.4"
},
"devDependencies": {
"@angular/cli": "1.0.0",
"@angular/compiler-cli": "^4.0.0",
"@types/jasmine": "2.5.38",
"@types/node": "~6.0.60",
"angular-cli-ghpages": "^0.5.0",
"codelyzer": "~2.0.0",
"jasmine-core": "~2.5.2",
"jasmine-spec-reporter": "~3.2.0",
"karma": "~1.4.1",
"karma-chrome-launcher": "~2.0.0",
"karma-cli": "~1.0.1",
"karma-coverage": "^1.1.1",
"karma-coverage-istanbul-reporter": "^0.2.0",
"karma-coveralls": "^1.1.2",
"karma-firefox-launcher": "^1.0.0",
"karma-jasmine": "~1.1.0",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "~5.1.0",
"ts-node": "~2.0.0",
"tslint": "~4.5.0",
"typescript": "~2.2.0"
}
}
有人有建议吗？任何帮助将非常感激！非常感谢！
编辑1：
在DOM中，文本打印为app works!，并以CSS大写显示。