From b089dae3d469852cfbd33464a01277d024ceb604 Mon Sep 17 00:00:00 2001 From: yandeu <20306025+yandeu@users.noreply.github.com> Date: Tue, 12 Mar 2024 17:53:33 +0100 Subject: [PATCH] puppeteer@22 --- package.json | 4 ++-- src/crawl.ts | 17 +++++++++-------- src/middleware/index.ts | 4 ++-- src/pageFunction.ts | 2 +- src/render.ts | 11 ++++++----- 5 files changed, 20 insertions(+), 18 deletions(-) diff --git a/package.json b/package.json index 5f3f716..b6b2c85 100644 --- a/package.json +++ b/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" diff --git a/src/crawl.ts b/src/crawl.ts index 7697059..e915dc0 100644 --- a/src/crawl.ts +++ b/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,7 +134,7 @@ export const crawl = async ( ssr[i].remove() } }) - .catch(err => { + .catch((err: any) => { if (verbose) console.log('[evaluate] remove SSROnly', err.message) }) @@ -142,7 +142,7 @@ export const crawl = async ( 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: [] } } diff --git a/src/middleware/index.ts b/src/middleware/index.ts index c8ad727..8e9dad3 100644 --- a/src/middleware/index.ts +++ b/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)) } } } diff --git a/src/pageFunction.ts b/src/pageFunction.ts index 16bd8a1..5cdc7ad 100644 --- a/src/pageFunction.ts +++ b/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 diff --git a/src/render.ts b/src/render.ts index 21ff790..c066b24 100644 --- a/src/render.ts +++ b/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()