Add preloadFunction option (#76)

Co-authored-by: Sindre Sorhus <[email protected]>
sindresorhus · Feb 16, 2021 · 9f3e274 · 9f3e274
1 parent c4d7920
commit 9f3e274
Show file tree

Hide file tree

Showing 4 changed files with 53 additions and 1 deletion.
diff --git a/index.d.ts b/index.d.ts
@@ -1,5 +1,5 @@
 /// <reference lib="dom"/>
-import {SetCookie, LaunchOptions, Page, Browser, Headers} from 'puppeteer';
+import {SetCookie, LaunchOptions, Page, Browser, Headers, EvaluateFn} from 'puppeteer';
 
 declare namespace captureWebsite {
 	interface Authentication {
@@ -164,6 +164,13 @@ declare namespace captureWebsite {
 		*/
 		readonly isJavaScriptEnabled?: boolean;
 
+		/**
+		Inject a function to be executed prior to navigation.
+
+		This can be useful for [altering the JavaScript environment](https://github.com/puppeteer/puppeteer/blob/main/docs/api.md#pageevaluateonnewdocumentpagefunction-args). For example, you could define a global method on the `window`, overwrite `navigator.languages` to change the language presented by the browser, or mock `Math.random` to return a fixed value.
+		*/
+		readonly preloadFunction?: EvaluateFn;
+
 		/**
 		Inject [JavaScript modules](https://developers.google.com/web/fundamentals/primers/modules) into the page.
 

diff --git a/index.js b/index.js
@@ -181,6 +181,10 @@ const captureWebsite = async (input, options) => {
 	const browser = options._browser || await puppeteer.launch(launchOptions);
 	const page = await browser.newPage();
 
+	if (options.preloadFunction) {
+		await page.evaluateOnNewDocument(options.preloadFunction);
+	}
+
 	await page.setJavaScriptEnabled(options.isJavaScriptEnabled);
 
 	if (options.debug) {

diff --git a/readme.md b/readme.md
@@ -476,6 +476,15 @@ Overwrite the destination file if it exists instead of throwing an error.
 
 *This option applies only to `captureWebsite.file()`.*
 
+##### preloadFunction
+
+Type: `string | Function`\
+Default: `undefined`
+
+Inject a function to be executed prior to navigation.
+
+This can be useful for [altering the JavaScript environment](https://github.com/puppeteer/puppeteer/blob/main/docs/api.md#pageevaluateonnewdocumentpagefunction-args). For example, you could define a global method on the `window`, overwrite `navigator.languages` to change the language presented by the browser, or mock `Math.random` to return a fixed value.
+
 ### captureWebsite.devices
 
 Type: `string[]`

diff --git a/test.js b/test.js
@@ -1,3 +1,4 @@
+/* global document, window */
 import fs from 'fs';
 import test from 'ava';
 import imageSize from 'image-size';
@@ -852,3 +853,34 @@ test('`inset` option', async t => {
 		});
 	});
 });
+
+test('`preloadFunction` option', async t => {
+	const server = await createTestServer();
+
+	server.get('/', async (request, response) => {
+		response.end(`
+			<body style="margin: 0;">
+				<div style="background-color: black; width: 100px; height: 100px;"></div>
+				<script>
+					window.toRed();
+				</script>
+			</body>
+		`);
+	});
+
+	const pixels = await getPngPixels(await instance(server.url, {
+		width: 100,
+		height: 100,
+		preloadFunction: () => {
+			window.toRed = () => {
+				document.querySelector('div').style.backgroundColor = 'red';
+			};
+		}
+	}));
+
+	t.is(pixels[0], 255);
+	t.is(pixels[1], 0);
+	t.is(pixels[2], 0);
+
+	await server.close();
+});