I am trying to run Lighthouse via Puppeteer in a public.ecr.aws/lambda/nodejs Docker image using chrome-aws-lambda, and no matter what website I send to Lighthouse, I always get errors like this:
Chrome didn't collect any screenshots during the page load. Please m ake sure there is content visible on the page, and then try re-running Lighthouse. (NO_SCREENSHOTS)
Note that I've tried sending it VERY fast loading pages like this, so other tips online related to this error that claim the site is just too slow doesn't seem correct to me.
/Dockerfile
FROM public.ecr.aws/lambda/nodejs:latest
RUN cd /var/task/ & npm install puppeteer-core chrome-aws-lambda lighthouse --save-prod
RUN cd /var/task/ & npm install puppeteer --save-dev
/docker-compose.yml
version: "3.5"
services:
lighthouse:
build:
context: .
networks:
- lighthousenetwork
ports:
- "8080:8080"
volumes:
- ./task/:/var/task/:delegated
command: index.handler
networks:
lighthousenetwork:
driver: bridge
/task/index.js
const chromium = require('chrome-aws-lambda');
const lighthouse = require('lighthouse');
exports.handler = async (event, context, callback) => {
let response = null;
let browser = null;
try {
browser = await chromium.puppeteer.launch({
args: [...chromium.args, "--remote-debugging-port=9222"],
defaultViewport: chromium.defaultViewport,
executablePath: await chromium.executablePath,
headless: chromium.headless,
ignoreHTTPSErrors: true,
});
const options = {
output: "json",
preset: 'mobile',
onlyCategories: ["performance", "seo", "accessibility", "best-practices"],
port: 9222,
}
const url = 'https://developer.mozilla.org/en-US/docs/Web/API/Window/DOMContentLoaded_event';
const result = await lighthouse(url, options);
console.log(`Audited ${url} in ${result.lhr.timing.total} ms.`);
const report = JSON.parse(result.report);
response = {
statusCode: 200,
body: {
'url': url,
'Performance': report['categories']['performance']['score'],
'Accessibility': report['categories']['accessibility']['score'],
'SEO': report['categories']['seo']['score'],
'BestPractices': report['categories']['best-practices']['score'],
'ErrorMessage': report['audits']['speed-index']['errorMessage']
}
}
} catch (error) {
return callback(error);
} finally {
if (browser !== null) {
await browser.close();
}
}
return callback(null, response);
};
Start the Docker container:
$ docker-compose up
Trigger the function handler:
$ curl -XPOST "http://localhost:8080/2015-03-31/functions/function/invocations" -d '{"payload":"hello world!"}'
Output:
{"statusCode":200,"body":{"url":"https://developer.mozilla.org/en-US/docs/Web/API/Window/DOMContentLoaded_event","Performance":null,"Accessibility":0.91,"SEO":0.89,"BestPractices":1,"ErrorMessage":"Chrome didn't collect any screenshots during the page load. Please make sure there is content visible on the page, and then try re-running Lighthouse. (NO_SCREENSHOTS)"}}