with protractor how to setup internet explorer configuration? - windows

I am using protractor 1.3.1 and running iedriverserver.exe 2.43.0.0 with IE11 installed (windows).
This is my spec:
describe('quick test IE driver', function () {
it('should go to ng homepage', function () {
browser.driver.get('https://angularjs.org/');
var title =element(by.css('h1')).getText();
expect(title).toBe('HTML enhanced for web apps!');
});
});
And this is my protractor.conf.js:
exports.config = {
// The address of a running selenium server.
//seleniumAddress: 'http://localhost:4444/wd/hub',
capabilities: {
'browserName': 'internet explorer',
'platform': 'ANY',
'version': '11'
},
// Spec patterns are relative to the current working directly when
// protractor is called.
specs: ['main.spec.js'],
// Options to be passed to Jasmine-node.
jasmineNodeOpts: {
showColors: true,
defaultTimeoutInterval: 30000,
isVerbose:true,
includeStackTrace:true
}
};
getting this error though, any ideas for a solution:
UnknownError: The path to the driver executable must be set by the webdriver.ie.driver system property;

Update web manager for IE
First step is to update the ie webdriver using webdriver manager.Open command prompt and run the command given below
webdriver-manager update --ie
Go to npm location In this step move to the NPM_LOCATION(folder where npm is installed at your system. Move to the following path "NPM_LOCATION\node_modules\protractor\selenium" At this location check that IEDriverServer.exe is present or not.
Change for IE in conf.js
// conf.js exports.config = { seleniumAddress: 'http://localhost:4444/wd/hub', specs: ['specs.js'], capabilities: {
'browserName': 'internet explorer' // conf for internet explorer } }
// spec.js describe('Protractor Demo App', function() { it('should have a title', function() {
browser.get('http://juliemr.github.io/protractor-demo/');
expect(browser.getTitle()).toEqual('Super Calculator'); }); });
Now run protractor conf.js
Note: Make sure you restart server by -->webdriver-manager start
taken from: http://protractorsupport.blogspot.com/2015/05/use-protractor-with-internet-explorer.html

According to the protractor config doc, the config value "seleniumArgs" is deprecated.
So, to have a single answer with all the info, here are the simplified steps:
Install Protactor globally:
npm install -g protractor
Run webdriver-manager update --ie to update the Selenium drivers that Protactor uses. Be aware if you are running the global webdriver-manager or the local webdriver-manager (i.e ./node_modules./bin/webdriver-manager update help); they will unzip the drivers at separate locations; only the local will unzip in [Project dir]
Take a look at the log of the previous command. It must show that the drivers were unzipped at a particular folder. Go to that folder and locate the IEDriverServer. In my case it was: "[Project dir]\node_modules\protractor\node_modules\webdriver-manager\selenium\IEDriverServer_x64_X.XX.X.exe. You will need to give the relative path to this file in the next step.
Inside your conf.js file, add the following keys & values. Note the use of localSeleniumStandaloneOpts, which means you should remove the property seleniumAddress if you have it:
multiCapabilities : [
{
'browserName' : 'chrome'
}, {
'browserName' : 'internet explorer'
}
],
localSeleniumStandaloneOpts : {
jvmArgs : ["-Dwebdriver.ie.driver=<RELATIVE PATH TO IE DRIVER>"] // e.g: "node_modules/protractor/node_modules/webdriver-manager/selenium/IEDriverServer_x64_X.XX.X.exe"
},
That was all I needed to do. I don't start the server beforehand, I simply run protactor conf.js. Easier now, I guess.

Download the IEDriverServer.exe
Please specify the same in your config file
seleniumArgs: ['-Dwebdriver.ie.driver=<path to IEDriverServer.exe>']

I was looking around this question for few hours, the best way seems to be:
1) download
webdriver-manager --ie update
This should download the driver from the google.. selenium ... release folder and place it directly in the good place in your npm local repository.
2) setup in config.js file of your tests:
...
multiCapabilities: [
//{
// browserName: 'chrome',
// version: 'ANY'
//},
//{
// browserName: 'firefox',
// version: 'ANY'
//},
{
browserName: 'internet explorer',
version: 'ANY'
},
],
// For some IE functions you may need to specify defaultTimeoutInterval
...
3) setup IE:
follow this post
http://jimevansmusic.blogspot.fr/2012/08/youre-doing-it-wrong-protected-mode-and.html
PS: about the "protected mode" setup of IE, it's important to have the same setup for all zones. I prefer to have protected mode 'on' for all zone
4) patch the registry
as described here: http://heliumhq.com/docs/internet_explorer
[HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Internet Explorer\MAIN\FeatureControl\FEATURE_BFCACHE]
"iexplore.exe"=dword:00000000
5) IE 11 update break the way the system work:
My lastest issue was "the server did not provide any stack trace ...." this is due to an update of the 17th of Dec 2014. Uninstall it and then it's good.
https://code.google.com/p/selenium/issues/detail?id=3390
crazy path to make it running. It cannot be like this for a long run, please comment my post with your experiences/feedbacks.
Richard

Here is my config file:
exports.config = {
seleniumAddress: 'http://127.0.0.1:4444/wd/hub',
capabilities: {
'browserName': 'internet explorer',
},
framework: 'jasmine',
// Spec patterns are relative to the current working directory when
// protractor is called.
specs: ['your_spec_file.js'],
};
The steps to run in IE :
Need two terminals in Visual Studio Code,
In the first terminal, Run command "webdriver-manager start" to start selenium server.
In the second terminal, Run your js config file as :
Protractor conffile_name.js
This will successfully start Internet explorer.
Thanks

Related

Browsersync - How to choose which installation of browser to run?

I've just installed Firefox Dev Edition, and I don't know how to tell browsersync to start with it when I launch it.
I know there is the browser option in which I can specify "firefox", but how can I differenciate one FF installation from one other ?
The issue would be the same if I had various regular FF installed (eg a 3.5, a 48.x and a 50.x).
I can always open manually the right FF and load the page after browsersync started, but I would like it to do it manually (and not to be opened in my regular non-dev FF).
In fact, it was quite easy: if you put the absolute path to an executable file in the browser option, it takes it smoothly.
So options should be something like :
{ port: 9000,
server: {
baseDir: [...
],
routes: {
'/bower_components': 'bower_components',
'/node_modules': 'node_modules',
'/temp': 'temp'
}
},
logLevel: 'info',
notify: true,
browser: 'C:\\Program Files (x86)\\Firefox Developer Edition\\firefox.exe',
reloadDelay: 0 //1000
}

How to debug server side TypeScript code in WebStorm

Comparing this to Visual Studio Code all you need to do is allow source maps and VSCode will debug TypeScript however I can't achieve the same on WebStorm.
I can easily debug server side JavaScript in WebStorm but not TypeScript
For anyone else wrestling with debugging TypeScript in WebStorm/IDEA, I had similar frustrations as OP (possibly for different reason). My issue was simply that I didn't set the working directory to the dist folder in the node run configuration. I am running tests in Jest and assumed the working dir should be the root of my project. Set it to dist and debugging started working!
Further info...
Source .ts files in src
Typescript version: 2.0.3
File tsconfig.json:
{
"compilerOptions": {
"jsx": "react",
"module": "commonjs",
"noImplicitAny": false,
"outDir": "dist",
"preserveConstEnums": true,
"removeComments": true,
"sourceMap": true,
"target": "es6",
"moduleResolution": "node"
},
"exclude": [
"node_modules",
"dist"
]
}
Jest config (in package.json):
"jest": {
"scriptPreprocessor": "<rootDir>/node_modules/ts-jest/dist/preprocessor.js",
"testRegex": "(/__tests__/.*|\\.(test|spec))\\.(ts|tsx)$",
"moduleFileExtensions": [
"ts",
"tsx",
"js"
]
}
Run configuration...
Working directory: <project_root>/dist
Javascript file: ../node_modules/jest-cli/bin/jest.js
Application params: --runInBand
Hope it helps!
was trying to find a way to let Webstorm/Intellij to watch the TS file change and restart server in debug mode. Looks like ts-node-dev which IHMO is faster than nodemon in terms of live-reload because it shares Typescript compilation process between restarts.
npm i ts-node-dev --save-dev
Then in your Run/Debug Configuration, add a node.js config with below params:
JavaScript file ---> node_modules/ts-node-dev/lib/bin.js
Applicationi parameters ---> --respawn -- src/script/local.server.ts
Now save the config and run with Debug, you should be able to set break point as well as live reload server on any TS code change.
I wrapped up a small library for this if you happen to develop with aws lambda
https://github.com/vcfvct/ts-lambda-local-dev
Just want to add what worked for me with Webstorm 2021.1.1
I found the easiest way is to go to your package.json and right click the green triangle next to the npm script you want to run. Then select debug.
I am able to apply the breakpoints to my typescript code and it works perfectly. Coming from .Net where it was always pretty straight forward to debug, I am glad to see webstorm making it just as simple.
This is my npm script that I choose to debug.
"dev": "env-cmd -f ./config/dev.env concurrently -k -n COMPILER,NODEMON -c gray,blue \"tsc -w\" \"nodemon -w dist dist/index.js\"",
I'm using a specific version of node called ts-node.
First add in your package.json file:
"devDependencies": {
"ts-node": "8.1.0",
"typescript": "3.2.4"
},
Run npm install and the node_module/.bin/ directory will include the ts-node or ts-node.cmd required for Windows.
Obviously these versions will move. You may see inside the package.json of ts-node project which version of typescript they are using to be the closest as possible.
Then you can add breakpoints. The only downside I see is that you must define the Javascript file (which is a ts file) into the configuration, instead of just right-click + run.
If you have the xyz is not a function error, check that your tsconfig.json file doesn't have "noEmit": false,
For running WebStorm(2017.2.3) debugger around typescript sources I did:
Setup Node.js configuration:
Working directory: root/of/the/project (where located my package.json)
JavaScript file: dist/index.js
I am compiling my TypeScript with gulp-typescript, but more important the source-map files. So for compiling was used task like below:
const gulp = require('gulp');
const ts = require('gulp-typescript');
const sourcemaps = require('gulp-sourcemaps');
const merge = require('merge2');
const tsProject = ts.createProject('tsconfig.json', {
declaration: true,
typescript: require('typescript'),
});
gulp.task('default', () => {
const result = gulp.src('./app/**/*.ts')
.pipe(sourcemaps.init())
.pipe(sourcemaps.identityMap()) // optional
.pipe(tsProject());
return merge([
result.js
.pipe(sourcemaps.write('.', { includeContent: false, sourceRoot: '../app' }))
.pipe(gulp.dest('dist')),
result.dts
.pipe(gulp.dest('dist')),
]);
});
All source TS files located in './app' folder, all compiled files located in ./dist folder. Most important source-files option sourceRoot, wrong value not bring you to ts file.
By sourcemaps.write('.', { includeContent: false, sourceRoot: '../app' } I am writing my .map files beside .js files and make reference to app folder. I no need content in .map files because it's already there (app folder).
Thanks to #Ekaterina I was able to run Node debug with Typescript.

Setting user agent on firefox with protractor and using seleniumAddress does not work

I want to set a specific user agent using protractor and Firefox. If I use directConnect on protractor.conf.js, it works:
//selenium-webdriver is installed via npm
var firefox = require('selenium-webdriver/firefox');
var firefoxProfile = new firefox.Profile();
firefoxProfile.setPreference("general.useragent.override", 'monitoring1152936086');
exports.config = {
directConnect: true,
capabilities: {
'browserName': 'firefox',
'firefox_profile': firefoxProfile
},
...
}
However, if I use seleniumAddress instead of directConnect it does not work. Test does work but the user agent is not used. I need to use a selenium server. For example:
var firefox = require('selenium-webdriver/firefox');
var firefoxProfile = new firefox.Profile();
firefoxProfile.setPreference("general.useragent.override", 'monitoring1152936086');
exports.config = {
seleniumAddress: 'http://localhost:4444/wd/hub',
capabilities: {
'browserName': 'firefox',
'firefox_profile': firefoxProfile
},
...
}
As a side note, I cannot use chrome since I am trying to use Firefox as a workaround to the not so stable combination of protractor and selenium-docker with chrome (https://github.com/SeleniumHQ/docker-selenium/issues/87).
Any ideas? Thanks!
In the direct connect case Protractor creates the browser itself, so it's able to have total configuration over the browser. In the remote case Protractor has less control because it's connecting to the selenium server started up by webdriver-manager. The correct time to pass a firefox profile would be when webdriver-manager starts, but Protractor does not currently provide this feature.

Vagrant Selenium-Grid: Chrome failed to start: crashed

I downloaded this vagrant selenium grid setup from GitHub, and tried it out as is. I can get my protractor tests working with the default firefox instances, but I am getting errors when trying to test on the chrome instances. Here is the log output from the node vm's node.log file when I try to run a test with chrome.
I have tried using openjdk 6 & 7, and have tried the latest chromedriver (64Bit) as well as chromedriver 2.9 & 2.8, and tried the latest versions of the selenium-sever-standalone jar file.
I am using protractor 0.23.1 at the moment. Here is my protractor config file:
exports.config = {
seleniumAddress: 'http://localhost:4444/wd/hub',
chromeOnly: false,
splitTestsBetweenCapabilities: true,
specs: ['./e2e/**/*pec.js'],
multiCapabilities: [{
'browserName': 'firefox',
'platform': 'LINUX',
'maxInstances': 2,
}, {
'browserName': 'chrome',
'platform': 'ANY',
'maxInstances': 2
}],
jasmineNodeOpts: {
showColors: true,
isVerbose: true,
includeStackTrace: true,
defaultTimeoutInterval: 30000
}
};
I have also tried adding the flags below to the script in the conf/upstart/selenium-node.conf file, but chrome still wont startup (same message as in log above).
-browser "browserName=chrome" -Dwebdriver.chrome.driver="/usr/bin/chromedriver"
Does anybody have this setup running with chrome? Or can you see what the problem is here? Any advice could be helpful.
Try opening an issue in that selen repository since the provided vagrant doesn't seem to work out of the box.
Overall seems your goal here is to run selenium+chrome headless.
Take a look at my answer here.

Grunt watch livereload not working on MAMP

I am using grunt and I'm trying to get the watch/livereload task to run on my local server (MAMP) but with no success.
I'm calling the task based on HTML5 Boilerplate grunt files (https://github.com/h5bp/html5boilerplate.com/blob/master/Gruntfile.js, https://github.com/h5bp/html5boilerplate.com/blob/master/package.json).
I have also tried implementing Tiny-lr (https://github.com/mklabs/tiny-lr) without success either.
My connect and watch options right now are this
connect: {
options: {
hostname: 'localhost',
livereload: 35729,
port: 8888
},
livereload: {
options: {
base: '../',
open: true
}
},
},
watch: {
files: '<%= settings.dir.src %>/**',
less: {
files: ['src/less/*.less'],
tasks: ['less'],
},
options: {
livereload: '<%= connect.options.livereload %>'
},
scripts: {
files: ['<%= settings.dir.src %>/js/*.js', 'css/**/*.scss' ],
tasks: 'default',
options: {
spawn: false,
}
}
}
And here I declare the dev task:
// development task
grunt.registerTask('dev', [
'connect:livereload',
'watch'
]);
When I run 'grunt dev' my browser opens at http://127.0.0.1:8888/ and displays only this: Cannot GET /
I need my browser to open http://localhost:8888/ctrl/ (ctrl being the name of the folder project on MAMP, could be anything), I thought that changing the "base" option was the way to go but nope, it is not, and I cannot add "/ctrl" to host name either, nor to the port.
Any ideas?
Thank you
Here is a link to my whole code: https://github.com/zolitariuz/ctrl
i think you are misunderstanding 2 tasks in grunt,
the connect task is used to create a http server spawned by node js, so no php nor mysql support, you DON'T want to run you WP site thru that.
the watch task is looking for changes in files on YOUR computer, launching the according task after a file change, then trigger the live reload.
you should remove connect completely after you copied the live reload object in your watch task.
the you should run your local lamp stack for running wp then start the watch task for file changes.
on the wp side you should enqueue the live reload script, or use a browser extension that will inject it for you.

Resources