puppeteer@22

package.json

@@ -48,7 +48,6 @@
   "dependencies": {
     "html-minifier-terser": "^5.1.1",
     "node-cli": "^0.2.3",
-    "puppeteer": "^9.1.1",
     "serve-handler": "^6.1.3"
   },
   "devDependencies": {
@@ -67,12 +66,13 @@
     "npm-run-all": "^4.1.5",
     "prettier": "^2.3.0",
     "publish-cli": "^1.7.0",
+    "puppeteer": "^22.4.1",
     "rimraf": "^3.0.2",
     "serve": "^11.3.2",
     "typescript": "^4.2.3"
   },
   "engines": {
-    "node": "^14.15 || >=16"
+    "node": ">=18"
   },
   "funding": {
     "url": "https://github.com/sponsors/yandeu"

src/crawl.ts

@@ -23,7 +23,7 @@ const matchInArrayOfRegExp = (str: string, expressions: RegExp[]) => {
 }
 
 export const crawl = async (
-  page: puppeteer.Page,
+  page: Page,
   url: string,
   allowList: RegExp[],
   blockList: RegExp[],
@@ -43,7 +43,7 @@ export const crawl = async (
     // list of additional resources
     const resources: string[] = []
 
-    page.on('request', async req => {
+    page.on('request', async (req: any) => {
       // copy resources
       const pageURL = new URL(url)
       const reqURL = new URL(req.url())
@@ -59,7 +59,7 @@ export const crawl = async (
 
       // check for "noSSR" attribute
       if (req.url() && req.resourceType() === 'script') {
-        const noSSR = await page.evaluate(pageFunction, req.url(), 'nossr', 'src').catch(err => {
+        const noSSR = await page.evaluate(pageFunction, req.url() as string, 'nossr', 'src').catch((err: any) => {
           if (verbose) console.log('[evaluate] noSSR attribute', err.message)
         })
         // block if the script should not be executed server side
@@ -68,7 +68,7 @@ export const crawl = async (
 
       // check for "inline" attribute
       if (req.url() && req.resourceType() === 'stylesheet') {
-        const inline = await page.evaluate(pageFunction, req.url(), 'inline', 'href').catch(err => {
+        const inline = await page.evaluate(pageFunction, req.url(), 'inline', 'href').catch((err: any) => {
           if (verbose) console.log('[evaluate] inline attribute', err.message)
         })
         if (inline) return req.continue()
@@ -93,7 +93,7 @@ export const crawl = async (
       req.abort()
     })
 
-    page.on('response', async res => {
+    page.on('response', async (res: any) => {
       const responseUrl = res.url()
       const sameOrigin = new URL(responseUrl).origin === new URL(url).origin
       const isStylesheet = res.request().resourceType() === 'stylesheet'
@@ -134,15 +134,15 @@ export const crawl = async (
           ssr[i].remove()
         }
       })
-      .catch(err => {
+      .catch((err: any) => {
         if (verbose) console.log('[evaluate] remove SSROnly', err.message)
       })
 
     // replace stylesheets in the page with their equivalent <style>.
     await page
       .$$eval(
         'link[rel="stylesheet"]',
-        (links, content: any) => {
+        (links: any, content: any) => {
           links.forEach((link: any) => {
             const cssText = content[link.href]
             if (cssText) {
@@ -154,7 +154,7 @@ export const crawl = async (
         },
         stylesheetContents
       )
-      .catch(err => {
+      .catch((err: any) => {
         if (verbose) console.log('[evaluate] $$eval link[rel="stylesheet"]', err.message)
       })
 
@@ -171,6 +171,7 @@ export const crawl = async (
 
     return { html, resources }
   } catch (err) {
+    // @ts-ignore
     error(err.message)
     return { html: 'error while crawling', resources: [] }
   }

src/middleware/index.ts

@@ -135,14 +135,14 @@ export default (options: MiddlewareOptions = {}) => {
 
       // TODO(yandeu): Serve new requests from cache while HeadlessChrome is re-rendering the page
 
-      if (shouldPrerender(req)) renderAndCache(req, res, next, false).catch(err => console.log('err', err))
+      if (shouldPrerender(req)) renderAndCache(req, res, next, false).catch((err: any) => console.log('err', err))
       return res.send(cached.file)
     }
     // prerender and return
     else {
       if (!shouldPrerender(req)) return next()
       console.log('PRERENDER', req.url)
-      return renderAndCache(req, res, next, true).catch(err => console.log('err', err))
+      return renderAndCache(req, res, next, true).catch((err: any) => console.log('err', err))
     }
   }
 }

src/pageFunction.ts

@@ -1,6 +1,6 @@
 // useful article: https://developers.google.com/web/tools/puppeteer/articles/ssr
 
-export function pageFunction(url: string, attr: 'nossr' | 'inline', linkTag: 'src' | 'href') {
+export function pageFunction(url: string, attr: 'nossr' | 'inline' | string, linkTag: 'src' | 'href' | string) {
   // http://something.com/js/script.js
   const absoluteURL = document.querySelector(`[${linkTag}='${url}']`)
   // /js/script.js

src/render.ts

@@ -52,8 +52,8 @@ export const render = async (
 
   // start the browser
   if (!silent) step('Starting headless browser')
-  const browser = await puppeteer.launch({ headless: true }).catch(err => exitWithError(err.message))
-  const browserTab = await browser.newPage()
+  const browser = await puppeteer.launch({ headless: true }).catch((err: any) => exitWithError(err.message))
+  const browserTab = await browser.newPage().catch((err: any) => exitWithError(err.message))
 
   // pages (queue) to crawl and render
   const pages: string[] = []
@@ -91,7 +91,7 @@ export const render = async (
     // crawl the page
     const _url = trim(`${input}/${page}`)
 
-    const { html, resources } = await crawl(browserTab, _url, allow, block, exec, javaScriptEnabled).catch(err =>
+    const { html, resources } = await crawl(browserTab, _url, allow, block, exec, javaScriptEnabled).catch((err: any) =>
       exitWithError(err.message)
     )
 
@@ -117,7 +117,7 @@ export const render = async (
 
     try {
       // create directory
-      await fs.mkdir(_filePath.replace(/\/[a-z0-6._-]+$/gm, ''), { recursive: true }) // .catch(err => error(err.message))
+      await fs.mkdir(_filePath.replace(/\/[a-z0-6._-]+$/gm, ''), { recursive: true }) // .catch((err: any) => error(err.message))
 
       // ensure .html extension
       if (!/\.html$/.test(_filePath)) _filePath += '.html'
@@ -127,6 +127,7 @@ export const render = async (
     } catch (err) {
       comment('')
       error(`Error while rendering '${page}'`)
+      // @ts-ignore
       comment(`  ⠕ ${err.message}`)
       comment('')
     }
@@ -147,7 +148,7 @@ export const render = async (
 
   // close browser
   await browserTab.close()
-  await browser.close().catch(err => exitWithError(err.message))
+  await browser.close().catch((err: any) => exitWithError(err.message))
 
   // close server
   if (server) await exitServe()