Protractor tests Azure Pipelines - using Internet Explorer - azure-devops

We have a big set of automated tests using Protractor/Jasmine which work like a dream on Azure Pipelines. However, so far we've only used Chrome as the browser.
Now i have to run the same tests using Internet Explorer (11) but am getting no joy at all!!
Here's a part of my conf.js file that deals with the browser:
var HtmlReporter = require('protractor-beautiful-reporter');
var {SpecReporter} = require("jasmine-spec-reporter");
var jasmineReporters = require("jasmine-reporters");
exports.config = {
//seleniumAddress: `http://localhost:4444/wd/hub`,
framework: "jasmine2",
specs: ['specs/secureTrading/01_SecureTrading.js',
'specs/secureTrading/02_ST_Payments.js'
],
getPageTimeout: 40000,
allScriptsTimeout: 60000,
capabilities: {
'browserName': 'internet explorer',
'ignoreProtectedModeSettings': true,
'platform': 'ANY',
'version': '11',
args: ['--silent', '--no-sandbox', '--test-type=browser', '--lang=US', '--start-maximized'], //,'--headless', '--disable-gpu'
prefs: {
'download': {
'prompt_for_download': false,
'directory_upgrade': true,
'extensions_to_open': '',
'default_directory': process.cwd() + '/downloads/'
},
}
},
localSeleniumStandaloneOpts: {
jvmArgs: [
'-Dwebdriver.ie.driver=node_modules/protractor/node_modules/webdriver-manager/selenium/IEDriverServer3.14.0.exe'
]
},
directConnect: false,
seleniumArgs: ['-Dwebdriver.ie.driver=node_modules/protractor/node_modules/webdriver-manager/selenium/IEDriverServer3.14.0.exe'],
ignoreUncaughtExceptions: true,
onPrepare: function() {
Having looked at other postings, I've tried removing // from seleniumAddress:http://localhost:4444/wd/hub,` still errors, Changing DirectConnect makes no difference.
With the settings as above, this is the error message.
Any advice please?
Thanks
Additional Logs as per comment below.
Local:

Related

Set jasmine default timeout interval inside karma config file

My karma file looks like the following, I have around 900 test cases & some of them fail due to default timeout being set to 5000ms. I tried adding the following but it did not make a difference (same error, karma thinks the default value is still 5000ms):
jasmineNodeOpts: {
defaultTimeoutInterval: 50000
}
How can I fix this issue?
Karma file:
module.exports = function (config) {
config.set({
basePath: '',
frameworks: ['parallel', 'jasmine', '#angular-devkit/build-angular'],
plugins: [
require('karma-parallel'),
require('karma-jasmine'),
require('karma-chrome-launcher'),
require('karma-jasmine-html-reporter'),
require('karma-coverage-istanbul-reporter'),
require('#angular-devkit/build-angular/plugins/karma')
],
client: {
clearContext: false // leave Jasmine Spec Runner output visible in browser
},
coverageIstanbulReporter: {
dir: require('path').join(__dirname, 'coverage'), reports: ['html', 'lcovonly'],
fixWebpackSourcePaths: true
},
angularCli: {
environment: 'dev'
},
reporters: ['progress', 'kjhtml'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['Chrome'],
singleRun: true,
browserNoActivityTimeout: 60000,
parallelOptions: {
executors: Math.min(Math.ceil(require('os').cpus().length / 2), 6)
}
});
};
Since karma-jasmine version 2.0 you can now pass timeoutInverval directly in the config:
module.exports = function(config) {
config.set({
client: {
jasmine: {
timeoutInterval: 50000
}
}
})
}

Group all tests and display in browserstack

I am running my protractor tests on browserstack and noticed that the tests I run are marked as separate entries. I want to group them all into a single build.
I have added build capability to my protractor config file. But it doesn't seem to help.
Attaching my protractor configuration field. Appreciate your help.
Thanks
exports.config = {
specs: [
'./src/**/*.e2e-spec.ts'
],
browserstackUser: xx,
browserstackKey: xxx,
multiCapabilities: [{
browserName: 'chrome',
os: 'Windows',
os_version: '10',
'browswestack.debug': true,
project: 'protractor'
}, {
os: 'OS X',
os_version: 'High Sierra',
browserName: 'Safari',
'browswestack.debug': true,
project: 'protractor'
}],
build_number: 'local',
maxInstances: 2,
SELENIUM_PROMISE_MANAGER: false,
directConnect: false,
connectionRetryCount: 3,
connectionRetryTimeout: 90000,
baseUrl: 'http://localhost:4200',
framework: 'jasmine',
jasmineNodeOpts: {
showColors: true,
defaultTimeoutInterval: 30000,
print: _.noop
},
onPrepare: () => {
tsNode.register({
project: path.join(__dirname, './tsconfig.e2e.json')
});
let reporter = new SpecReporter();
jasmine.getEnv().addReporter(reporter);
}
};
EDIT : I fixed the problem. I was using build_number instead of build.
However , when I run the tests I noticed that the tests are getting appended. For instance if I run 5 tests , I could only see the last test as executed in browserstack. How should I fix this ?
Open a session on Automate Dashboard and under 'Input Capabilities', check if 'build' is visible.

How to pass arguments by command line for multicapabilities on protractor?

I need to pass headless arguments by command line.
In the begining I was working just with Chrome and I was using the following code to pass these arguments:
./node_modules/.bin/protractor "conf.js" --capabilities.chromeOptions.args=headless --capabilities.chromeOptions.args=disable-gpu --capabilities.chromeOptions.args=window-size=1248,1024
This is working properly, the problem is when I added firefox capabilities.
The qwestion: How can I pass this "headless" argument by command line with multiCapabilities?
I tried with:
./node_modules/.bin/protractor "conf.js" --multiCapabilities.1.chromeOptions.args=headless --multiCapabilities.1.chromeOptions.args=disable-gpu --multiCapabilities.1.chromeOptions.args=window-size=1248,1024 --multiCapabilities.0.moz:firefoxOptions=headless
But didn't work.
My config file:
exports.config = {
onPrepare: async function () {
console.log("Let's Start")
},
seleniumAddress: 'http://localhost:4444/wd/hub',
getPageTimeout: 100000,
allScriptsTimeout: 100000,
restartBrowserBetweenTests: true,
maxSessions: 2,
multiCapabilities: [{
browserName: 'firefox',
parallelCapability: false,
marionette: true,
"moz:firefoxOptions":{
//args: [ "--headless" ],
prefs:{
'pdfjs.disabled': true
}
},
'safebrowsing': {
'enabled': true,
}
}
,{
browserName: 'chrome',
parallelCapability: false,
'chromeOptions': {
prefs: {
download: {
'prompt_for_download': false,
'directory_upgrade': true,
'default_directory': process.cwd() + '/download/'
},
'safebrowsing': {
'enabled': true,
}
}
},
},
],
framework: 'custom',
frameworkPath: require.resolve('protractor-cucumber-framework'),
specs: [
'features/happyPath.feature'
],
cucumberOpts: {
require: [
'features/step_definitions/**/*.js',
'lib/hooks.js'],
profile: false,
'no-source': true
}
};
You have to specify the browser name
--multiCapabilities.0.browserName chrome
--multiCapabilities.1.browserName firefox

Protractor resolves promises with Chrome, but not Phantom

When running end to end tests with Protractor, I'm seeing promises in my tests being resolved when run with Chrome. But when run with Phantom, the callbacks are never executed, and the test eventually times out with the message Error: Timeout - Async callback was not invoked within timeout specified by jasmine.DEFAULT_TIMEOUT_INTERVAL.
My protractor.config.js file looks like:
exports.config = {
baseUrl: 'http://localhost:3000/',
suites: {
// ...
},
directConnect: !(process.env.NODE_ENV === 'CI'),
exclude: [],
multiCapabilities: [{
browserName: process.env.NODE_ENV === 'CI' ? 'phantomjs' : 'chrome',
'phantomjs.cli.args': ['--web-security=false',
'--ignore-ssl-errors=true'
]
}],
allScriptsTimeout: 110000,
getPageTimeout: 100000,
framework: 'jasmine2',
jasmineNodeOpts: {
isVerbose: false,
showColors: true,
includeStackTrace: false,
defaultTimeoutInterval: 400000,
print: function() {}
},
}
With this configuration, a test like the following will execute its callback for Chrome, but not for Phantom:
let targetUrl = '/foo';
it ('should resolve the route properly', function (done) {
browser.getCurrentUrl().then(function (url) {
console.log("****"); // This is printed in Chrome, but not Phantom
expect(url).toContain(targetUrl);
done();
})});
Node Modules Versions
Protractor: 5.0.0
Phantom: 4.0.0
PhantomJS 2.1.7
PhantomJS-prebuilt: 2.1.14
Webdriver Manager (inside Protractor): 11.1.1
Any ideas?

How to get Browserify, Babel, and Coverage working together in Karma?

I'm growing weary of trying to get node libraries to work properly together, but it's part of the job, so here goes.
I have an ES6 application intended for a browser. I have a set of unit tests for my files that I'm bringing up from when my application was written in ES5. I use Browserify to handle importing/exporting modules and bundling my distro. This works fine when running the application in the browser. I can successfully Browserify the source and spec files and run the tests, and the tests pass. I'm very close to getting this working.
The only issue is the coverage. The closest I've come is showing coverage on the karma-browserify generated files, which each look like this:
require('/absolute/path/to/the/corresponding/file.js');
And the coverage obviously shows as 100% for all files, because each one is just one line.
This is my karma.conf.js:
import babelify from 'babelify';
import isparta from 'isparta';
import paths from './paths';
var normalizeBrowserName = (browser) => browser.toLowerCase().split(/[ /-]/)[0];
export default function(config) {
config.set({
basePath: '..',
browsers: ['PhantomJS'],
frameworks: ['browserify', 'jasmine'],
files: paths.test.files,
preprocessors: {
'app/**/*.js': ['browserify', 'sourcemap', 'coverage'],
[paths.test.testFiles]: ['babel'],
},
plugins: [
'karma-babel-preprocessor',
'karma-browserify',
'karma-coverage',
'karma-jasmine',
'karma-junit-reporter',
'karma-phantomjs-launcher',
'karma-sourcemap-loader',
],
autoWatch: false,
colors: false,
loggers: [{ type: 'console' }],
port: 9876,
reporters: ['progress', 'dots', 'junit', 'coverage'],
junitReporter: {
outputFile: paths.test.resultsOut,
suite: '',
},
browserify: {
debug: true,
noParse: paths.js.noparse(),
configure: (bundle) => {
bundle.once('prebundle', () => bundle.transform(babelify.configure({ ignore: 'lib/!**!/!*' })));
},
},
coverageReporter: {
instrumenters: { isparta },
instrumenter: {
[paths.test.cover]: 'isparta',
},
reporters: [
{ type: 'text', },
{ type: 'html', dir: paths.test.coverageOut, subdir: normalizeBrowserName },
{ type: 'cobertura', dir: paths.test.coverageOut, subdir: '.', file: 'coverage.xml' },
],
},
logLevel: config.LOG_DEBUG,
});
};
I really have no idea how any of these libraries work, so I don't know where to start in debugging this. I understand that the ordering of the preprocessors matters, so that Browserify runs on the source files, feeds the resulting link files into the source map generator, then the source map generator feeds the resulting whatever into karma-coverage. But there's some loss of communication between Browserify and whatever handles the coverage. Isparta (which uses istanbul behind the scenes) has no idea that browserify is running, and I don't know what it sees.
If anyone has any experience with testing modularized ES6 WITH proper code coverage, please let me know if I'm on the right track or if I should try something else.
This is the configuration that worked for me, note that I am using browserify-istanbul rather than isparata.
var istanbul = require('browserify-istanbul');
module.exports = function(config) {
config.set({
basePath: '',
frameworks: ['browserify', 'mocha'],
files: [
'test/**/*Spec.js'
],
exclude: [
'**/*.sw?'
],
preprocessors: {
'test/**/*Spec.js': ['browserify', 'coverage']
},
browserify: {
debug: true,
transform: [
['babelify', {
ignore: /node_modules/
}],
istanbul({
ignore: ['test/**', '**/node_modules/**']
})
],
extensions: ['.jsx']
},
babelPreprocessor: {
options: {
sourceMap: 'inline'
},
sourceFileName: function(file) {
return file.originalPath;
}
},
coverageReporter: {
dir: 'coverage/',
reporters: [
{ type: 'text-summary' }
]
},
browserNoActivityTimeout: 180000,
reporters: ['coverage', 'progress'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['Chrome'],
singleRun: false
});
};
it was a massive pain to get working.
hope that helps
HOW TO: Karma + Babel + React + Browserify + Istanbul
I THINK I GOT IT.
If I don't, ping me gus+overflow#mythril.co
Not sure if the previous answer not working has to do with using jasmine instead of mocha but I got it working with these settings.
Required Packages: apart from the obvious (React, Karma, Jasmine, Browserify)
isparta - an Istanbul instrumenter for ES6
browserify-istanbul - a browserify transform
babelify - another browserify transform
babel - JS compiler
babel-preset-2015 - ES6 compile preset
babel-preset-react - React compile preset
Create a .babelrc file in your root dir.
I was very confused as to where to place babel options within the tools, but most (and these) babel tools will look for a .babelrc
{
"presets": ["es2015", "react"],
"sourceMap": "inline"
}
karma.config.js:
const isparta = require('isparta');
const istanbul = require('browserify-istanbul');
module.exports = function (config) {
config.set({
basePath: '',
browsers: ['Firefox', 'Chrome', 'PhantomJS', 'Safari'],
captureConsole: true,
clearContext: true,
colors: true,
files: [
// you need this for Phantom
'node_modules/phantomjs-polyfill/bind-polyfill.js',
// import any third party libs, we bundle them in another gulp task
'./build/libs/vendor-bundle.js',
// glob for spec files
'__PATH_TO_SPEC_FILES_/*.spec.js'
],
frameworks: ['jasmine', 'browserify'],
logLevel: config.LOG_INFO,
preprocessors: {
// I had to NOT include coverage, the browserify transform will handle it
'__PATH_TO_SPEC_FILES_/*.spec.js': 'browserify'
},
port: 9876,
reporters: ['progress', 'coverage'],
browserify: {
// we still use jQuery for some things :(
// I don't think most people will need this configure section
configure: function (bundle) {
bundle.on('prebundle', function () {
bundle.external(['jquery']);
});
},
transform: [
// this will transform your ES6 and/or JSX
['babelify'],
// (I think) returns files readable by the reporters
istanbul({
instrumenter: isparta, // <--module capable of reading babelified code
ignore: ['**/node_modules/**', '**/client-libs/**']
})
],
// our spec files use jsx and so .js will need to be compiled too
extensions: ['.js', '.jsx'],
// paths that we can `require()` from
paths: [
'./node_modules',
'./client-libs',
'./universal'
],
debug: true
},
coverageReporter: {
reporters: [
{ type: 'html', dir: 'coverage/Client' },
{ type: 'text-summary' }
]
}
});
};
With Karma, I think it would look something like this(?):
// Karma configuration
'use strict';
let babelify = require( 'babelify' );
let browserify = require('browserify');
let browserifyBabalIstanbul = require('browserify-babel-istanbul');
let isparta = require('isparta');
browserify: {
debug: true,
transform: [
browserifyBabalIstanbul({
instrumenter: isparta,
instrumenterConfig: { babel: { presets: ["es2015"] } },
ignore: ['**/node_modules/**', '**/unitest/**']
}),
[ babelify, { presets: ["es2015"] } ]
]
},
see the following link : Find a good way to get a coverage report with karma?