https://github.com/wnetking/puppeteer-test

Created screenshot of the page and compare with some model picture.
https://github.com/wnetking/puppeteer-test

pixelmatch puppeteer screenshots

Last synced: 2 months ago
JSON representation

Created screenshot of the page and compare with some model picture.

• Host: GitHub
• URL: https://github.com/wnetking/puppeteer-test
• Owner: wnetking
• Created: 2018-02-18T20:37:15.000Z (over 8 years ago)
• Default Branch: master
• Last Pushed: 2018-03-05T14:43:46.000Z (over 8 years ago)
• Last Synced: 2025-09-05T07:43:40.942Z (10 months ago)
• Topics: pixelmatch, puppeteer, screenshots
• Language: JavaScript
• Homepage:
• Size: 4.22 MB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
puppeteer-test

========

You can created screenshot of the page and compare with some model picture.

Features

--------

- create screenshot on diferent breackpoints(1920(desctop), iPad, iPhoneX)

- create diff image between model picture and 1920(desctop)

How to use:

--------

You need modify config.js

    {

      path: 'path to you website',

      layouts: 3, // number of layouts

      desktopViewport: {

        width: 1920,

        height: 950

      }, // desctop vieport

      output: 'images/screenshots', // screenshots output

      designe: 'images/designe', // module pictures

      launch: {

        headless: true

      }, // settings for puppeteer.launch

      pixelmatch: {

        threshold: 0.5

      } // settings for pixelmatch

    }

The 'images' folder you need to create it by yourself. Inside this folder you need create folders  'screenshots' and 'designe'. 

Model images need put in folder 'designe/${layoutNuber}-layout'. 

  

Contribute

----------

- Issue Tracker: github.com/$project/$project/issues

- Source Code: github.com/$project/$project

Support

-------

If you are having issues, please let me know.