Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@cznec/screenshot-compare

Package Overview
Dependencies
Maintainers
1
Versions
8
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@cznec/screenshot-compare - npm Package Compare versions

Comparing version 1.0.8 to 1.0.9

2

package.json
{
"name": "@cznec/screenshot-compare",
"author": "@cznec",
"version": "1.0.8",
"version": "1.0.9",
"homepage": "https://github.com/cznec/screenshot-compare",

@@ -6,0 +6,0 @@ "keywords": [

# @cznec/screenshot-compare
Website testing tool for screenshot capture and compare.
Website **screenshot compare / collect.**
This package is wraps:
https://www.npmjs.com/package/puppeteer
https://www.npmjs.com/package/pixelmatch
for easy collect and compare website screenshots.
Package is under construction 🚧 but it works! 😉
### Installing
## Features
- **collect:** collect screenshots collection for late compare
- **compare:** compare new screenshots with collected screenshots
## Install
```

@@ -32,3 +41,3 @@ npm install --save-dev @cznec/screenshot-compare

Run screenshot collector
Run screenshots collection **collect**
```bash

@@ -38,3 +47,3 @@ npx screenshot-compare collect ./collection.js

Run screenshot compare
Run screenshot collection **compare**
```bash

@@ -44,2 +53,7 @@ npx screenshot-compare compare ./collection.js

Run screenshot compare / collect on **specific Screenshot() names**
```bash
npx screenshot-compare compare ./collection.js name1 name1 ...
```
## Advanced usage

@@ -80,15 +94,25 @@

```
Run screenshot collector for specific screenshots names
```bash
npx screenshot-compare collect ./collection.js google_2
```
## Collect method
## API
- #### Screenshot() methods:
- url( String ) - final url for take screenshot
- name( String ) - **collection unique!** screenshot name
- saveTo( String ) - relative path from collection file to store screenshots
- pageLog( Boolean ) - print console log of page
- delay( Number ) - delay after url redirect and before take screenshot
- viewport( Object ) - ```{ width: Number, height: Number, deviceScaleFactor: Number }``` [docs](https://github.com/puppeteer/puppeteer/blob/v2.1.1/docs/api.md#pagesetviewportviewport)
- before( async Function(page, screenshot, collector) )
- page: puppeteer Page class - [docs](https://github.com/puppeteer/puppeteer/blob/v2.1.1/docs/api.md#class-page)
- screenshot: current screenshot Object ( Screenshot.get() )
- collector: Collector class reference ( for exaple useful for Collector.delay( Number ) )
## Collect command
Capture PNG screenshot and save them with name defined in collection file.
Also create screenshot definition stamp. This stamp is compared in
Also create screenshot definition stamp. This stamp is compared in compare command.
## Compare method
## Compare command
Compare captured screenshots and save ..._test.png file and ..._diff.png file.
Print pixel and percentage diff.
Also check screenshot definition stamp and alert if is not equal.
More later? 🙃
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc