Screenshot a sharepoint form with puppeteer

clip.sharepoint.form.js

/**
 * @name Clip Sharepoint Form
 *
 * @desc Grabs and clips out a sharepoint form as an image, and stores it to out_file
 *
 * @args args[0]=URL args[1]=out_file
 *
 * @usage node clip.sharepoint.form.js "URL" "/path/to/out_file.png"
 *
 * @see {@link https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#screenshot}
 */
 
const args = process.argv.slice(2);

const viewPort = { width: 1280, height: 800 }

const options = {
  path: args[1],
  fullPage: true
}

const headers = new Map();
headers.set(
  'Proxy-Authorization'
);

const puppeteer = require('puppeteer');
(async () => {
  const browser = await puppeteer.launch()
  const page = await browser.newPage()
  await page.setViewport(viewPort)
  await page.setExtraHTTPHeaders(headers);
  await page.authenticate({username:"un", password:"pw"});
  await page.goto(args[0])
  
  // clean page of any offensive UI elements
  var bb = await page.evaluate(function () {
  
    //Hack for some occasional rendering issues with multiline.
    var css = 'textarea{white-space: pre-line !important;}',
    head = document.head || document.getElementsByTagName('head')[0],
    style = document.createElement('style');
    style.type = 'text/css';
    if (style.styleSheet){
      style.styleSheet.cssText = css;
    } else {
      style.appendChild(document.createTextNode(css));
    }
    head.appendChild(style);
    
	//Remove all noscript elements.
	var noscript = document.getElementsByTagName('noscript');
    var index = noscript.length;
	while(index--) {
      noscript[index].parentNode.removeChild(noscript[index]);
    }
	
	//Purge scripts.
    var script = document.getElementsByTagName('script');
    var index = script.length;
    while(index--) {
      script[index].parentNode.removeChild(script[index]);
    }
    var notDlg = document.getElementsByClassName('s4-notdlg'), i;
    for (var i = 0; i < notDlg.length; i ++) {
      notDlg[i].style.display = 'none';
    }
	
	//Hide elements.
    var ribbonrow = document.getElementById("s4-ribbonrow")
    if (ribbonrow) {
      ribbonrow.style.display = 'none';
    };
    var leftpanel = document.getElementById("s4-leftpanel-content")
    if (leftpanel) {
      leftpanel.style.display = 'none';
    };
    return document.documentElement.innerHTML;
  });
  
  //Find first table under the '*XmlFormView' Div
  var clipObj = await page.$("[id$='XmlFormView'] table")
  
  //If we didn't find the table, just take a normal screenshot. At *least* we hid offensive UI elements first.
  if (clipObj){
    console.log("Clip Obj Found")
    options.fullPage = false
    options.clip = await clipObj.boundingBox()
    await clipObj.screenshot(options)
  } else {
    console.log("Clip Obj NOT Found")
    await page.screenshot(options)
  };
  await browser.close()
})()