Merge pull request #103 from pip8786/async-type (737e2ee)
Change the default type of the browser to BrowserAsync so typescript users can use this library with async (a499ed5)
Merge pull request #102 from wswebcreation/chore/update-ff-edge (7feb861)
chore: update ff and edge screenshots (8fb8034)

Assets 2

17 Oct 15:58

github-actions

v5.0.0

e192559

Release 5.0.0

A new version, hooray!!!!!!!

Lets first start with the breaking change

💥 Breaking Change

The mismatch percentage was a Number({number}.toFixed(2)). This was only not accurate enough, the reason for this is that the average screen resolution is around 1920x1080. I want this module to be able to detect at least a 10x10 pixel difference.

1920x1080 = 2073600 pixels, a difference of 10x10 is 100 ,which means 0.005% difference (0.00482253).

Number(0.00482253.toFixed(2)) = 0 and Number(0.00482253.toFixed(3)) = 0.005

So based on this release you will have a failing test.

This means that all tests that you have executed with V4 or lower might now result in a failure due to this. If that's the case then update your baseline by first checking the difference and then copying the actual screenshots to your baseline

NOTE:
If you don't want to have breaking tests because of this change then change all your assertions from this

it('should compare an element successful', async () => {
  await expect(
    await browser.checkScreen()
  .toEqual(0)
})

to this

it('should compare an element successful', async () => {
  await expect(
    Number((await browser.checkScreen()).toFixed(2))
  .toEqual(0)
})

or this

it('should compare an element successful', async () => {
  const result = await browser.checkScreen()

  await expect(
    Number(result.toFixed(2))
  .toEqual(0)
})

💅 Polish

Update ResembleJS to the latest version 4.1.0
add support for NodeJS 18
add offsets for iPhone 14 series
replaced chalk with a custom function

🐛 Bug Fix

In some cases automatically scrolling an element in the view will create incorrect screenshots. By setting the class-option autoElementScroll to false you need to take care of your own scrolling.
For more info see this
Prevent tsconfig.json from being published which causes a problem with the 'includes' field, tnx to
Luis Merino
fix some devices positions

🚀 New Features

iOS device corners/notch/dynamic island can be added in the screenshots. This can be enabled with a new class-option which is called addIOSBezelCorners. If set to true the iOS screenshots will have rounded corners and, if applicable, the iOS notch/dynamic island. See below for an example.

Not all devices have these options and it will only be enabled if it matches certain device names. See here for all supported devices

Assets 2

01 Aug 19:03

github-actions

v4.0.0

d66e0df

Release 4.0.0

💥 Breaking Change

element screenshots are now automatically scrolled to the top of the screen before taking a screenshot. When done it will automatically scroll back to the original position. This will increase the accuracy but will also result in comparison errors when you migrate from version 3 to 4.

🚀 New Features

add support for for iPhones/iPads in landscape mode
add support for landscape mode for Android phones and tablets when ChromeDriver screenshots are made

NOTE: A ChromeDriver screenshot is taken by default, when you add the 'appium:nativeWebScreenshot': true-capability it will take a full screen (with status, address and toolbar) screenshot. Landscape mode will work for Android phones but not when enabled for Tablets
if a screenshot from a device was rotated this module will automatically rotate it back to landscape
iPads in landscape mode can have an opened side menu bar. This can result in errors for the screenshots when they are compared. When using the the following in your config the module options will automatically block out the side bar during comparisons, see code example and image below

    services: [
        [
            "image-comparison",
            // The options
            {
                // ... more options
                blockOutSideBar: true,
                // ... more options
            },
        ],
    ],

element screenshots are now automatically scrolled to the top of the screen before taking a screenshot. When done it will automatically scroll back to the original position. This will increase the accuracy

💅 Polish

Slower devices had issues with processing the injected CSS, this has now been improved

🐛 Bug Fix

fix iOS 15 iPad address bar issues, see #76
fixes #77, return types are now Promises
fixes #45, Screen comparison for iPad(landscape) not fully ignoring address bar
fixes wswebcreation/webdriver-image-comparison#107, Full Page scrolling doesn't work out of the box for all websites

fix wswebcreation/webdriver-image-comparison#109, Throw proper error when element height/width is 0
It will now throw a descriptive error when an element doesn't have the right dimensions to be used for an element screenshot

Error: The element, with selector "$([id="root"])",is not visible. The dimensions are 1366x0
 at /Users/wimselles/Git/webdriver-image-comparison/lib/methods/rectangles.ts:45:11
 at step (/Users/wimselles/Git/webdriver-image-comparison/build/methods/rectangles.js:33:23)
 at Object.next (/Users/wimselles/Git/webdriver-image-comparison/build/methods/rectangles.js:14:53)
 at fulfilled (/Users/wimselles/Git/webdriver-image-comparison/build/methods/rectangles.js:5:58)

this module didn't take into account that iPhones in Landscape mode that had a notch (faceId) also have a safe area. Now this is properly calculated and (element) screenshots are now correct