neuroradiology / save-page-state

A chrome extension to save the state of a page for further analysis

Save Page State

A chrome extension to save the state of a page for further analysis

Highlights

• DOM Snapshot
• MHTML file
• Screenshot
• Metadata

Install

Install the chrome extension from the chrome web store.

Or create a custom chrome extension with this repo with limited access permission

Customize

Restrict Access Permission

In manifest.json (/src/manifest.json), replace the *://*/* URL pattern with your own project URL you wish to save the page states from.

{
	...
	"content_scripts": [
		{
			"matches": ["*://*/*"], // <- change this url pattern
			"js": ["js/content.js"]
		}
	],
	"permissions": ["activeTab", "pageCapture", "*://*/*"]  // <- change this url pattern
	...
}

Install dependencies

npm i

Build

npm run build

Builds to /build/prod

Publish

Create a zip file from /build/prod and upload it to the chrome web store.

Features

DOM Snapshot

An HTML file containing the state of the DOM.

MHTML file

An MHTML page with encapsulated resources, so you could immediately check the layout by opening the MHTML file in Chrome.

Screenshot

A PNG image of the viewport.

Metadata

Text file with extra metadata useful for debugging with the exact same state.

• height: viewport height
• width: viewport width
• incognito: is page loaded in incognito mode
• status: page loading status
• title: page title
• url: page URL
• chromeVersion: chrome version

Maintainer