Related
I am developing a project which requires --disable-web-security for testing. I use Karma with the following settings:
browsers: [
"ch"
],
customLaunchers: {
"ch": {
"base": "Chrome",
"flags": ["--disable-web-security"]
}
},
and
if (process.env.TRAVIS)
options.customLaunchers.ch.flags.push("--no-sandbox");
This works properly on localhost with Chrome v69.0.3497.100 win7 x64.
I am trying to run the same code on Travis (by pushing the changes to GitHub) with the following yml:
language: node_js
node_js:
- "9"
before_install:
- export CHROME_BIN=chromium-browser
- export DISPLAY=:99.0
- sh -e /etc/init.d/xvfb start
- sleep 5
I guess we are talking about 2 different browsers with the same engine here, since Chromium != Chrome, but I am not sure. Anyways, I got an error message by trying to build on Travis:
Blocked a frame with origin "http://localhost:9876" from accessing a cross-origin frame.
That clearly indicates that web security is enabled. Is there any way to disable web security on Travis?
Solution:
Using Trusty with real Chrome solved it:
language: node_js
node_js:
- "9"
dist: trusty
addons:
chrome: stable
before_install:
- export DISPLAY=:99.0
- sh -e /etc/init.d/xvfb start
- sleep 5
According to this documentation you can run Chrome headless by writing the following in your .travis.yml config file
dist: trusty
addons:
chrome: stable
before_install:
- # start your web application and listen on `localhost`
- google-chrome-stable --headless --disable-gpu --remote-debugging-port=9222 http://localhost &
As for your Karma configuration file, check this page. It indicates that you have to add one more flag.
For security reasons, Google Chrome is unable to provide sandboxing when it is running in the container-based environment.
To use Chrome in the container-based environment, pass the --no-sandbox flag to the chrome executable.
module.exports = function(config) {
config.set({
browsers: ['Chrome', 'ChromeHeadless', 'ChromeHeadlessNoSandbox'],
// you can define custom flags
customLaunchers: {
ChromeHeadlessNoSandbox: {
base: 'ChromeHeadless',
flags: ['--no-sandbox']
}
}
})
}
Be aware that I have Never done this before. I am just pointing you to the correct documentation.
Question
Does headless Chrome work with self-signed certificates via the Selenium Webdriver on macOS?
Info
I am attempting to get Rails system tests driven by headless Chrome over SSL.
I have a locally self-signed certificate that I pass the the ruby Puma application server to terminate SSL requests. In order to allow drivers to ignore SSL warnings on the locally signed certificate, I am using the acceptInsecureCerts flag to configure the driver capabilities.
I'm led to believe by this ticket in Chromium that this flag should be recognized as of Chrome 64+.
I can get tests to succeed with Chrome, Firefox, and headless Firefox. Tests do not pass under headless Chrome. I am using (at the time of this writing) what I believe to be the latest versions of Chrome and its variants.
Though folks in the Chromium ticket appear to be successfully running headless Chrome over locally-signed SSL with the Selenium webdriver, I have not found this to work with the setup described here. If my configuration is correct, then I am unsure if there is a limitation in headless Chrome on macOS, in Selenium webdriver ruby gem, or something else I haven't considered. If anyone has something similar working with Rails on macOS, I'd be interested to learn about your setup.
Source
Here is some code to show how I am configuring and running my RSpec/Capybara tests.
Test setup
# rails_helper.rb
# ... standard rspec rails helper setup omitted ...
Capybara.register_driver(:headless_chrome) do |app|
options = Selenium::WebDriver::Chrome::Options.new(
args: %w[--headless --disable-gpu --no-sandbox --disable-web-security]
)
capabilities = Selenium::WebDriver::Remote::Capabilities.chrome(
acceptInsecureCerts: true,
)
Capybara::Selenium::Driver.new(
app,
browser: :chrome,
options: options,
desired_capabilities: capabilities
)
end
RSpec.configure do |config|
config.before(:each, type: :system) do
driven_by :headless_firefox
end
end
module SystemTestHelpers
def key_file_path
Rails.root.join("config", "ssl", "ssl-lvh.me.key")
end
def cert_file_path
Rails.root.join("config", "ssl", "ssl-lvh.me.crt")
end
def using_app_host(host)
original_host = Capybara.app_host
Capybara.app_host = host
Capybara.server = :puma, {
Host: "ssl://#{Capybara.server_host}?key=#{key_file_path}&cert=#{cert_file_path}"
}
yield
ensure
Capybara.app_host = original_host
end
end
RSpec.configure do |config|
config.include SystemTestHelpers, type: :system
end
Sample test
# spec/system/welcome_spec.rb
require 'rails_helper'
RSpec.feature "Welcome", :js, type: :system do
scenario "Visit homepage" do
using_app_host('https://subdomain.lvh.me') do
visit "/"
expect(page).to have_content('Welcome')
expect(page).to have_content('Your domain: subdomain.lvh.me')
expect(page).to have_content('Your protocol: https://')
end
end
end
Page content:
<div>
<h2>Welcome!</h2>
<p>Your protocol: <%= request.protocol %></p>
<p>Your domain: <%= request.host %></p>
</div>
If I swap out the driver for headless Firefox, configured as below, the tests will pass.
Capybara.register_driver(:headless_firefox) do |app|
options = Selenium::WebDriver::Firefox::Options.new(args: %w[--headless])
capabilities = Selenium::WebDriver::Remote::Capabilities.firefox(
acceptInsecureCerts: true,
)
Capybara::Selenium::Driver.new(
app,
browser: :firefox,
options: options,
desired_capabilities: capabilities
)
end
The complete source code for an app that reproduces the issue, and includes the code above is located here: https://bitbucket.org/rossta/system-test-demo.
Debug output
Here's a link to some debug output from running the test in either headless Chrome or headless Firefox: https://gist.github.com/rossta/b160204baa87a520e7888c19c8b1ed98.
Note in the output that the session response does not include the 'acceptInsecureCerts' capability for Chrome (test-headless-chrome.log, line 15) while in Firefox we do see the session include the flag (test-headless-firefox.log, line 22).
System
MacOS 10.13.6
Rails 5.2.1
Ruby 2.4.1
capybara (gem) 3.5.1
selenium-webdriver (gem) 3.14.0
chromdriver-helper (gem) 2.34
Chrome 68.0.3440.106. Have also tried
Google Chrome 70.0.3524.0 canary
Chromium 70.0.3525.0
From your log it shows that it's starting chromedriver v2.34. acceptInsecureCerts support wasn't added until 2.35 and you should really be running the latest (2.41 currently). Update your version of chromedriver and things should work.
caps = Selenium::WebDriver::Remote::Capabilities.firefox
caps['acceptInsecureCerts'] = true
I ran Behat test on PhantomJS without issue. I was starting it with this:
bin/phantomjs --webdriver=8643
It works, but I want to run a Chrome headless instead of PhantomJS. To do that I tried this:
google-chrome --headless --remote-debugging-port=8643
But Behat doesn't seem to start anything on this Chrome. I found a lot of docs for Chrome with Selenium but I wanted to know if it's possible to run it like I was running PhantomJS with the Selenium driver, but without Selenium server?
default:
suites:
default:
contexts:
- FeatureContext
- Behat\MinkExtension\Context\MinkContext
extensions:
Behat\MinkExtension:
base_url: 'http://myurl.com/'
sessions:
default:
selenium2:
wd_host: 'http://localhost:8643'
To run your tests on Google Chrome, you will need chromedriver
Then you can use the port chromedriver is listening to (9515 by default) instead of PhantomJs 8643. You don't need Selenium anymore then.
Finally, you pass the --headless flag to chrome so you don't need xfvb.
A config example:
# behat.yml
default:
extensions:
# ...
Behat\MinkExtension:
base_url: 'http://myurl.com/'
sessions:
default:
selenium2:
browser: chrome
# Note: I'm not totally sure you still need the /wd/hub path
wd_host: http://localhost:9515/wd/hub
capabilities:
chrome:
switches:
- "--headless"
More documentation: https://developers.google.com/web/updates/2017/04/headless-chrome
This worked for me on Ubuntu 16.04 LTS
Installed latest version of chromedriver via https://medium.com/caendra-tech/acceptance-tests-with-behat-and-chrome-headless-2824aaa31fd7
Start chromedriver in the background on default port chromedriver &
Update behat.yml to
default:
extensions:
Behat\MinkExtension:
sessions:
default_session:
selenium2:
browser: chrome
wd_host: http://127.0.0.1:9515
capabilities:
chrome:
switches:
- "--headless"
- "--disable-gpu"
I use CucumberJs and Gulp to run my e2e tests; However, I need to run them against Microsoft Edge. When I do gulp protractor, it successfully opens up both Chrome and Firefox, since neither of them require any drivers like IEDriver.exe or EdgeDriver.exe.
Could anyone point me to an article or show the steps below if it's simple on how to set up Protractor with Microsoft Edge?
I'm trying to achieve parallelism by executing my tests on multiple browsers; this is what my config looks like:
exports.config = {
framework: 'cucumber',
shardTestFiles: true,
maxInstances: 2,
multiCapabilities: [
{
'browserName': 'MicrosoftEdge',
'platform': 'windows',
}
},
{
'browserName': 'firefox',
loggingPrefs: {
driver: 'DEBUG',
server: 'INFO',
browser: 'ALL'
}
}],
//more configs here
}
I achieved the config right above, to run protractor e2e tests in parallel, using this article: http://blog.yodersolutions.com/run-protractor-tests-in-parallel/
Also one for IE driver would be just as helpful if you don't know how to set up Edge.
UPDATES:
From this link: https://msdn.microsoft.com/en-us/library/mt188085(v=vs.85).aspx; under the
Enabling WebDriver with Microsoft Edge:
Download a WebDriver language binding of your choice. Currently C# and
Java Selenium language bindings are supported.
I'm not using Java or C#, I am only using Javascript (Protractor); does that mean that the language binding for Javascript currenlty does NOT work for Edge browser?
In other words, we currently cannot automate the Edge browser using Protractor (Javascript)?
Any help much appreciated and I'll update this post if I find anything pertaining to setting up Protractor with Edge, been looking around the web for hours now.
After some struggle, I got Protractor to work on Microsoft Edge on my Windows 10 system.
Note: I'm using the Jasmine2 framework instead of Cucumber, but I believe the steps below should work for Cucumber as well. I'll try with Cucumber later and update here.
Here are the steps:
Get the Microsoft EdgeHTML version number in use in your system. In my case it is 15.15063. Take a note of the release number here. In this case it is 15063.
(Q.: How to get the Microsoft EdgeHTML version number?
A.: Edge browser > ... > Settings > About this app)
download the correct Release of MicrosoftWebDriver.exe from https://developer.microsoft.com/en-us/microsoft-edge/tools/webdriver/
In my case I downloaded Release 15063. If you get the wrong release, then you are likely to run into an error like this error:
"This version of MicrosoftWebDriver.exe is not compatible with the installed version of Windows 10."
place the MicrosoftWebDriver.exe in the folder where the other drivers are like:
C:\Users\yourname\AppData\Roaming\npm\node_modules\protractor\node_modules\webdriver-manager\selenium\
Adjust your conf.js file. Essentially, this is what conf.js should have:
seleniumAddress: 'http://localhost:4444/wd/hub',
capabilities: // or multiCapabilities:
{
'browserName': "MicrosoftEdge"
}
start the webdriver-manager like this:
C:\your\path>webdriver-manager start --edge C:\Users\yourname\AppData\Roaming\npm\node_modules\protractor\node_modules\webdriver-manager\selenium\MicrosoftWebDriver.exe
You are all set to run your Protractor tests on the Edge browser.
Good Luck!
In windows to download the MicrosoftEdge Webdriver for the HTML version >= 18 then follow the below steps
Open Command Prompt, issue the following command and wait until operation gets completed
DISM.exe /Online /Add-Capability /CapabilityName:Microsoft.WebDriver~~~~0.0.1.0
Open the File Explorer and navigate to C:\Windows\WinSxS and search for MicrosoftWebDriver and it will display two results, copy the webdriver from the amd64_microsoft-webdriver-server-components10.0.18362.1_none and paste it in
/c/Users/Administrator/AppData/Roaming/npm/node_modules/protractor/node_modules/webdriver-manager/selenium
(Note: Using git bash, it's easy to copy the Webdriver)
In the config file of Edge browser, make the following changes
seleniumArgs:['-Dwebdriver.edge.driver=C:\\Users\\Administrator\\AppData\\Roaming\\npm\\node_modules\\protractor\\node_modules\\webdriver-manager\\selenium\\MicrosoftWebDriver.exe'],
capabilities: {
'browserName': 'MicrosoftEdge',
'maxInstances': 1,
'platformName': 'windows',
'nativeEvents': false,
shardTestFiles: true,
},
Open the command prompt, and navigate to project repo and issue the following command to start the edge session
webdriver-manager start --edge "C:\Users\Administrator\AppData\Roaming\npm\node_modules\protractor\node_modules\webdriver-manager\selenium\MicrosoftWebDriver.exe"
I'm using Angular 9 with Edge 89 within linux
The following config worked for me
exports.config = {
directConnect: true,
chromeDriver: '/path/to/ms-edge/webdriver'
capabilities: {
browserName: 'chrome',
chromeOptions: {
binary: '/usr/bin/microsoft-edge'
}
},
},
Official WebDriver can be found here
Since Edge uses Chromium engine, we can reuse all chrome configs and just replace WebDriver and binary path.
Looks like the Protractor folks are now working on adding Edge support for Protractor. Take a look at the recently opened issue on GitHub.
Download the correct release of EdgeHTML webdriver ( https://developer.microsoft.com/en-us/microsoft-edge/tools/webdriver/ ), then settup the conf.js as:
seleniumArgs: ['-Dwebdriver.edge.driver=C:\\Program Files (x86)\\Microsoft Web Driver\\MicrosoftWebDriver.exe'],
Capabilities: {
'browserName': 'MicrosoftEdge',
'maxInstances': 1,
'platformName': 'windows',
'nativeEvents': false,
}
Now Microsoft Edge is supported on Mac Operating System. So to setup in Mac follow below steps
Download the MicrosoftEdge WebDriver from the following link according to version of the edge browser configured in Mac
https://developer.microsoft.com/en-us/microsoft-edge/tools/webdriver/
Unzip the folder and copy the Unix executable file to following path
/usr/local/lib/node_modules/protractor/node_modules/webdriver-manager/selenium/MicrosoftWebDriver
In the config file add SeleniumArgs attribute and capabilities
seleniumArgs : ['-Dwebdriver.edge.driver=/usr/local/lib/node_modules/protractor/node_modules/webdriver-manager/selenium/MicrosoftWebDriver'],
capabilities: {
browserName: 'MicrosoftEdge',
platformName: 'Mac OS X',
browserVersion: '79.0.309.65',
maxInstances: 1,
shardTestFiles: true,
elementScrollBehavior: 1,
nativeEvents: false
},
In order to start the web driver with Edge Session, use below command..
java -jar -Dwebdriver.edge.driver=/usr/local/lib/node_modules/protractor/node_modules/webdriver-manager/selenium/MicrosoftWebDriver /Users//Desktop/Project/node_modules/webdriver-manager/selenium/selenium-server-standalone-3.141.59.jar -port 4444
Edge won't work with directconnect: true. Please refer below example.
directConnect: false,
multiCapabilities: [
{
browserName: 'chrome',
chromeOptions: {
args: ['--disable-popup-blocking'],
}
},
{
browserName: 'firefox'
},
{
browserName: 'MicrosoftEdge'
}
],
jvmArgs: [
'-Dwebdriver.chrome.driver=./src/driver/chromedriver_87.0.4280.20.exe',
`-Dwebdriver.edge.driver=${edgeDriver}`,
'-Dwebdriver.gecko.driver=./src/driver/geckodriver-v0.28.0.exe'
],
Use below code outside config if using mac
const edgeDriver =
process.platform === 'darwin'
? './src/driver/edgedriver_mac64_87.0.664.47/msedgedriver'
: './src/driver/msedgedriver.exe';
I've been trying to run my tests using karma-chrome-launcher, but everytime I run my tests it throws this error:
INFO [launcher]: Starting browser Chrome
ERROR [launcher]: Cannot start Chrome
INFO [launcher]: Trying to start Chrome again (1/2).
ERROR [launcher]: Cannot start Chrome
INFO [launcher]: Trying to start Chrome again (2/2).
ERROR [launcher]: Cannot start Chrome
ERROR [launcher]: Chrome failed 2 times (cannot start). Giving up.
Here's my karma.conf.js code:
// Karma configuration
// Generated on Mon Mar 23 2015 14:04:19 GMT-0300 (BRT)
module.exports = function(config) {
config.set({
// base path that will be used to resolve all patterns (eg. files, exclude)
basePath: 'www',
// frameworks to use
// available frameworks: https://npmjs.org/browse/keyword/karma-adapter
frameworks: ['jasmine'],
// list of files / patterns to load in the browser
files: [
'lib/ionic/js/angular/angular.js',
'lib/ionic/js/angular/angular-animate.js',
'lib/ionic/js/angular/angular-sanitize.js',
'../node_modules/jasmine-core/lib/jasmine-core/jasmine.js',
'../node_modules/mock-local-storage/lib/mock-localstorage.js',
'../node_modules/angular-mocks/angular-mocks.js',
//'../node_modules/requirejs/require.js',
'lib/ionic/js/angular/angular-resource.js',
'lib/ionic/js/angular-ui/angular-ui-router.js',
'lib/ionic/js/ionic.js',
'lib/ionic/js/ionic-angular.js',
/*'../tests/libs/ngCordovaMocks.min.js',*/
'js/lib/ng-cordova.min.js',
'js/*.js',
'js/controllers/*.js',
'js/services/*.js',
'js/factory/*.js',
//'../tests/*.js',
'../tests/**/*.js'
],
// list of files to exclude
exclude: [
],
// preprocess matching files before serving them to the browser
// available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
preprocessors: {
},
// test results reporter to use
// possible values: 'dots', 'progress'
// available reporters: https://npmjs.org/browse/keyword/karma-reporter
reporters: ['progress', 'html'],
htmlReporter: {
outputFile: '../tests/report/index.html'
},
// web server port
port: 9876,
plugins : [
'karma-junit-reporter',
'karma-jasmine',
'karma-phantomjs-launcher',
'karma-chrome-launcher'
//'karma-htmlfile-reporter'
],
// enable / disable colors in the output (reporters and logs)
colors: true,
// level of logging
// possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
logLevel: config.LOG_INFO,
// enable / disable watching file and executing tests whenever any file changes
autoWatch: true,
// start these browsers
// available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
browsers: ['PhantomJS'],
// Continuous Integration mode
// if true, Karma captures browsers, runs the tests and exits
singleRun: false
});
};
I'm installing the module here: https://www.npmjs.com/package/karma-chrome-launcher
Thanks!
I had the same problem and tried a lot of the suggested solutions I found, but what finally solved it for me was to delete the node_modules folder and getting everything new via npm install.
Had the same issue with my build environment.
What i did is to follow the advice of Rafael Cichocki to enable the debugging:
logLevel: config.LOG_DEBUG
Then tried to launch the chrome-browser with exactly the same line that was visible int he debug output.
Turned out that chrome browser was crashing due to missing ttf fonts. So running:
apt-get install ttf-freefont
Solved that issue for me and karma started to launch chrome.
In Karma.conf.js, Increase timeouts to 60000
captureTimeout: 60000,
browserDisconnectTimeout: 60000,
browserDisconnectTolerance: 3,
browserNoActivityTimeout: 60000,
browsers: ['PhantomJS'], Here allowed browser is PhantomJs, but code is trying for Chrome, which is not a specified browser in the karma.conf.js.
Change karma.conf.js file :
browsers: ['PhantomJS','Chrome', 'ChromeHeadless'],
chrome- is for opening new chrome browser window.
ChromeHeadless- is for running tests without opening browser window
make sure Chrome is installed and added to PATH
Hope this helps
I noticed when I had this error that when I changed the spec file and saved it, it seemed to work again. I had a few errors in typescript that didn't break the tests (passing in null arguments to a virtual component instance constructor). I don't know if it was resolving the errors since they existed before when it was working, or if changing the file and saving it updated the cache.
So this could mean that clearing the cache in Chrome could also potentially resolve it. It's working now again for me so I can't check to verify.
Just in case you are running this behind a corporate proxy. Make sure you include your 0.0.0.0 in your NO_PROXY Environment variable.
Otherwise your test will first go out through your firewall where it will most likely not be able to reach 0.0.0.0. So just to be sure I include the following in my
NO_PROXY=127.0.0.1,localhost,0.0.0.0
Especially if you are running your tests in a container environment (e.g. your build pipeline) non set environment variables might be a common reason for ng test working fine on your local machine but failing to connect to google-chrome in the container.
If someone faces this error only in gitlab-runner (but in shell by hand ng test work ok), you can apply decision from here:
https://forum.gitlab.com/t/running-karma-tests-with-chrome-and-gitlab-ci/14476
The decision is: in karma.config.js, replace the section
browsers: ['Chrome'],
by
browsers: ['ChromeHeadlessNoSandbox'],
customLaunchers: {
ChromeHeadlessNoSandbox: {
base: 'ChromeHeadless',
flags: ['--no-sandbox']
}
},
The reason of error is that Chrome doesn't support no-sandbox anymore
I got my inspiration partially from here: https://stackoverflow.com/a/33802985/1534823
Also use logLevel: config.LOG_DEBUG - it can help you get good information on what is causing your error`
Check following settings in karma.conf:
captureTimeout: 60000,
browserNoActivityTimeout: 360000
browser: ["Firefox"]
captureTimeout - your browser may take some time to start. LOG_DEBUG should show some error related to capturing your browser
browserNoActivityTimeout - PhantomJS is really slow(x10) on my machine, in comparison to Firefox and Chrome. Karma may timeout before your tests complete.
browser - our jenkins server runs on linux, where we had no binaries for chrome, so we had to switch to firefox
If any of these three settings were not set correctly, we would get the error you described above.
I was able to resolve this by remove the absolute path (src/examplePath) and changing it to a relative path (../../examplePath).
Example change in spec:
import { myPackage } from 'src/myPath'; (seems to be the issues)
import { myPackage } from '../../../myPath'; (seems to resolve it)
Note I had tried deleting the node modules and npm installing but that didn't work. I'm so not sure why this matters.
In Windows Chrome was install to %LOCALAPPDATA%/Google/Chrome/Application earlier. Now it's install to %PROGRAMFILES%/Google/Chrome/Application. If you is very long time with Chrome then your have old version in %LOCALAPPDATA%/Google/Chrome/Application.
Karma-launcher is searches Chrome location in order LOCALAPPDATA->PROGRAMFILES-> 'PROGRAMFILES(X86)' , first found old version and try to run it.
Just delete %LOCALAPPDATA%/Google/Chrome/Application folder
Solution for us with angular cli was setting the following properties in the karma.conf.js
autoWatch: false,
singleRun: true
I was also facing this issue. I made below three changes in my karma.config.js file.
autoWatch: false,
browsers: ['Chrome'],
singleRun: false
I experienced this after updating macOS to Catalina. I solved it by updating Puppeteer to the latest version.
What worked for me:
npm un karma-chrome-launcher
npm i karma-chrome-launcher
npm i -g karma-cli
karma init (and follow the prompts)
ng test --watch=false
Using the watch flag set to false in combination with adjustment of the following parameters in karma.config.js worked for me:
browsers: ['ChromeHeadlessNoSandbox'],
customLaunchers: {
ChromeHeadlessNoSandbox: {
base: 'ChromeHeadless',
flags: ['--no-sandbox']
}
},
I faced a similar issue recently.
And found two solutions to fix this problem.
I installed puppeteer and added process.env.CHROME_BIN = require('puppeteer').executablePath() at the top of my karma.conf.js file, as documented here.
I uninstalled Google Chrome and cleared up all the system folders (%Local Appdata%\Google and also from Program Files / Program Files x86), restarted by the system, and then installed Chrome x64 from the official site.
I was happy with the 1st solution as well, but since I wanted to fix the root problem, I went ahead and found the second solution as well.
Hope this solves the problem for anyone facing this issue.