Hide browser in Puppeteer - puppeteer

I need to keep a browser running in the background for a specific issue but i have to hide it so the enduser should not see. I have tried electron, nwjs and carlo and ended up using puppeteer since none of the above was meeting my expectation. I need to run a specific chrome extension. I have completed everything but i can't find out how to hide the chronium. I have tried "--no-startup-window" argument for chromium and window doesn't show up but code get stuck at
await puppeteer.launch(options);
I have read through puppeteer api and look through chronium args but could not figure out. Is there a way to hide chronium but run it in the background?
Thank you for your help in advance.

You probably would like to run Chromium in headless mode. For this you may use command line switch or launch options. More information on Getting Started with Headless Chrome is available at this article.
Starting headless:
chrome --headless
Using puppeteer launch options:
{
"headless": true,
"args": ["--fast-start", "--disable-extensions", "--no-sandbox"],
"ignoreHTTPSErrors": true
}

Related

Chrome "--headless=new" mode does not allow to apply "--window-size" option

When new chrome headless mode is used the "--windows-size=width,height" argument doesn't work.
For example:
"--headless=new",
"--window-size=1920,1080"
Running tests with these arguments produces strange size screenshots: 1028x653 px
But with the old headless mode:
"--headless",
"--window-size=1920,1080"
the screenshots size is OK: 1920x1080 px.
I can't use old mode, because the files downloading is not working in it anymore, here is the post about it, where using the new headless mode is suggest as a solution: Downloading with chrome headless and selenium
Are you running your tests with a CI-Tool like Jenkins?
I see a similar behavior (messing up the screen size) only with a central run on Jenkins, like always..local it works.
If so I think it has to do with the system user the test is executed through a jenkins agent.
This is a bug being fixed in Chrome. You can see the status of the fix and the reasons here:
https://bugs.chromium.org/p/chromium/issues/detail?id=1416398

How to get console logs on Chrome mobile without usb debug?

I once came across an SO answer that gave a Chrome URL to navigate to, that had a button to "enable" JS console logging. After enabling the logging, that tab would show the console logs of other Chrome tabs.
I know this answer seems like a duplicate, but I'm having a lot of trouble finding how to do that again. It was super convenient since it gave the console logs on any Chrome browser without needing a USB connected.
Any ideas? I know I came across it in an SO question about iOS debugging.
Found it! So, it's actually a Chrome on iOS only feature.
URL: chrome://inspect
That URL won't show anything on Chrome for Android, which tripped me up. But, on iOS it shows a "Start Logging" button.
Answer from: https://stackoverflow.com/a/55433616/2096769

Google Chrome Headless Error "Not supported" When using getDisplayMedia trying to record screen from Chrome Tab in Puppeteer

I am using Puppeteer latest version with Chromium 80 and I'm trying to record video from page in chrome headless and turned on all these flags:
{
headless: true,
devtools: false,
args: [
'--no-sandbox',
'--allow-insecure-localhost',
'--enable-usermedia-screen-capturing',
'--use-fake-ui-for-media-stream', // In headless: false it will capture display rather than tab and in headless: true doesn't work
'--auto-select-desktop-capture-source=[RECORD]', //[RECORD] is the title of my localhost page trying to screen capture
'--remote-debugging-port=9222',
'--window-size=1440,900',
],
ignoreDefaultArgs: [
'--mute-audio',
'--disable-media-session-api',
]
}
On windows if this is headless : false it will capture the chrome tab (sometimes crashes). But if this is headless : true even on Windows it says it is Not supported.
If --use-fake-ui-for-media-stream flag is on then it is another story and it will capture one of my displays regardless of being headless true or false.
Now I want to use this on my linux server where there is no display and I just want the chrome headless : true to capture my chrome tab. I know it can do that because I can see the screen in headless : true mode in the DevTools. If it is creating a display on DevTools it MUST be able to create the display on screen capture. I suppose there must be other flags to be turned on on Puppeteer so it is allowed to do so. I am using navigator.mediaDevices.getDisplayMedia in order to get the screen data.
I also have tried this video configuration and it didn't work (crashed) and apparently only works on extensions and I need to get source id from background:
screenStream = await navigator.mediaDevices.getDisplayMedia({
video: {
//mandatory: {
// chromeMediaSource: 'tab', // Not using this!
//}
},
audio: false
});
Is there anyone that knows what flags should be also considered into the Puppeteer?
Please Note that I don't want to use xvfb and Selenium (WebDrive) or any extensions in my chrome headless.
This issue is reported as a bug Here and also people on GitHub are having same issue. it seems its a bug and it's not clear when they are going to fix it.
In the meantime you can use puppeteer-video-recorder plugin which apparently works in headless and headful mode.
Does it record videos in headless Chrome?
Yes it does.
But since it uses FFMPEG the creation of the video seems to be slow.
anyways, I hope you can use it and it helps you.

Is there a browser-sync option to open Google Chrome in incognito mode?

I've taken a look at the documentation but it's a little thin on what values are acceptable. Does anyone know if there's a value to open Google Chrome incognito and/or have a complete list (who knows I might want to open a project in IE/Edge one day).
I've tried:
browser: "google chrome -incognito"
browser: "-incognito"
browser: "incognito"
Not many more alternatives, I reckon.
Thanks in advance!
Chrome's command line switch is actually --incognito (two dashes), but I tried it in my browsersync Gulp task and that didn't work.
The workaround I'm using is to use a Chrome extension to switch my development domain name to incognito. It looks like there are a couple extensions that do that, I use Ghost Incognito:
https://chrome.google.com/webstore/detail/ghost-incognito/gedeaafllmnkkgbinfnleblcglamgebg?hl=en-US
in general, I created a shortcut to launch the browser in private mode. then in browser-sync settings added parameter:
browser: 'absolute path to shortcut'
Hurrah!

Can i resize Chrome window using the console?

Is it possible to resize the Chrome window using the developer tool's console? If so, what would the command be? becuase the window.resizeTo(w,h) didn't work for me.
Official Chrome issue says:
By Design we don't support resize/move for tabs, only constrained windows.
Windows in Chrome can be resized via Chrome extensions API, however it's not available from console. You should probably try using one of many 'window resizing' extensions. In the near future it will be possible for extensions to add own console commands, however as for now it's an experimental feature.
i think you can only resize windows that's you have created from the console, like popups
for example:
var pop=window.open("","","width=1024,height=768");
pop.resizeTo(100,100);
On macOS you can run: open -a Google\ Chrome --args --window-size=1366,768
Since Firefox 7, it's no longer possible for a web site to change the default size of a window in a browser, according to the following rules:
You can't resize a window or tab that wasn’t created by window.open.
You can't resize a window or tab when it’s in a window with more than one tab.
found on https://developer.mozilla.org/en-US/docs/DOM/window.resizeTo#Notes
some try and error seems to prove that these rules also apply in Chrome.