How to use _resolveExecutablePath method in Puppeteer

Try this code, and select this answer as correct, if it works perfectly.

I set the scale options inside the page.pdf method to scale the original printed PDF to the scaled version. So this make the full page fit in one page only.

const puppeteer = require('puppeteer')

const pageURL = 'https://stackoverflow.com/questions/59464250/configure-pdf-page-width-using-puppeteer'

const optionsPDF = {
    path: 'print.pdf',
    printBackground: true,
    width: '4.8cm',
    scale: 1,
    preferCSSPageSize: false
}

;(async () => {
    const browser = await puppeteer.launch({
        headless: true,
        devtools: false,
        defaultViewport: {
            width             : 136,
            height            : 842,
            deviceScaleFactor : 1
        }
    })
    const [page] = await browser.pages()
    await page.emulateMedia('screen')

    await page.goto( pageURL, { waitUntil: 'networkidle0', timeout: 0 })

    const height_weight_ratio = await page.evaluate( () => window.innerHeight / window.innerWidth)
    const height = parseInt(optionsPDF.width) * height_weight_ratio
    optionsPDF.scale = 1/height_weight_ratio

    console.log('Printing PDF...')
    await page.pdf(optionsPDF)

    await browser.close()

})()

Download File from Bytes in JavaScript Downloaded PDF looks empty although it contains some data

Here is the answer, I should encode the pdf string into base64 on backend and then send it to frontend to avoid "byte-shaving". On frontend, I should convert the base64 string to Uint8 array then feed it to Blob.

You can use page.exposeFunction(name, puppeteerFunction):

await page.exposeFunction("add", (a, b) => a + b);
const response = await page.evaluate(() => {
   return window.add(2, 2);
});

In your example code you're using page.$eval, not page.$$eval. Since the former uses document.querySelector instead of document.querySelectorAll, the behaviour you describe is the expected one.

Also, you should change your pageFunctionin the $$eval arguments:

const hrefs = await page.$$eval('a', as => as.map(a => a.href));

Var i is globally-scoped, so by using var i=0 you are definitely creating scope conflict. Use let or another variable name instead.

You probably would want to set a certain screen size, which any real browser has:

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.setViewport({ width: 1366, height: 768});
  await page.goto('https://example.com', {waitUntil: 'networkidle2'});
  await page.screenshot({path: 'example.png'});

  browser.close();
})();

Yes,

const browser = await puppeteer.launch({
    args: ['--enable-features=NetworkService'],
    headless: true,
    ignoreHTTPSErrors: true,
  });

--enable-features=NetworkService enables service worker (experimental) and ignoreHTTPSErrors is required to overcome the https requirement of service workers when in the puppeteer context (served over file:///)

You can set chrome window size during puppeteer.launch with flag --window-size

Here is usage in your example:

const browser = await puppeteer.launch({
    headless: false, // The browser is visible
    ignoreHTTPSErrors: true,
    args: [`--window-size=${options.width},${options.height}`] // new option
});

Adding a return statement solved the issue on my end.

page.on( 'request', ( request ) => {
        if ([ 'image', 'stylesheet', 'font', 'script' ].indexOf( request.resourceType() ) !== -1 ) {
           return request.abort();
        }
        request.continue();
} );