I have a selenium webdriver.io suite that uses chromedriver. I'm trying to get chrome to work in headless mode since this will be running in a vm without a display.
There are many instances throughout the tests where I use this code to get the clipboard contents: const result = browser.execute(async () => { return await navigator.clipboard.readText() });
This works when not running in headless mode, but in headless mode this error is returned:
(Session info: headless chrome=101.0.4951.54)
at processTicksAndRejections (internal/process/task_queues.js:95:5)
at Browser.<anonymous> (/Users/jacob/Code/steno/selenium/node_modules/#wdio/local-runner/node_modules/#wdio/utils/build/shim.js:276:24)
at evalmachine.<anonymous>:1:9
at Script.runInContext (vm.js:144:12)
at Object.runInContext (vm.js:294:6)
at WDIORepl._runCmd (/Users/jacob/Code/steno/selenium/node_modules/#wdio/repl/build/index.js:62:41)
at /Users/jacob/Code/steno/selenium/node_modules/#wdio/repl/build/index.js:56:64
Currently I'm passing these arguments into goog:chromeOptions: --disable-gpu, --disable-user-media-security=true, --headless, --no-sandbox
Also to get the clipboard access when it's not running in headless mode I used this in goog:chromeOptions:
prefs: {
'profile.content_settings.exceptions.clipboard': {
'http://localhost:3000,*': {'last_modified': Date.now(), 'setting': 1}
},
}
Related
I start using next-pwa and the basic setup worked like a charm. Now it want to play with the runtime caching option, which does not work for me:
My next.config.js includes the standard cache entries plus a custom one that should use the strategy StaleWhileRevalidate for each request going to /api/todoitem:
const withPWA = require("next-pwa");
const defaultRuntimeCaching = require("next-pwa/cache");
module.exports = withPWA({
reactStrictMode: true,
pwa: {
dest: "public",
disable: false, // disable PWA
register: true,
skipWaiting: true,
runtimeCaching: [
{
urlPattern: /\/api\/todoitem/,
method: "GET",
handler: "StaleWhileRevalidate",
options: {
cacheName: "todoApp-api",
expiration: {
maxEntries: 64,
maxAgeSeconds: 24 * 60 * 60, // 24 hours
},
},
},
...defaultRuntimeCaching,
],
},
});
Restart npm run dev fire up the browser -> fetch GET /api/todoitem -> and console.log tells me
workbox Network request for '/api/todoitem' returned a response with status '200'.
workbox Using NetworkOnly to respond to '/api/todoitem'
I tried a number of combinations of regexes, including defaultRuntimeCaching before or after my runtimeCache entry to no avail.
Any hints to get custom runtimeCache rules working would be greatly appreciated.
next.js 12.0.7
next-pwa 5.4.4
node.js v14.18.2
After some research I found:
In development mode, next-pwa creates a service worker that disables caching. It even tells me so on the console ;-):
[PWA] Build in development mode, cache and precache
are mostly disabled. This means offline support is
disabled, but you can continue developing other
functions in service worker.
When building the app via next build it creates a service worker that uses my custom rules and when starting the app next start the rules seem to work.
A bit hard to debug, so I tried to set mode: "production" on my developer machine but then for some reason the service worker gets rebuilt at every other request which brings the app to a grinding halt.
My colleague & I are running the same Cypress test suite on our machines, but getting different results.
The version of Cypress we are using is 3.8.3.
When they run .\node_modules\.bin\cypress run, all tests are passing.
But when I try to run the same command on my machine, one of the tests is failing.
I get the below error message:
<failure message="cy.type() can only be called on a single element.
Your subject contained 8 elements." type="CypressError">
<![CDATA[CypressError: cy.type() can only be called on a single element. Your subject contained 8 elements.
I can understand what the test is saying, but I don't know why we are getting different results on different machines when running the same tests.
One difference I can spot is that they have the option to run tests on Chrome, while I only have the option to run on Electron.
Can someone please help to explain what is causing this issue, & how it can be resolved
Cypress automatically detects browsers installed on your local machine. So please check if you have chrome installed. Electron comes directly with cypress.
The application behavior can vary from machine to machine and also from browser to browser depending on the configurations and also on the internet speed. So its always good to use Test Retries which will retry the test as per the defined value before finally marking the test as fail. Test retries were introduced in cypress 5.0.
You can apply them globally through your cypress.json
{
"retries": {
// Configure retry attempts for `cypress run`
// Default is 0
"runMode": 2,
// Configure retry attempts for `cypress open`
// Default is 0
"openMode": 0
}
Or, you can also add it to a specific test -
describe('User sign-up and login', () => {
// `it` test block with no custom configuration
it('should redirect unauthenticated user to sign-in page', () => {
// ...
})
// `it` test block with custom configuration
it(
'allows user to login',
{
retries: {
runMode: 2,
openMode: 1,
},
},
() => {
// ...
}
)
})
Or to a specific test suite as well -
// Customizing retry attempts for a suite of tests
describe('User bank accounts', {
retries: {
runMode: 2,
openMode: 1,
}
}, () => {
// The per-suite configuration is applied to each test
// If a test fails, it will be retried
it('allows a user to view their transactions', () => {
// ...
}
it('allows a user to edit their transactions', () => {
// ...
}
})
When I try to export data with html-to-xslx npm package, this message displayed:
Error: Failed to launch chrome!
[0221/145806.785119:ERROR:zygote_host_impl_linux.cc(89)] Running as
root without --no-sandbox is not supported. See
https://crbug.com/638180.TROUBLESHOOTING:
https://github.com/GoogleChrome/puppeteer/blob/master/docs/troubleshooting.md
If we want to lunch chrome with root privilege, we must add --node-sandbox in 'chrome-page-eval' constructor: launchOptions: {headless: true, args:['--no-sandbox']}
Here is a full example:
const conversionFactory = require('html-to-xlsx');
const chromeEval = require('chrome-page-eval')({ puppeteer, launchOptions: {headless: true, args:['--no-sandbox']} });
const conversion = conversionFactory({
extract: chromeEval
})
This way worked for me
I am new to Puppeteer and am trying to run the example script. However, I get a blank chromium window (with no tab or URL bar).
Environment details:
OS: Windows 10
Node version: 8.4.0
NPM version: 6.4.1
I installed puppeteer using NPM and version 1.0.0 got installed. I also installed version 1.9.0 directly from Puppeteer's github page. Both versions have a similar issue.
This is my script:
const puppeteer = require('puppeteer');
(async () => {
try {
console.log('starting');
const browser = await puppeteer.launch({
executablePath: 'D:/Code/Puppeteer/node_modules/puppeteer/.local-chromium/win64-594312/chrome-win/chrome.exe',
headless: false
});
console.log('one');
const page = await browser.newPage();
console.log('two');
await page.goto('https://github.com');
console.log('three');
await page.screenshot({path: 'example.png'});
console.log("Page is up");
await browser.close();
}
catch (e) {
console.log("Error: ", e);
}
})();
In above script, I can see 'starting' and then Chromium window opens with nothing on screen. When I press F12 to bring up the dev tool, I see 'one' being printed on screen.
I have set environment variable 'path' to use this:
D:\Code\Puppeteer\node_modules\puppeteer\.local-chromium\win64-594312\chrome-win; C:\Program Files (x86)\Google\Chrome\Application
The puppeteer script is working now. I started the node.js cmd window in admin mode to run the script which did not work. Running in normal mode worked.
I am trying to use Headless Chrome to generate a PDF file from a complex HTML file (contains images, SVGs, etc.). I am able to use wkhtmltopdf.exe on Cloud Service (Windows) to generate simple PDF file, but I really need Chrome to produce PDFs as close as possible to the HTML + SVG + Image.
I was hoping to be able to run Headless Chrome in Azure Cloud Service or Azure Functions, but I cannot get it to work. I suppose this is due to restrictions on GDI. I was able to run my code and Headless Chrome in the Azure Emulator on my own machine, but once it is deployed nothing works.
Below is the code I am currently running in Azure Functions (for Windows). I am using Puppeteer to take a screenshot of example.com. If I can get this to work, I suppose that generating PDF will become easy.
const fs = require('fs');
const path = require('path');
const puppeteer = require('puppeteer');
const os = require('os');
module.exports = function (context, req) {
function failureCallback(error) {
context.log("--> Failure = '" + error + "'");
}
const chromeDir = path.normalize(__dirname + "/../node_modules/puppeteer/.local-chromium/win64-508693/chrome-win32/chrome.exe");
context.log("--> Chrome Path = " + chromeDir);
const dir = path.join(os.tmpdir(), '/screenshots');
if (!fs.existsSync(dir)){
fs.mkdirSync(dir);
}
const screenshotPath = path.join(dir, "example.png");
context.log("--> Path = " + screenshotPath);
let browser, page;
puppeteer.launch({ executablePath: chromeDir, headless: true, args: [ '--no-sandbox', '--single-process', '--disable-gpu' ] })
.then(b => {
context.log("----> 1");
browser = b;
return browser.newPage();
}, failureCallback)
.then(p => {
context.log("----> 2");
page = p;
return p.goto('https://www.example.com');
}, failureCallback)
.then(response => {
context.log("----> 3");
return page.screenshot({path: screenshotPath, fullPage: true});
}, failureCallback)
.then(r => {
browser.close();
context.res = {
body: "Done!"
};
context.done();
}, failureCallback);
};
Below is the log when trying to execute the script.
2017-12-18T04:32:05 Welcome, you are now connected to log-streaming service.
2017-12-18T04:33:05 No new trace in the past 1 min(s).
2017-12-18T04:33:11.400 Function started (Id=89b31468-8a5d-43cd-832f-b641216dffc0)
2017-12-18T04:33:20.578 JavaScript HTTP trigger function processed a request.
2017-12-18T04:33:20.578 --> Chrome Path D:\home\site\wwwroot\node_modules\puppeteer\.local-chromium\win64-508693\chrome-win32\chrome.exe
2017-12-18T04:33:20.578 --> Path = D:\local\Temp\screenshots\example.png
2017-12-18T04:33:20.965 --> Failure = 'Error: spawn UNKNOWN'
2017-12-18T04:33:20.965 ----> 2
The error "Failure = 'Error: spawn UNKNOWN'" is not clear. I made sure that the path I am using is correct using Kudu and PowerShell.
I am looking for a way to run Chrome on Azure Cloud Service and/or Azure Functions (for Windows - in order to use my existing App Service plan). Anybody has also attempted to run Headless Chrome in Azure? I am open to any ideas which would help me to get this script to work?
I would recommend to use https://www.browserless.io/ so you don't have to run the chrome.exe in the app service.
Replace puppeteer.launch with puppeteer.connect
const browser = await puppeteer.connect({
browserWSEndpoint: 'wss://chrome.browserless.io/'
});
I'm not sure about the usage of Headless Chrome, but the sandbox that Azure Functions runs in has problems generating PDFs from HTML due to some GDI restrictions.
Consider trying your task in Azure Functions on Linux. While this is still in preview, it does not utilize a sandbox, so if you can get headless chrome working on it then you may have more luck with the PDF generation.
Azure allows NodeJS:
you can do it in NodeJS using Phantom (instead of chrome since you wont have access to any browsers - nor will you be able to run them on azure web apps) see the example - its in hosted on google firebase but you can easily apply it to your NodeJS project:
https://stackoverflow.com/a/51828577/6306638
IIS server on a Azure VM is your only alternative if you NEED Chrome.
Let me know if you need any help with this!