I've recently added end-to-end tests using Protractor to my AngularJS application. I've run the tests locally and they all pass, however when I commit to GitHub and Travis for CI most of the tests fail.
I've noticed that the failing tests are those that require routing to other states (I'm using Angular UI Router).
scenarios.js
describe('Test', function () {
beforeEach(function () {
browser.get('/');
})
it('should open the user page', function () {
//browser.get("/");
browser.sleep(3000);
var button = element(by.id('createSession'));
button.click().then(function () {
browser.sleep(3000);
expect(browser.getLocationAbsUrl()).toEqual("/user");
});
});
it('should create a session and add a user', function () {
//browser.get("/");
browser.sleep(3000);
var button = element(by.id('createSession'));
button.click();
browser.sleep(3000);
var input = element(by.id('username'));
input.sendKeys('Simona');
var joinButton = element(by.id('joinSession'));
joinButton.click();
browser.sleep(3000);
expect(element(by.id('addStart')).isPresent()).toBe(true);
});
it('should join an existing session', function () {
//browser.get("/");
browser.sleep(3000);
var inputSession = element(by.id('sessionId'));
inputSession.sendKeys('testing123');
var joinSessionBtn = element(by.id('enterSession'));
joinSessionBtn.click();
browser.sleep(3000);
var input = element(by.id('username'));
input.sendKeys('Simona1');
var joinButton = element(by.id('joinSession'));
joinButton.click();
browser.sleep(3000);
expect(element(by.id('addStart')).isPresent()).toBe(true);
});
it('should add user to active users', function () {
//browser.get("/");
browser.sleep(3000);
var inputSession = element(by.id('sessionId'));
inputSession.sendKeys('testing123');
var joinSessionBtn = element(by.id('enterSession'));
joinSessionBtn.click();
browser.sleep(3000);
var input = element(by.id('username'));
input.sendKeys('Simona');
var joinButton = element(by.id('joinSession'));
joinButton.click();
browser.sleep(3000);
var user = element(by.id('Simona'));
expect(user.isPresent()).toBe(true);
});
it('should not join a non-existing session', function () {
//browser.get("http://localhost:8000/");
browser.sleep(3000);
var inputSession = element(by.id('sessionId'));
inputSession.sendKeys('simonovaSesija');
var joinSessionBtn = element(by.id('enterSession'));
joinSessionBtn.click();
browser.sleep(3000);
var warning = element(by.id('warningSession')).isDisplayed();
expect(warning).toBe(true);
});
it('should add an anonymous user on empty username input', function () {
//browser.get("http://localhost:8000/");
browser.sleep(3000);
var inputSession = element(by.id('sessionId'));
inputSession.sendKeys('testing123');
var joinSessionBtn = element(by.id('enterSession'));
joinSessionBtn.click();
browser.sleep(3000);
var input = element(by.id('username'));
input.sendKeys('');
var joinButton = element(by.id('joinSession'));
joinButton.click();
browser.sleep(4000);
var user = element(by.id('Anonymous'));
expect(user.isPresent()).toBe(true);
});
});
protractor.conf.js
exports.config = {
allScriptsTimeout: 11000,
specs: [
"scenarios.js"
],
capabilities: {
"browserName": "chrome"
},
baseUrl: "http://localhost:8000/",
framework: "jasmine",
jasmineNodeOpts: {
defaultTimeoutInterval: 30000
}
};
package.json
{
"name": "angular-seed",
"private": false,
"version": "0.0.0",
"description": "A starter project for AngularJS",
"repository": "https://github.com/angular/angular-seed",
"license": "MIT",
"devDependencies": {
"bower": "^1.7.7",
"http-server": "^0.9.0",
"jasmine-core": "^2.4.1",
"karma": "^0.13.22",
"karma-chrome-launcher": "^0.2.3",
"karma-firefox-launcher": "^0.1.7",
"karma-jasmine": "^0.3.8",
"karma-junit-reporter": "^0.4.1",
"protractor": "^3.2.2"
},
"scripts": {
"postinstall": "bower install",
"prestart": "npm install",
"start": "http-server -a localhost -p 8000 -c-1 ./app",
"pretest": "npm install",
"test": "karma start karma.conf.js",
"test-single-run": "karma start karma.conf.js --single-run",
"preupdate-webdriver": "npm install",
"update-webdriver": "webdriver-manager update",
"preprotractor": "npm run update-webdriver",
"protractor": "protractor e2e-tests/protractor.conf.js",
"update-index-async": "node -e \"var fs=require('fs'),indexFile='app/index-async.html',loaderFile='app/bower_components/angular-loader/angular-loader.min.js',loaderText=fs.readFileSync(loaderFile,'utf-8').split(/sourceMappingURL=angular-loader.min.js.map/).join('sourceMappingURL=bower_components/angular-loader/angular-loader.min.js.map'),indexText=fs.readFileSync(indexFile,'utf-8').split(/\\/\\/@@NG_LOADER_START@@[\\s\\S]*\\/\\/@@NG_LOADER_END@@/).join('//@@NG_LOADER_START@@\\n'+loaderText+' //@@NG_LOADER_END@@');fs.writeFileSync(indexFile,indexText);\""
},
"dependencies": {
"bower": "^1.7.9",
"express": "^4.14.0"
}
}
.travis.yml
language: node_js
node_js:
- '4.4'
addons:
firefox: "latest"
# blocklist
branches:
except:
- master
# safelist
branches:
only:
- dev
before_script:
- export CHROME_BIN=chromium-browser
- export DISPLAY=:99.0
- sh -e /etc/init.d/xvfb start
- npm start > /dev/null &
- npm run update-webdriver
- sleep 1 # give server time to start
script:
- node_modules/.bin/karma start karma.conf.js --no-auto-watch --single-run --reporters=dots
- node_modules/.bin/protractor e2e-tests/protractor.conf.js
As you can see, I'm using angular-seed's Angular template.
Any suggestions on why this is happening?