Need help with below issues. I have work around for issue 1 so any tips on issue 2 would be great:
--start-maximized won't trigger full window so my current work around is adding below line in beforeEach function:
browser.driver.manage().window().maximize();
Trying to download file to default directory but the file is just going to download folder on my C drive instead of /tmp/downloads (on another drive).
My config:
capabilities: {
'browserName': 'chrome',
'chromeOption': {
args: ['--lang=en', '--start-maximized'],
prefs: {
'download': {
'prompt_for_download': false,
'default_directory': '/tmp/downloads',
},
},
},
},
As for download, I'm currently using solution from here.
There is a typo. It should be chromeOptions, not chromeOption.
I think the options in protractor conf have been updated to be without "--".
So perhaps try without "--"?
args: ['lang=en', 'start-maximized']
Related
I’ve been trying without success to change default language of browsers Chromium and Firefox (inside automated tests that run in parallel using CodeceptJS + Playwright as runner) to french language. In Chromium, I’ve tried to use args --lang without success and I’ve also tried to use prefs: intl.accept_languages. In Firefox, I’ve tried to use firefoxUserPrefs. Untill now, nothing has worked.
Does anybody know how to change default language in browser launched using playwright?
CodeceptJS version 3.0.6
Playwright version 1.10.0
Chrome version 90.0.4430.0
Firefox version 87.0b10
codecept.conf.js - full printscreen
codecept.conf.js
Playwright: {
url: process.env.baseUrl || DEFAULT_HOST,
show: true,
browser: 'chromium',
waitForAction: 250,
waitForNavigation: 'networkidle0',
chromium: {
channel: process.env.BROWSER,
args: ['--lang=fr-CA'],
prefs: {
'intl.accept_languages': 'fr-CA',
},
firefoxUserPrefs: {
'intl.accept_languages': 'fr-CA, fr',
},
},
},
browser.NewContext has an option called locale. You can use that option to change the language.
This might not have been available by the time of this question, but now there are emulation options for locale (and timezone) in Playwright (documentation here).
Can be specified both globally in config, per project, like this (in playwright.config.ts):
...
projects: [
{
name: 'chromium',
use: {
...devices['Desktop Chrome'],
locale: 'fr-CA',
},
},
...
or per test, like this:
test.use({
locale: 'sv-SE',
});
test('Lang test 1', async ({ page }) => {
// Test code
});
Is used the two packag.json structure to load dependencies in electron builder config.
"build": {
"asar": true,
"asarUnpack": "node_modules/puppeteer/.local-chromium/**/*",
"appId": "client.zpa",
"directories": {
"output": "./dist-exec",
"app": "."
},
"win": {
"target": [
{
"target": "nsis",
"arch": [ "ia32" ]
}
]
},
"nsis": {
"artifactName": "${productName}_${version}1231.${ext}"
}
...
"dependencies": {
"serial-number": "1.3.0",
"puppeteer": "~1.15.0",
"hummus": "~1.0.104"
}
in dist/node_modules/puppeteer the folder .local-chromium is missing. Any ideas how I can force installing local chromium?
I had the same problem.
Solved via downloading chromium according to current OS (Windows/Linux/Mac OS) on first start.
And, if there is Google Chrome browser available on running machine, you can pass path to chromium in puppeteer config.
Something like this on Windows C:\Program Files (x86)\Google\Chrome\Application\chrome.exe or run this
/System/Library/Frameworks/CoreServices.framework/Versions/A/Frameworks/LaunchServices.framework/Versions/A/Support/lsregister -dump | grep -i "google chrome"
on Mac OS to find path to Google Chrome.
I've heard that it is possible to use Electron IPC and that calls into the JavaScript boot file and then run puppeteer from there.
But haven't tried.
After 2 days of searching on StackOverflow and GitHub issues, I found that no actual solutions to build the local chrome with the electron app the best solution was to set the executable path and use chrome installed on the pc but many answers said that You will do it manually but I found this better to do it using "chrome-path" npm package to set path of chrome auto in mac or Linux or Windows here it's my code background.js
const puppeteer = require("puppeteer")
const chromePaths = require('chrome-paths');
//your electron init window
const browser = await puppeteer.launch({
executablePath:chromePaths.chrome,
headless: false,
defaultViewport: null,
args: ['--no-sandbox', '--start-maximized' ],
slowMo:25,
})
const page = await browser.newPage();
await page.goto("https://google.com")
await app(page)
`
I am currently running with Chrome 74 and trying to use Cypress to test a style-guide in my app. When I load up Cypress it throws this error:
SecurityError: Blocked a frame with origin "http://localhost:3000"
from accessing a cross-origin frame.
Please let me know if there is a solution to this!
I had tried to follow along with this:
https://github.com/cypress-io/cypress/issues/1951
But nothing has changed/worked for me. :(
My code is shown below: cypress/plugins/index.js
module.exports = (on, config) => {
on('before:browser:launch', (browser = {}, args) => {
// browser will look something like this
// {
// name: 'chrome',
// displayName: 'Chrome',
// version: '63.0.3239.108',
// path: '/Applications/Google Chrome.app/Contents/MacOS/Google Chrome',
// majorVersion: '63'
// }
if (browser.name === 'chrome') {
args.push('--disable-site-isolation-trials');
return args
}
if (browser.name === 'electron') {
args['fullscreen'] = true
// whatever you return here becomes the new args
return args
}
})
}
in my cypress/support/index.js
This will load the site before every test I run to save myself from having to write cy.visit in every test.
beforeEach(() =>{
cy.visit('http://localhost:3000/style-guide')
})
I had the very same issue yesterday and the answer from #jsjoeio in the cypress issue #1951 you've referenced in your question actually helped me.
So basically only thing I've done was to modify my cypress.json and add following value:
{
"chromeWebSecurity": false
}
You can disable security to overcome this issue.
Go to cypress.json file.
Write { "chromeWebSecurity": false } and save.
Run the test again.
I had exactly the same problem, I advise you to do as DurkoMatko recommends. Documentation chromeWebSecurity
But I encountered another problem with a link pointing to localhost in an iframe.
If you want to use a link in an iframe I recommend this :
cy.get('iframe').then((iframe) => {
const body = iframe.contents().find('body');
cy.wrap(body).find('a').click();
});
I have also faced this issue. My application was using service workers. Disabling service workers while visiting a page solved the issue.
cy.visit('index.html', {
onBeforeLoad (win) {
delete win.navigator.__proto__.serviceWorker
}
})
Ref: https://glebbahmutov.com/blog/cypress-tips-and-tricks/#disable-serviceworker
So, at least for me, my further problem was an internal one with tokens, logins, etc. BUT!
the code I posted for how the index in the plugin folder is correct to bypass the chrome issue. That is how you want to fix it!
Goto your cypress.json file.
Set chrome web security as false
{
"chromeWebSecurity": false
}
To get around these restrictions, Cypress implements some strategies involving JavaScript code, the browser's internal APIs, and network proxying to play by the rules of same-origin policy.
Acess your project
In file 'cypress.json' insert
{
"chromeWebSecurity": false
}
Reference: Cypress Documentation
Question Part 1
In my current setup, I have a folder that looks like this:
/wwwroot <-- Hosted in localhost
/_project <-- Contains gruntfile.js
/_dev <-- Contains Source Code
The wwwroot folder is hosted in XAMPP and open in my browser. The _project folder contains my gruntfile.js, and _dev contains all the JS and SCSS that is compiled into JS and CSS by Grunt.
This has worked fine for a year or two, but recently, I updated my packages, and the generated sourcemaps have begun breaking. Chrome shows a blank code panel in Sources, and Firefox Dev displays a 404 error's HTML in the sources code panel. The sources were now being looked for inside the /wwwroot folder. Because of this, the sources 404 and aren't shown, and I can't use sourcemap debugging which I rely on.
Relevant parts of Gruntfile:
uglify: {
common: {
options: {
mangle: false,
compress: true, // true or false or {}
preserveComments: 'all', // true or 'all' or 'some'
sourceMap : true
},
files: {
// '../wwwroot/Content/includes/js/libs.js': ['../_dev/js/common/libs/*.js'],
'../wwwroot/Content/includes/js/buildbar.js': ['../_dev/js/common/buildbar/*.js'],
'../wwwroot/Content/includes/js/framework.js': ['../_dev/js/common/framework/*.js'],
}
},
}
Short of painfully rearranging my directory structure... how can I fix this?
Question part 2:
I've tried using grunt-uglify-contrib's sourceMapRoot option as follows:
uglify: {
common: {
options: {
mangle: false,
compress: true, // true or false or {}
preserveComments: 'all', // true or 'all' or 'some'
sourceMap : true,
sourceMapRoot: "C:/Users/quint/Documents/Github/build-siteengine/a/a/a/a"
},
files: {
// '../wwwroot/Content/includes/js/libs.js': ['../_dev/js/common/libs/*.js'],
'../wwwroot/Content/includes/js/buildbar.js': ['../_dev/js/common/buildbar/*.js'],
'../wwwroot/Content/includes/js/framework.js': ['../_dev/js/common/framework/*.js'],
}
},
}
For some reason, though, the paths that show in the Sources panel in Firefox Dev are missing four directories, hence why I've added the /a/a/a/a. Why would this be happening?
This also doesn't solve my problem, since in Firefox Dev clicking on the line numbers open the file in the browser and don't take me to the line of code in the debugger, and in Chrome there is no effect.
I'm trying to debug an application written in Angular 2 build from webpack with VScode. I'm able to use the debugger for chrome extension in VSCode to attach my application. And it did hit the break point of the compiled js file. But it cannot find the sourcemap files.
It seems that webpack will have a webpack:// to host the files which the *.js file pointed to, like in the image:
And I can set the breakpoint inside the ts files inside webpack folder. However vscode is not able to find the ts files. So I change the configuration of webpack to
output: {
path:root('__build');
devtoolModuleFilenameTemplate: function(info){
return "file:///"+info.absoluteResourcePath;
}
},
And then all files seemed to map to the absolute paths of the original ts files. And in chrome developer tool it looks like this:
But both chrome and vscode said the files inside this file:// is different from the original ts files. So I'm wondering whether there's a way that in webpack's configuration could make *.js file sourcemap to original ts files. And here's all my configurations:
typescript configuration:
{
"compilerOptions": {
"outDir": "dist",
"target": "ES5",
"module": "commonjs",
"sourceMap": true
}
}
webpack config:
{
entry: "./src/app/bootstrap",
output: {
path: root('__build__'),
filename: env({
'development': '[name].js',
'all': '[name].[hash].min.js'
}),
devtoolModuleFilenameTemplate: function(info){
return "file:///"+info.absoluteResourcePath;
}
},
devtool:'source-map',
devServer: {
contentBase: "public/"
}
}
Another thing is that if in chrome developer tools, if I add the original files into the workspace and map the files from file:// to this folder, I can actually set breakpoints inside these files. So I'm wondering there's a way to map to local resources in vscode.
I changed this:
output: {
// ...snip...
devtoolModuleFilenameTemplate: function(info){
return "file:///"+info.absoluteResourcePath;
}
},
to this:
output: {
// ...snip...
devtoolModuleFilenameTemplate: function(info){
return "file:///"+encodeURI(info.absoluteResourcePath);
}
},
and now it encodes the spaces properly, and the sourcemap file works as expected.
Thanks to Rob Lourens, this problem is caused by spaces and other special characters in the file path that may break sourcemaps.