How to open youtube video in fullscreen mode with puppeteer? - node.js

I've tried few things i.e.
await page.click('.ytp-fullscreen-button.ytp-button') // click on fullscreen button
await page.keyboard.press('f') // press f to open fullscreen
await page.keyboard.down('f'); await page.keyboard.up('f'); //similar to previous
await page.evaluate(() => document.getElementsByClassName('ytp-fullscreen-button ytp-button')[0].click()) //injecting js and using it to click on fullscreen button
but nothing worked, is there a way to enter fullscreen mode on youtube using puppeteer?


This seems working for me:
import puppeteer from 'puppeteer';
const browser = await puppeteer.launch({ headless: false, defaultViewport: null });
try {
const [page] = await browser.pages();
// David Lynch's Weather Report 7/22/21
await page.goto('https://www.youtube.com/watch?v=MlyNWpf1N0s');
await page.waitForSelector('.ytp-fullscreen-button.ytp-button');
await page.evaluate(() => {
document.querySelector('.ytp-fullscreen-button.ytp-button').click();
});
} catch (err) { console.error(err); }

Related

How to catch a tab drop in puppeteer-extra and refresh the page?

I have a small application on puppeteer-extra, it works through a proxy server, sometimes the proxy server crashes and I get this error on the page.
if you click the "reload" button, the page will refresh and everything will be fine.
But how can I do it programmatically?
How do I catch such a tab drop?
require('dotenv').config();
const puppeteer = require('puppeteer-extra')
const PuppeteerExtraPluginProxy = require('puppeteer-extra-plugin-proxy2')
const pluginStealth = require('puppeteer-extra-plugin-stealth')
const sleep = require('./src/ToolsSleep');
async function main() {
puppeteer.use(PuppeteerExtraPluginProxy({
proxy: 'socks://username:password#gateproxy.com:6969',
}))
puppeteer.use(pluginStealth());
let file_link = await fetchLinkPage();
let browser = await puppeteer.launch({
headless: false,
userDataDir: './var/prof',
args: [
'--window-size=1200,1400',
'--window-position=000,000',
'--no-sandbox',
'--disable-dev-shm-usage',
'--disable-web-security',
'--disable-features=IsolateOrigins',
'--disable-site-isolation-trials'
]
});
let page = await browser.newPage();
await page.setExtraHTTPHeaders({ referer: file_link.referer })
await page.goto(file_link.link);
let pages = await browser.pages();
while (true) {
for await (let tab of pages) {
await sleep(1500);
if (await isDesiredPage(tab)) {
await DesiredPage(tab);
}else{
// we will close the ad if it is in other tabs
await tab.close();
}
}
await sleep(500);
}
}
main().catch((e) => {
throw e
})
I want to make sure that my "relaod" button is pressed automatically when the tab drops. How do I do this?

Puppeteer not clicking button with text

I have a simple function that tries to accept the cookies
Here's my code:
(async () => {
const browser = await puppeteer.launch({ headless: false });
const page = await browser.newPage();
await page.goto('https://www.sport1.de/live/darts-sport');
await page.click('button[text=AKZEPTIEREN]');
// await page.screenshot({ path: 'example.png' });
// await browser.close();
})();

The cookie popup is placed in an iframe. You have to switch to iframe by contentFrame to be able to click on the accept button.
Also, if you want to filter by textContent, you need to use XPath. With CSS selector you can't get elements by its textContent.
const cookiePopUpIframeElement=await page.$("iframe[id='sp_message_iframe_373079']");
const cookiePopUpIframe=await cookiePopUpIframeElement.contentFrame();
const acceptElementToClick = await cookiePopUpIframe.$x("//button[text()='AKZEPTIEREN']");
await acceptElementToClick[0].click();

Puppeteer prevent "pause on debugging" aka disable all breakpoints

I need scraping with headless mode a site with a lot of debugger;
There is a way to prevent pause on debugger?
I try to send on load CTRL+F8 and F8 with this code but without success!
await crt_page.keyboard.down('Control');
await crt_page.keyboard.press('F8');
await crt_page.keyboard.up('Control');
await crt_page.keyboard.press('F8');
any advice?

Puppeteer is automatically pressing keys inside the page, and not the browser.
So i think the solution is to install a npm package robotjs to do things outside the browser.
Hope this helps you!
Don't forget to select my answer as the correct answer if this code worked.
const puppeteer = require('puppeteer')
const robot = require('robotjs')
;(async () => {
const browser = await puppeteer.launch({
headless: false,
devtools: true
})
const [page] = await browser.pages()
const open = await page.goto('https://www.example.com', { waitUntil: 'networkidle0', timeout: 0 })
await page.waitFor(4000)
await robot.keyToggle(']','down','control') // For Mac, change 'control' to 'command'
await page.waitFor(500)
await robot.keyToggle(']','down','control') // For Mac, change 'control' to 'command'
await page.waitFor(500)
await robot.keyToggle(']', 'up', 'control') // For Mac, change 'control' to 'command'
await page.waitFor(1000)
await robot.keyToggle('f8','down','control') // For Mac, change 'control' to 'command'
await page.waitFor(500)
await robot.keyToggle('f8', 'up', 'control') // For Mac, change 'control' to 'command'
})()
To debugging your robotjs, is it worked or not, try this code.
Code below run puppeteer and change the URL using robotjs.
If this also not worked on your server, then i'm sorry i can't help you.
const puppeteer = require('puppeteer')
const robot = require('robotjs')
const pageURL = 'https://www.google.com'
const normal_Strings = ['`','1','2','3','4','5','6','7','8','9','0','-','=','[',']','\\',';','\'',',','.','/']
const shiftedStrings = ['~','!','#','#','$','%','^','&','*','(',')','_','+','{','}','|',':','"','<','>','?']
;(async () => {
const browser = await puppeteer.launch({
headless: false,
devtools: true
})
const [page] = await browser.pages()
const open = await page.goto('https://www.example.com', { waitUntil: 'networkidle0', timeout: 0 })
console.log('First URL:')
console.log(await page.url())
await robot.keyToggle('l','down','control') // For Mac, change 'control' to 'command'
await page.waitFor(500)
await robot.keyToggle('l', 'up', 'control') // For Mac, change 'control' to 'command'
await page.waitFor(1000)
for (let num in pageURL) {
if (shiftedStrings.includes(pageURL[num])) {
var key = normal_Strings[ shiftedStrings.indexOf(pageURL[num]) ]
await robot.keyToggle( key,'down','shift')
await page.waitFor(300)
await robot.keyToggle( key, 'up', 'shift')
await page.waitFor(300)
}
await robot.keyTap(pageURL[num])
await page.waitFor(200)
}
await page.waitFor(1000)
await robot.keyTap('enter')
await page.waitForSelector('img#hplogo[alt="Google"]', {timeout: 0})
console.log('Second URL:')
console.log(await page.url())
})()

Screenshots location while running the puppeteer script

I have created a Puppeteer script to run in offline, I have got the below code to take the screenshot. While running the offline-login-check.js script from the command prompt, could some one please advise where the screen shots are added ?
const puppeteer = require("puppeteer");
(async() => {
const browser = await puppeteer.launch({
headless: true,
chromeWebSecurity: false,
args: ['--no-sandbox']
});
try {
// Create a new page
const page = await browser.newPage()
// Connect to Chrome DevTools
const client = await page.target().createCDPSession()
// Navigate and take a screenshot
await page.waitFor(3000);
await page.goto('https://sometestsite.net/home',{waitUntil: 'networkidle0'})
//await page.goto(url, {waitUntil: 'networkidle0'});
await page.evaluate('navigator.serviceWorker.ready');
console.log('Going offline');
await page.setOfflineMode(true);
// Does === true for the main page but the fallback content isn't being served.
page.on('response', r => console.log(r.fromServiceWorker()));
await page.reload({waitUntil: 'networkidle0'});
await page.waitFor(5000);
await page.screenshot({path: 'screenshot.png',fullPage: true})
await page.waitForSelector('mat-card[id="route-tile-card]');
await page.click('mat-card[id="route-tile-card]');
await page.waitFor(3000);
} catch(e) {
// handle initialization error
console.log ("Timeout or other error: ", e)
}
await browser.close();
})();

const puppeteer = require('puppeteer');
(async() => {
const browser = await puppeteer.launch({
headless: false,
chromeWebSecurity: false,
args: ['--no-sandbox']
});
try {
// Create a new page
const page = await browser.newPage();
// Connect to Chrome DevTools
const client = await page.target().createCDPSession();
// Navigate and take a screenshot
await page.goto('https://example.com', {waitUntil: 'networkidle0'});
// await page.evaluate('navigator.serviceWorker.ready');
console.log('Going offline');
await page.setOfflineMode(true);
// Does === true for the main page but the fallback content isn't being served.
page.on('response', r => console.log(r.fromServiceWorker()));
await page.reload({waitUntil: 'networkidle0'});
await page.screenshot({path: 'screenshot2.png',fullPage: true})
// await page.waitForSelector('mat-card[id="route-tile-card]');
// await page.click('mat-card[id="route-tile-card]');
} catch(e) {
// handle initialization error
console.log ("Timeout or other error: ", e)
}
await browser.close();
})();
then in command line run ls | GREP .png and you should see screenshot there. Be aware i take rid of await page.evaluate('navigator.serviceWorker.ready'); which might be specified to your website

Your script is perfect. There is no problem with it!
The screenshot.png should be on the directory that you run the node offline-login-check.js command.
If its not there, maybe you are getting some error/timeout before the page.screenshot command runs. Since your script is ok, this can be caused by network issues or issues with the page. For example, if your page has a never ending connection (like WebSocket), change the "networkidle0" to "networkidle2" or "load", otherwise the first page.goto will get stuck.
Again, your script is perfect. You don't have to change it.

Puppeteer only focus on button not clicking on button

Trying to automate the process of clicking button on website page, but it only focuses on button not clicking on it.
I have tried using puppeteer click() fucntion and focus + press enter funtion none of them working
const puppeteer = require('puppeteer');
async function run() {
const browser = await puppeteer.launch({headless:true});
const page = await browser.newPage();
const BUTTON_SELECTOR = 'body > section > section > header > div.reply-button-row > button';
await page.goto('https://bozeman.craigslist.org/zip/d/bozeman-panasonic-36-tv/6837588995.html')
await page.waitFor(2000);
await page.waitFor(BUTTON_SELECTOR);
await page.click(BUTTON_SELECTOR)
//await page.focus(BUTTON_SELECTOR)
//await page.keyboard.press('Enter');
await page.screenshot({ path: 'screenshots/image.png' });
browser.close();
}
run();
Code output image : https://imgur.com/m0CYqNiqwe
Expected Output Image : https://imgur.com/Hmg3BgVasd

It clicks, but the screenshot is made too early, till the new block is shown. You can wait some more time or wait for the block to be created and be visible:
await page.click(BUTTON_SELECTOR)
await page.waitFor(2000);
await page.screenshot({ path: 'image.png' });
or
await page.click(BUTTON_SELECTOR)
await page.waitForSelector('div.reply-info aside.reply-flap', { visible: true });
await page.screenshot({ path: 'image.png' });

Try this selector instead :
const BUTTON_SELECTOR = 'button[data-href^="/__SERVICE_ID"]'

Resources