@browserless/screenshot 10.1.13 → 10.1.15

package/package.json

@@ -2,7 +2,7 @@
   "name": "@browserless/screenshot",
   "description": "Take a clean screenshot of any website",
   "homepage": "https://browserless.js.org/#/?id=screenshoturl-options",
-  "version": "10.1.13",
+  "version": "10.1.15",
   "main": "src/index.js",
   "author": {
     "email": "hello@microlink.io",
@@ -28,7 +28,8 @@
     "screenshot"
   ],
   "dependencies": {
-    "@browserless/goto": "^10.1.13",
+    "@browserless/goto": "^10.1.15",
+    "@kikobeats/time-span": "~1.0.2",
     "debug-logfmt": "~1.0.4",
     "got": "~11.8.6",
     "is-html-content": "~1.0.0",
@@ -40,11 +41,10 @@
     "pretty-ms": "~7.0.1",
     "prism-themes": "~1.9.0",
     "sharp": "~0.32.5",
-    "svg-gradient": "~1.0.3",
-    "time-span": "~4.0.0"
+    "svg-gradient": "~1.0.3"
   },
   "devDependencies": {
-    "@browserless/test": "^10.1.13",
+    "@browserless/test": "^10.1.15",
     "ava": "latest",
     "cheerio": "latest"
   },
@@ -60,7 +60,7 @@
     "timeout": "2m",
     "workerThreads": false
   },
-  "gitHead": "fa7452351dd0afb48bccd6ca2a2712fd733a5d49",
+  "gitHead": "314f90097a623f50a807d403d99313c6f7eb3f54",
   "scripts": {
     "coverage": "exit 0",
     "test": "ava"

package/src/index.js

@@ -2,12 +2,11 @@
 
 const debug = require('debug-logfmt')('browserless:screenshot')
 const createGoto = require('@browserless/goto')
-const prettyMs = require('pretty-ms')
-const timeSpan = require('time-span')
 const pReflect = require('p-reflect')
 
 const isWhiteScreenshot = require('./is-white-screenshot')
 const waitForPrism = require('./pretty')
+const timeSpan = require('./time-span')
 const overlay = require('./overlay')
 
 const getBoundingClientRect = element => {
@@ -19,18 +18,16 @@ const waitForImagesOnViewport = page =>
   page.$$eval('img[src]:not([aria-hidden="true"])', elements =>
     Promise.all(
       elements
-        .filter(
-          el => {
-            if (el.naturalHeight === 0 || el.naturalWeight === 0) return false
-            const { top, left, bottom, right } = el.getBoundingClientRect()
-            return (
-              top >= 0 &&
-              left >= 0 &&
-              bottom <= (window.innerHeight || document.documentElement.clientHeight) &&
-              right <= (window.innerWidth || document.documentElement.clientWidth)
-            )
-          }
-        )
+        .filter(el => {
+          if (el.naturalHeight === 0 || el.naturalWeight === 0) return false
+          const { top, left, bottom, right } = el.getBoundingClientRect()
+          return (
+            top >= 0 &&
+            left >= 0 &&
+            bottom <= (window.innerHeight || document.documentElement.clientHeight) &&
+            right <= (window.innerWidth || document.documentElement.clientWidth)
+          )
+        })
         .map(el => el.decode())
     )
   )
@@ -51,75 +48,76 @@ const waitForElement = async (page, element) => {
 module.exports = ({ goto, ...gotoOpts }) => {
   goto = goto || createGoto(gotoOpts)
 
-  return page => async (
-    url,
-    {
-      element,
-      codeScheme = 'atom-dark',
-      overlay: overlayOpts = {},
-      waitUntil = 'auto',
-      ...opts
-    } = {}
-  ) => {
-    let screenshot
-    let response
+  return page =>
+    async (
+      url,
+      {
+        element,
+        codeScheme = 'atom-dark',
+        overlay: overlayOpts = {},
+        waitUntil = 'auto',
+        ...opts
+      } = {}
+    ) => {
+      let screenshot
+      let response
 
-    const beforeScreenshot = response => {
-      const timeout = goto.timeouts.action(goto.timeouts.base(opts.timeout))
-      return Promise.all(
-        [
-          {
-            fn: () => page.evaluate('document.fonts.ready'),
-            debug: 'beforeScreenshot:fontsReady'
-          },
-          {
-            fn: () => waitForPrism(page, response, { codeScheme, ...opts }),
-            debug: 'beforeScreenshot:waitForPrism'
-          },
-          {
-            fn: () => waitForImagesOnViewport(page),
-            debug: 'beforeScreenshot:waitForImagesOnViewport'
-          }
-        ].map(({ fn, ...opts }) => goto.run({ fn: fn(), ...opts, timeout }))
-      )
-    }
+      const beforeScreenshot = response => {
+        const timeout = goto.timeouts.action(goto.timeouts.base(opts.timeout))
+        return Promise.all(
+          [
+            {
+              fn: () => page.evaluate('document.fonts.ready'),
+              debug: 'beforeScreenshot:fontsReady'
+            },
+            {
+              fn: () => waitForPrism(page, response, { codeScheme, ...opts }),
+              debug: 'beforeScreenshot:waitForPrism'
+            },
+            {
+              fn: () => waitForImagesOnViewport(page),
+              debug: 'beforeScreenshot:waitForImagesOnViewport'
+            }
+          ].map(({ fn, ...opts }) => goto.run({ fn: fn(), ...opts, timeout }))
+        )
+      }
 
-    const takeScreenshot = async opts => {
-      screenshot = await page.screenshot(opts)
-      const isWhite = await isWhiteScreenshot(screenshot)
-      if (isWhite) {
-        await goto.waitUntilAuto(page, opts)
+      const takeScreenshot = async opts => {
         screenshot = await page.screenshot(opts)
+        const isWhite = await isWhiteScreenshot(screenshot)
+        if (isWhite) {
+          await goto.waitUntilAuto(page, opts)
+          screenshot = await page.screenshot(opts)
+        }
+        return { isWhite }
       }
-      return { isWhite }
-    }
 
-    page.on('dialog', dialog => pReflect(dialog.dismiss()))
+      page.on('dialog', dialog => pReflect(dialog.dismiss()))
 
-    const timeScreenshot = timeSpan()
+      const timeScreenshot = timeSpan()
 
-    if (waitUntil !== 'auto') {
-      ;({ response } = await goto(page, { ...opts, url, waitUntil }))
-      const [screenshotOpts] = await Promise.all([
-        waitForElement(page, element),
-        beforeScreenshot(response)
-      ])
-      screenshot = await page.screenshot({ ...opts, ...screenshotOpts })
-      debug('screenshot', { waitUntil, duration: prettyMs(timeScreenshot()) })
-    } else {
-      ;({ response } = await goto(page, { ...opts, url, waitUntil, waitUntilAuto }))
-      async function waitUntilAuto (page, { response }) {
+      if (waitUntil !== 'auto') {
+        ;({ response } = await goto(page, { ...opts, url, waitUntil }))
         const [screenshotOpts] = await Promise.all([
           waitForElement(page, element),
           beforeScreenshot(response)
         ])
-        const { isWhite } = await takeScreenshot({ ...opts, ...screenshotOpts })
-        debug('screenshot', { waitUntil, isWhite, duration: prettyMs(timeScreenshot()) })
+        screenshot = await page.screenshot({ ...opts, ...screenshotOpts })
+        debug('screenshot', { waitUntil, duration: timeScreenshot() })
+      } else {
+        ;({ response } = await goto(page, { ...opts, url, waitUntil, waitUntilAuto }))
+        async function waitUntilAuto (page, { response }) {
+          const [screenshotOpts] = await Promise.all([
+            waitForElement(page, element),
+            beforeScreenshot(response)
+          ])
+          const { isWhite } = await takeScreenshot({ ...opts, ...screenshotOpts })
+          debug('screenshot', { waitUntil, isWhite, duration: timeScreenshot() })
+        }
       }
-    }
 
-    return Object.keys(overlayOpts).length === 0
-      ? screenshot
-      : overlay(screenshot, { ...opts, ...overlayOpts, viewport: page.viewport() })
-  }
+      return Object.keys(overlayOpts).length === 0
+        ? screenshot
+        : overlay(screenshot, { ...opts, ...overlayOpts, viewport: page.viewport() })
+    }
 }

package/src/pretty/index.js

@@ -4,11 +4,10 @@ const debug = require('debug-logfmt')('browserless:screenshot')
 const isHtmlContent = require('is-html-content')
 const { readFile } = require('fs/promises')
 const { getExtension } = require('mime')
-const prettyMs = require('pretty-ms')
-const timeSpan = require('time-span')
 const path = require('path')
 
 const getPrism = readFile(path.resolve(__dirname, 'prism.js'))
+const timeSpan = require('../time-span')
 const getTheme = require('./theme')
 const getHtml = require('./html')
 
@@ -54,5 +53,5 @@ module.exports = async (page, response, { timeout, codeScheme, styles, scripts,
   await page.setContent(html)
   await inject(page, { timeout, modules, scripts, styles })
 
-  debug('pretty', { duration: prettyMs(timePretty()) })
+  debug('pretty', { duration: timePretty() })
 }

package/src/time-span.js

@@ -0,0 +1 @@
+module.exports = require('@kikobeats/time-span')({ format: require('pretty-ms') })