puppeteer-screenshot-tester - npm Package Compare versions

Comparing version 1.0.4 to 1.0.5

examples/google.test.js

@@ -1,3 +0,3 @@
-const puppeteer = require( 'puppeteer')
-const ScreenTest = require('../src/index')
+const puppeteer = require('puppeteer')
+const ScreenshotTester = require('../src/index')
 
@@ -22,14 +22,18 @@ describe('google test', () => {
     // create ScreenshotTester with optional config
-    const tester = await ScreenTest()
+    const tester = await ScreenshotTester(0.1, false, false, [], {
+      transparency: 0.5
+    })
 
     // setting up puppeteer
-    const browser = await puppeteer.launch()
+    const browser = await puppeteer.launch({headless: false})
     const page = await browser.newPage()
     await page.setViewport({width: 1920, height: 1080})
     await page.goto('https://www.google.com', { waitUntil: 'networkidle0' })
-    await page.type('#lst-ib', 'Hello', { delay: 100 });
+    await page.type('input[title="Search"]', 'Hello', { delay: 100 })
 
     // call our tester with browser page returned by puppeteer browser
     // second parameter is optional it's just a test name if provide that's filename
-    const result = await tester(page, 'test2', { fullPage: true })
+    const result = await tester(page, 'test2', {
+      fullPage: true,
+    })
     await browser.close()
@@ -39,4 +43,3 @@
     expect(result).toBe(true)
-
   })
 })

package.json

 {
   "name": "puppeteer-screenshot-tester",
-  "version": "1.0.4",
+  "version": "1.0.5",
   "description": "Small library that allows us to compare screenshots generated by puppeteer in our tests",
   "main": "src/index.js",
   "scripts": {
-    "test": "jest"
+    "test": "jest",
+    "contributors:add": "all-contributors add",
+    "contributors:generate": "all-contributors generate"
   },
@@ -38,5 +40,6 @@ "bugs": {
   "devDependencies": {
-    "jest": "22.4.3",
-    "puppeteer": "1.2.0"
+    "all-contributors-cli": "^5.4.1",
+    "jest": "23.6.0",
+    "puppeteer": "1.11.0"
   }
 }

README.md

@@ -9,4 +9,5 @@ puppeteer-screenshot-tester
 
-Instalation
+Installation
 --------------
+To use Puppeteer Screenshot Tester in your project, run:
 ```
@@ -24,3 +25,4 @@ yarn add --dev puppeteer-screenshot-tester
 -------------
-require tester library
+Require the `puppeteer-screenshot-tester` library:
+
 ```js
@@ -30,39 +32,53 @@ const ScreenshotTester = require('puppeteer-screenshot-tester')
 
-create test runner with optional config
+### Initialise Screenshot Tester
 
-#### constructor([threshold = 0][, includeAA = false[, ignoreColors = false[, ignoreRectangles = [] [, errorSettings = Object] ]]])
+```js
+const tester = await ScreenshotTester()
+```
+
+#### Optional arguments:
+```js
+const tester = await ScreenshotTester(
+  [threshold = 0][, includeAA = false[, ignoreColors = false[, ignoreRectangles = [] [, errorSettings = Object]]]]
+)
+```
+
 - `threshold` <[number]> A threshold value <0,1> default set to 0, max ratio of difference between images
-- `includeAA` <[boolean]> should include anti aliasing?
-- `ignoreColors` <[boolean]> should ignore colors?
-- `ignoreRectangles` <[Array<Array[x, y, width, height]>]> should ignore rectangles? example: `[[325,170,100,40], [10,10,200,200]]`
-- `errorSettings` <[Object]> change how to display errors (errorType: `flat` | `movement` | `flatDifferenceIntensity` | `movementDifferenceIntensity` | `diffOnly`): 
-```    
-{
-  errorColor: {
-    red: 255,
-    green: 0,
-    blue: 255
-  },
-  errorType: 'flat',
-  transparency: 0.7
-}
-```
+- `includeAA` <[boolean]> Should include anti aliasing?
+- `ignoreColors` <[boolean]> Should ignore colors?
+- `ignoreRectangles` <[Array<Array[x, y, width, height]>]> Should ignore rectangles? example: `[[325,170,100,40], [10,10,200,200]]`
+- `errorSettings` <[Object]> change how to display errors (errorType: `flat` | `movement` | `flatDifferenceIntensity` | `movementDifferenceIntensity` | `diffOnly`):
+    ```
+    {
+      errorColor: {
+        red: 255,
+        green: 0,
+        blue: 255
+      },
+      errorType: 'flat',
+      transparency: 0.7
+    }
+    ```
 - returns: <[function]> resolves to function
 
+### Run the test
+
 ```js
-const tester = await ScreenshotTester()
+const result = await tester(page)
 ```
 
-create test runner with optional config
+#### Required arguments:
+- `page` <[BrowserPage]> BrowserPage returned by puppeteer when calling `puppeteer.launch().newPage()`
 
-#### constructor(page[, name = 'test'[, screenshotOptions = {}]])
-- `page` <[BrowserPage]> BrowserPage returned by puppeteer when calling `puppeteer.lunch().newPage()`
-- `name` <[string]> name of created screenshot 'test' by default
-- `screenshotOptions` <[Object]> options passed to puppeteer's screenshot method [https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#pagescreenshotoptions](https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#pagescreenshotoptions)
-- returns: <[boolean]> true if images are the same or there is no image to compare (first run)
+#### Optional arguments:
 ```js
-const result = tester(page)
+const result = await tester(page[, name = 'test'[, screenshotOptions = {}]])
 ```
 
+- `name` <[string]> name of created screenshot 'test' by default
+- `screenshotOptions` <[Object]> options passed to Puppeteer's screenshot method [See the Puppeteer documentation for more info](https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#pagescreenshotoptions)
 
+#### Returns
+- <[boolean]> true if images are the same or there is no image to compare (first run)
+
 Examples
@@ -72,4 +88,4 @@ ----------------
 ```javascript
-const puppeteer = require( 'puppeteer')
-const ScreenTest = require('puppeteer-screenshot-tester')
+const puppeteer = require('puppeteer')
+const ScreenshotTester = require('puppeteer-screenshot-tester')
 
@@ -94,3 +110,5 @@ describe('google test', () => {
     // create ScreenshotTester with optional config
-    const tester = await ScreenTest()
+    const tester = await ScreenshotTester(0.8, false, false, [], {
+      transparency: 0.5
+    })
 
@@ -102,7 +120,9 @@ // setting up puppeteer
     await page.goto('https://www.google.com', { waitUntil: 'networkidle0' })
-    await page.type('#lst-ib', 'Hello', { delay: 100 });
+    await page.type('input[title="Search"]', 'Hello', { delay: 100 })
 
     // call our tester with browser page returned by puppeteer browser
     // second parameter is optional it's just a test name if provide that's filename
-    const result = await tester(page, 'test2')
+    const result = await tester(page, 'test2', {
+      fullPage: true,
+    })
     await browser.close()
@@ -112,5 +132,16 @@
     expect(result).toBe(true)
-
   })
 })
 ```
+
+## Contributors
+
+Thanks goes to these wonderful people :sunglasses: :
+
+<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
+<!-- prettier-ignore -->
+| [<img src="https://avatars0.githubusercontent.com/u/3284639?v=4" width="100px;"/><br /><sub><b>Kemal Erdem</b></sub>](https://github.com/burnpiro)<br />[💻](https://github.com/burnpiro/puppeteer-screenshot-tester/commits?author=burnpiro "Code") [📖](https://github.com/burnpiro/puppeteer-screenshot-tester/commits?author=burnpiro "Documentation") [👀](#review-burnpiro "Reviewed Pull Requests") | [<img src="https://avatars2.githubusercontent.com/u/426677?v=4" width="100px;"/><br /><sub><b>Andi Smith</b></sub>](http://www.andismith.com)<br />[📖](https://github.com/burnpiro/puppeteer-screenshot-tester/commits?author=andismith "Documentation") [⚠️](https://github.com/burnpiro/puppeteer-screenshot-tester/commits?author=andismith "Tests") | [<img src="https://avatars0.githubusercontent.com/u/3769985?v=4" width="100px;"/><br /><sub><b>Max Harris</b></sub>](https://github.com/maxharris9)<br />[🐛](https://github.com/burnpiro/puppeteer-screenshot-tester/issues?q=author%3Amaxharris9 "Bug reports") [💻](https://github.com/burnpiro/puppeteer-screenshot-tester/commits?author=maxharris9 "Code") |
+| :---: | :---: | :---: |
+<!-- ALL-CONTRIBUTORS-LIST:END -->
+
+This project follows the [all-contributors](https://github.com/kentcdodds/all-contributors) specification. Contributions of any kind welcome!

src/index.js

@@ -66,3 +66,3 @@ const resemble = require('node-resemble-js');
               // check if images are the same dimensions and mismatched pixels are below threshold
-              if (data.isSameDimensions === false || Number(data.misMatchPercentage) > threshold * 100) {
+              if (data.isSameDimensions === false || Number(data.misMatchPercentage) > threshold) {
                 // save diff to test folder with '-diff' postfix
@@ -79,3 +79,3 @@ data.getDiffImage().pack().pipe(fs.createWriteStream(`${saveFolder}/${name}-diff${ext}`));
         fs.writeFileSync(`${saveFolder}/${name}${ext}`, screenShot);
-        console.log('There was nothing to compare, current screes saved as default');
+        console.log('There was nothing to compare, current screens saved as default');
         return true;
@@ -108,2 +108,2 @@ }
 
-module.exports = ScreenTestFactory
+module.exports = ScreenTestFactory

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Number of package files

11

increased by22.22%

Lines of code

135

increased by3.85%

Number of lines in readme file

140

increased by27.27%

Worsened metrics

Total package byte prevSize

473753

decreased by-13.27%

Dev dependency count

3

increased by50%

No dependency changes