add unit tests

packages/service/src/matcher.ts

@@ -82,6 +82,6 @@ export async function toMatchTabbablePageSnapshot (
  expectedResult: number | ExpectWebdriverIO.PartialMatcher,
  options: WdioCheckFullPageMethodOptions
 ) {
- const result = await browser.checkFullPageScreen(tag, options)
+ const result = await browser.checkTabbablePage(tag, options)
  return compareResult(result, expectedResult)
 }

packages/service/tests/matcher.test.ts

@@ -0,0 +1,46 @@
+import { describe, it, vi, expect } from 'vitest'
+import {
+ toMatchScreenSnapshot, toMatchFullPageSnapshot,
+ toMatchElementSnapshot, toMatchTabbablePageSnapshot
+} from '../src/matcher.js'
+
+const browser = {
+ checkScreen: vi.fn().mockResolvedValue(123),
+ checkFullPageScreen: vi.fn().mockResolvedValue(123),
+ checkElement: vi.fn().mockResolvedValue(123),
+ checkTabbablePage: vi.fn().mockResolvedValue(123)
+} as any as WebdriverIO.Browser
+
+describe('custom visual matcher', () => {
+ it('toMatchScreenSnapshot', async () => {
+ await expect(toMatchScreenSnapshot(browser, 'foo', 123, {})).resolves.toEqual({
+ pass: true,
+ message: expect.any(Function)
+ })
+ expect(browser.checkScreen).toBeCalledTimes(1)
+ })
+
+ it('toMatchFullPageSnapshot', async () => {
+ await expect(toMatchFullPageSnapshot(browser, 'foo', 123, {})).resolves.toEqual({
+ pass: true,
+ message: expect.any(Function)
+ })
+ expect(browser.checkFullPageScreen).toBeCalledTimes(1)
+ })
+
+ it('toMatchElementSnapshot', async () => {
+ await expect(toMatchElementSnapshot(browser as any as WebdriverIO.Element, 'foo', 123, {})).resolves.toEqual({
+ pass: true,
+ message: expect.any(Function)
+ })
+ expect(browser.checkElement).toBeCalledTimes(1)
+ })
+
+ it('toMatchTabbablePageSnapshot', async () => {
+ await expect(toMatchTabbablePageSnapshot(browser, 'foo', 123, {})).resolves.toEqual({
+ pass: true,
+ message: expect.any(Function)
+ })
+ expect(browser.checkTabbablePage).toBeCalledTimes(1)
+ })
+})

packages/service/tests/service.test.ts

@@ -1,4 +1,6 @@
 import { describe, expect, it, vi } from 'vitest'
+import { expect as wdioExpect } from '@wdio/globals'
+
 import VisualService from '../src/index.js'
 
 vi.mock('webdriver-image-comparison', () => ({
@@ -13,7 +15,24 @@ vi.mock('webdriver-image-comparison', () => ({
  checkTabbablePage: vi.fn(),
 }))
 
+vi.mock('@wdio/globals', () => ({
+ expect: {
+ extend: vi.fn()
+ }
+}))
+
 describe('@wdio/visual-service', () => {
+ it('should register custom matchers', () => {
+ const service = new VisualService({})
+ const browser = {
+ isMultiremote: false,
+ addCommand: vi.fn(),
+ requestedCapabilities: {}
+ } as any as WebdriverIO.Browser
+ service.before({}, [], browser)
+ expect(wdioExpect.extend).toBeCalledTimes(1)
+ })
+
  it('adds command to normal browser in before hook', () => {
  const service = new VisualService({})
  const browser = {

packages/webdriver-image-comparison/src/commands/checkElement.ts

@@ -2,7 +2,7 @@ import { executeImageCompare } from '../methods/images.js'
 import { checkIsMobile } from '../helpers/utils.js'
 import saveElement from './saveElement.js'
 import type { ImageCompareResult } from '../methods/images.interfaces'
-import type { Methods } from '../methods/methods.interface'
+import type { Methods } from '../methods/methods.interfaces.js'
 import type { InstanceData } from '../methods/instanceData.interfaces'
 import type { Folders } from '../base.interface'
 import type { CheckElementOptions, SaveElementOptions } from './element.interfaces'

packages/webdriver-image-comparison/src/commands/checkFullPageScreen.ts

@@ -2,7 +2,7 @@ import { executeImageCompare } from '../methods/images.js'
 import { checkIsMobile } from '../helpers/utils.js'
 import saveFullPageScreen from './saveFullPageScreen.js'
 import type { ImageCompareResult } from '../methods/images.interfaces'
-import type { Methods } from '../methods/methods.interface'
+import type { Methods } from '../methods/methods.interfaces.js'
 import type { InstanceData } from '../methods/instanceData.interfaces'
 import type { Folders } from '../base.interface'
 import type { CheckFullPageOptions, SaveFullPageOptions } from './fullPage.interfaces'

packages/webdriver-image-comparison/src/commands/checkScreen.ts

@@ -2,7 +2,7 @@ import saveScreen from './saveScreen.js'
 import { executeImageCompare } from '../methods/images.js'
 import { checkIsMobile } from '../helpers/utils.js'
 import type { ImageCompareOptions, ImageCompareResult } from '../methods/images.interfaces'
-import type { Methods } from '../methods/methods.interface'
+import type { Methods } from '../methods/methods.interfaces.js'
 import type { InstanceData } from '../methods/instanceData.interfaces'
 import type { Folders } from '../base.interface'
 import type { CheckScreenOptions, SaveScreenOptions } from './screen.interfaces'

packages/webdriver-image-comparison/src/commands/checkTabbablePage.ts

@@ -1,4 +1,4 @@
-import type { Methods } from '../methods/methods.interface'
+import type { Methods } from '../methods/methods.interfaces'
 import type { InstanceData } from '../methods/instanceData.interfaces'
 import type { Folders } from '../base.interface'
 import drawTabbableOnCanvas from '../clientSideScripts/drawTabbableOnCanvas.js'

packages/webdriver-image-comparison/src/commands/saveElement.ts

@@ -4,7 +4,7 @@ import beforeScreenshot from '../helpers/beforeScreenshot.js'
 import afterScreenshot from '../helpers/afterScreenshot.js'
 import { determineElementRectangles } from '../methods/rectangles.js'
 import type { AfterScreenshotOptions, ScreenshotOutput } from '../helpers/afterScreenshot.interfaces'
-import type { Methods } from '../methods/methods.interface'
+import type { Methods } from '../methods/methods.interfaces.js'
 import type { InstanceData } from '../methods/instanceData.interfaces'
 import type { Folders } from '../base.interface'
 import type { SaveElementOptions } from './element.interfaces'

packages/webdriver-image-comparison/src/commands/saveFullPageScreen.ts

@@ -3,7 +3,7 @@ import afterScreenshot from '../helpers/afterScreenshot.js'
 import { getBase64FullPageScreenshotsData } from '../methods/screenshots.js'
 import { makeFullPageBase64Image } from '../methods/images.js'
 import type { ScreenshotOutput, AfterScreenshotOptions } from '../helpers/afterScreenshot.interfaces'
-import type { Methods } from '../methods/methods.interface'
+import type { Methods } from '../methods/methods.interfaces.js'
 import type { InstanceData } from '../methods/instanceData.interfaces'
 import type { Folders } from '../base.interface'
 import type { SaveFullPageOptions } from './fullPage.interfaces'

packages/webdriver-image-comparison/src/commands/saveScreen.ts

@@ -3,7 +3,7 @@ import { makeCroppedBase64Image } from '../methods/images.js'
 import beforeScreenshot from '../helpers/beforeScreenshot.js'
 import afterScreenshot from '../helpers/afterScreenshot.js'
 import { determineScreenRectangles } from '../methods/rectangles.js'
-import type { Methods } from '../methods/methods.interface'
+import type { Methods } from '../methods/methods.interfaces.js'
 import type { Folders } from '../base.interface'
 import type { SaveScreenOptions } from './screen.interfaces'
 import type { BeforeScreenshotOptions, BeforeScreenshotResult } from '../helpers/beforeScreenshot.interface'

packages/webdriver-image-comparison/src/commands/saveTabbablePage.ts

@@ -1,5 +1,5 @@
 import type { ScreenshotOutput } from '../helpers/afterScreenshot.interfaces'
-import type { Methods } from '../methods/methods.interface'
+import type { Methods } from '../methods/methods.interfaces'
 import type { InstanceData } from '../methods/instanceData.interfaces'
 import type { Folders } from '../base.interface'
 import drawTabbableOnCanvas from '../clientSideScripts/drawTabbableOnCanvas.js'

packages/webdriver-image-comparison/src/helpers/afterScreenshot.ts

@@ -6,7 +6,7 @@ import { CUSTOM_CSS_ID } from './constants.js'
 import { checkIsMobile, formatFileName, getAndCreatePath } from './utils.js'
 import { saveBase64Image } from '../methods/images.js'
 
-import type { Executor } from '../methods/methods.interface'
+import type { Executor } from '../methods/methods.interfaces.js'
 import type { AfterScreenshotOptions, ScreenshotOutput } from './afterScreenshot.interfaces'
 import hideRemoveElements from '../clientSideScripts/hideRemoveElements.js'
 import { LogLevel } from './options.interface.js'

packages/webdriver-image-comparison/src/helpers/beforeScreenshot.ts

@@ -4,7 +4,7 @@ import { CUSTOM_CSS_ID } from './constants.js'
 import { checkIsMobile, getAddressBarShadowPadding, getToolBarShadowPadding, waitFor } from './utils.js'
 import getEnrichedInstanceData from '../methods/instanceData.js'
 import type { BeforeScreenshotOptions, BeforeScreenshotResult } from './beforeScreenshot.interface'
-import type { Executor } from '../methods/methods.interface'
+import type { Executor } from '../methods/methods.interfaces.js'
 import hideRemoveElements from '../clientSideScripts/hideRemoveElements.js'
 import { LogLevel } from './options.interface'
 

packages/webdriver-image-comparison/src/methods/elementPosition.ts

@@ -2,7 +2,7 @@ import getElementPositionTopWindow from '../clientSideScripts/getElementPosition
 import getElementPositionTopDom from '../clientSideScripts/getElementPositionTopDom.js'
 import { getElementPositionTopScreenNativeMobile } from '../clientSideScripts/getElementPositionTopScreenNativeMobile.js'
 import { ANDROID_OFFSETS, IOS_OFFSETS } from '../helpers/constants.js'
-import type { Executor } from './methods.interface'
+import type { Executor } from './methods.interfaces.js'
 import type { ElementPosition } from '../clientSideScripts/elementPosition.interfaces'
 import getAndroidStatusAddressToolBarOffsets from '../clientSideScripts/getAndroidStatusAddressToolBarOffsets.js'
 import getIosStatusAddressToolBarOffsets from '../clientSideScripts/getIosStatusAddressToolBarOffsets.js'

packages/webdriver-image-comparison/src/methods/images.ts

@@ -14,7 +14,7 @@ import type {
  RotateBase64ImageOptions,
 } from './images.interfaces'
 import type { FullPageScreenshotsData } from './screenshots.interfaces'
-import type { Executor } from './methods.interface'
+import type { Executor } from './methods.interfaces.js'
 import type { CompareData } from '../resemble/compare.interfaces'
 import { LogLevel } from '../helpers/options.interface'
 

packages/webdriver-image-comparison/src/methods/instanceData.ts

@@ -10,7 +10,7 @@ import {
  getToolBarShadowPadding,
 } from '../helpers/utils.js'
 import getScreenDimensions from '../clientSideScripts/getScreenDimensions.js'
-import type { Executor } from './methods.interface'
+import type { Executor } from './methods.interfaces.js'
 import type { EnrichedInstanceData, InstanceOptions } from './instanceData.interfaces'
 import type { ScreenDimensions } from '../clientSideScripts/screenDimensions.interfaces'
 

packages/webdriver-image-comparison/src/methods/rectangles.interfaces.ts

@@ -1,4 +1,4 @@
-import type { Executor } from './methods.interface'
+import type { Executor } from './methods.interfaces'
 
 export interface RectanglesOptions {
  // The device pixel ration of the screen / device

packages/webdriver-image-comparison/src/methods/rectangles.ts

@@ -8,7 +8,7 @@ import type {
  StatusAddressToolBarRectangles,
  StatusAddressToolBarRectanglesOptions,
 } from './rectangles.interfaces'
-import type { Executor } from './methods.interface'
+import type { Executor } from './methods.interfaces.js'
 import getIosStatusAddressToolBarOffsets from '../clientSideScripts/getIosStatusAddressToolBarOffsets.js'
 import getAndroidStatusAddressToolBarOffsets from '../clientSideScripts/getAndroidStatusAddressToolBarOffsets.js'
 import type { StatusAddressToolBarOffsets } from '../clientSideScripts/statusAddressToolBarOffsets.interfaces'

packages/webdriver-image-comparison/src/methods/screenshots.ts

@@ -4,7 +4,7 @@ import getAndroidStatusAddressToolBarOffsets from '../clientSideScripts/getAndro
 import getIosStatusAddressToolBarOffsets from '../clientSideScripts/getIosStatusAddressToolBarOffsets.js'
 import { ANDROID_OFFSETS, IOS_OFFSETS } from '../helpers/constants.js'
 import { calculateDprData, getScreenshotSize, waitFor } from '../helpers/utils.js'
-import type { Executor, TakeScreenShot } from './methods.interface'
+import type { Executor, TakeScreenShot } from './methods.interfaces.js'
 import type {
  FullPageScreenshotOptions,
  FullPageScreenshotNativeMobileOptions,

vitest.config.ts

@@ -5,11 +5,17 @@ export default defineConfig({
  include: ['./packages/**/(tests|src)/**/*.test.ts'],
  coverage: {
  thresholds: {
- lines: 46,
- statements: 46,
- functions: 57,
- branches: 83
- }
+ lines: 57,
+ statements: 57,
+ functions: 74,
+ branches: 86
+ },
+ exclude: [
+ 'packages/service/src/types.ts',
+ '.eslintrc.cjs',
+ 'tests/**',
+ '**/*.interfaces.ts',
+ ]
  },
  /**
  * not to ESM ported packages