@wdio/image-comparison-core 1.0.0

package/dist/commands/checkWebScreen.test.js

@@ -0,0 +1,227 @@
+import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
+import checkWebScreen from './checkWebScreen.js';
+import { BASE_CHECK_OPTIONS } from '../mocks/mocks.js';
+vi.mock('../methods/images.js', () => ({
+    executeImageCompare: vi.fn().mockResolvedValue({
+        fileName: 'test-result.png',
+        misMatchPercentage: 0,
+        isExactSameImage: true,
+        isNewBaseline: false,
+        isAboveTolerance: false,
+    })
+}));
+vi.mock('./saveWebScreen.js', () => ({
+    default: vi.fn().mockResolvedValue({
+        devicePixelRatio: 2,
+        fileName: 'test-screen.png'
+    })
+}));
+vi.mock('../helpers/options.js', () => ({
+    screenMethodCompareOptions: vi.fn().mockReturnValue({
+        ignoreAlpha: false,
+        ignoreAntialiasing: false,
+        ignoreColors: false,
+        ignoreLess: false,
+        ignoreNothing: false,
+        rawMisMatchPercentage: false,
+        returnAllCompareData: false,
+        saveAboveTolerance: 0,
+        scaleImagesToSameSize: false,
+    })
+}));
+vi.mock('../helpers/utils.js', () => ({
+    extractCommonCheckVariables: vi.fn().mockReturnValue({
+        actualFolder: '/mock/actual',
+        baselineFolder: '/mock/baseline',
+        diffFolder: '/mock/diff',
+        browserName: 'chrome',
+        deviceName: 'Desktop',
+        deviceRectangles: { screenSize: { width: 1280, height: 720 } },
+        isAndroid: false,
+        isMobile: false,
+        isAndroidNativeWebScreenshot: false,
+        autoSaveBaseline: false,
+        savePerInstance: false,
+    }),
+    buildBaseExecuteCompareOptions: vi.fn().mockImplementation((params) => ({
+        compareOptions: {
+            wic: params.wicCompareOptions,
+            method: params.methodCompareOptions,
+        },
+        devicePixelRatio: params.devicePixelRatio,
+        deviceRectangles: { screenSize: { width: 1280, height: 720 } },
+        fileName: params.fileName,
+        folderOptions: {
+            autoSaveBaseline: false,
+            actualFolder: '/mock/actual',
+            baselineFolder: '/mock/baseline',
+            diffFolder: '/mock/diff',
+            browserName: 'chrome',
+            deviceName: 'Desktop',
+            isMobile: false,
+            savePerInstance: false,
+        },
+        isAndroid: false,
+        isAndroidNativeWebScreenshot: false,
+    })),
+}));
+describe('checkWebScreen', () => {
+    let executeImageCompareSpy;
+    let saveWebScreenSpy;
+    const baseOptions = {
+        checkScreenOptions: {
+            wic: BASE_CHECK_OPTIONS.wic,
+            method: {
+                disableBlinkingCursor: false,
+                disableCSSAnimation: false,
+                enableLayoutTesting: false,
+                enableLegacyScreenshotMethod: false,
+                hideScrollBars: true,
+                hideElements: [],
+                removeElements: [],
+                waitForFontsLoaded: true,
+            }
+        },
+        browserInstance: { isAndroid: false, isMobile: false },
+        folders: BASE_CHECK_OPTIONS.folders,
+        instanceData: BASE_CHECK_OPTIONS.instanceData,
+        isNativeContext: false,
+        tag: 'test-screen',
+        testContext: BASE_CHECK_OPTIONS.testContext
+    };
+    beforeEach(async () => {
+        const { executeImageCompare } = await import('../methods/images.js');
+        const saveWebScreen = (await import('./saveWebScreen.js')).default;
+        executeImageCompareSpy = vi.mocked(executeImageCompare);
+        saveWebScreenSpy = vi.mocked(saveWebScreen);
+    });
+    afterEach(() => {
+        vi.clearAllMocks();
+    });
+    it('should execute checkWebScreen with basic options', async () => {
+        const result = await checkWebScreen(baseOptions);
+        expect(result).toMatchSnapshot();
+        expect(saveWebScreenSpy.mock.calls[0]).toMatchSnapshot();
+        expect(executeImageCompareSpy.mock.calls[0]).toMatchSnapshot();
+    });
+    it('should handle hideElements and removeElements correctly', async () => {
+        const mockElement = {
+            elementId: 'test-element',
+            selector: '#test-element',
+            isDisplayed: vi.fn().mockResolvedValue(true),
+            getSize: vi.fn().mockResolvedValue({ width: 100, height: 100 }),
+            getLocation: vi.fn().mockResolvedValue({ x: 0, y: 0 })
+        };
+        const options = {
+            ...baseOptions,
+            checkScreenOptions: {
+                ...baseOptions.checkScreenOptions,
+                method: {
+                    ...baseOptions.checkScreenOptions.method,
+                    hideElements: [mockElement],
+                    removeElements: [mockElement],
+                }
+            }
+        };
+        await checkWebScreen(options);
+        expect(saveWebScreenSpy.mock.calls[0]).toMatchSnapshot();
+        expect(executeImageCompareSpy.mock.calls[0]).toMatchSnapshot();
+    });
+    it('should handle Android device correctly', async () => {
+        const options = {
+            ...baseOptions,
+            browserInstance: { isAndroid: true, isMobile: true },
+            instanceData: {
+                ...baseOptions.instanceData,
+                deviceName: 'Pixel 4',
+                isAndroid: true,
+                isIOS: false,
+                platformName: 'Android',
+                platformVersion: '11.0',
+                nativeWebScreenshot: true
+            },
+            testContext: {
+                ...baseOptions.testContext,
+                instanceData: {
+                    ...baseOptions.testContext.instanceData,
+                    deviceName: 'Pixel 4',
+                    platform: { name: 'Android', version: '11.0' },
+                    isAndroid: true,
+                    isIOS: false
+                }
+            }
+        };
+        await checkWebScreen(options);
+        expect(executeImageCompareSpy.mock.calls[0]).toMatchSnapshot();
+    });
+    it('should merge compare options correctly', async () => {
+        const options = {
+            ...baseOptions,
+            checkScreenOptions: {
+                ...baseOptions.checkScreenOptions,
+                wic: {
+                    ...baseOptions.checkScreenOptions.wic,
+                    compareOptions: {
+                        ...baseOptions.checkScreenOptions.wic.compareOptions,
+                        ignoreAlpha: true,
+                        ignoreAntialiasing: true,
+                        ignoreColors: true,
+                    }
+                },
+                method: {
+                    ...baseOptions.checkScreenOptions.method,
+                    disableBlinkingCursor: true,
+                    disableCSSAnimation: true,
+                    enableLayoutTesting: true,
+                }
+            }
+        };
+        await checkWebScreen(options);
+        expect(saveWebScreenSpy.mock.calls[0]).toMatchSnapshot();
+        expect(executeImageCompareSpy.mock.calls[0]).toMatchSnapshot();
+    });
+    it('should handle native context correctly', async () => {
+        const options = {
+            ...baseOptions,
+            isNativeContext: true
+        };
+        await checkWebScreen(options);
+        expect(saveWebScreenSpy.mock.calls[0]).toMatchSnapshot();
+        expect(executeImageCompareSpy.mock.calls[0]).toMatchSnapshot();
+    });
+    it('should handle all method options correctly', async () => {
+        const mockHideElement = {
+            elementId: 'hide-element',
+            selector: '#hide-element',
+            isDisplayed: vi.fn().mockResolvedValue(true),
+            getSize: vi.fn().mockResolvedValue({ width: 100, height: 100 }),
+            getLocation: vi.fn().mockResolvedValue({ x: 0, y: 0 })
+        };
+        const mockRemoveElement = {
+            elementId: 'remove-element',
+            selector: '#remove-element',
+            isDisplayed: vi.fn().mockResolvedValue(true),
+            getSize: vi.fn().mockResolvedValue({ width: 100, height: 100 }),
+            getLocation: vi.fn().mockResolvedValue({ x: 0, y: 0 })
+        };
+        const options = {
+            ...baseOptions,
+            checkScreenOptions: {
+                ...baseOptions.checkScreenOptions,
+                method: {
+                    disableBlinkingCursor: true,
+                    disableCSSAnimation: true,
+                    enableLayoutTesting: true,
+                    enableLegacyScreenshotMethod: true,
+                    hideScrollBars: false,
+                    hideElements: [mockHideElement],
+                    removeElements: [mockRemoveElement],
+                    waitForFontsLoaded: false,
+                }
+            }
+        };
+        await checkWebScreen(options);
+        expect(saveWebScreenSpy.mock.calls[0]).toMatchSnapshot();
+        expect(executeImageCompareSpy.mock.calls[0]).toMatchSnapshot();
+    });
+});

package/dist/commands/element.interfaces.d.ts

@@ -0,0 +1,27 @@
+import type { ChainablePromiseElement } from 'webdriverio';
+import type { BaseMobileWebScreenshotOptions, BaseWebScreenshotOptions, Folders } from '../base.interfaces.js';
+import type { DefaultOptions } from '../helpers/options.interfaces.js';
+import type { ResizeDimensions } from '../methods/images.interfaces.js';
+import type { CheckMethodOptions } from './check.interfaces.js';
+import type { RectanglesOutput } from '../methods/rectangles.interfaces.js';
+export interface SaveElementOptions {
+    wic: DefaultOptions;
+    method: SaveElementMethodOptions;
+}
+export interface SaveElementMethodOptions extends Partial<Folders>, BaseWebScreenshotOptions, BaseMobileWebScreenshotOptions {
+    /**
+     * Resize the screenshot to the given dimensions
+     * @default undefined
+     */
+    resizeDimensions?: ResizeDimensions;
+}
+export interface CheckElementMethodOptions extends SaveElementMethodOptions, CheckMethodOptions {
+}
+export interface CheckElementOptions {
+    wic: DefaultOptions;
+    method: CheckElementMethodOptions;
+}
+/** The Wic element */
+export type WicElement = WebdriverIO.Element | ChainablePromiseElement;
+export type ElementIgnore = RectanglesOutput | WicElement;
+//# sourceMappingURL=element.interfaces.d.ts.map

package/dist/commands/element.interfaces.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"element.interfaces.d.ts","sourceRoot":"","sources":["../../src/commands/element.interfaces.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,aAAa,CAAA;AAC1D,OAAO,KAAK,EAAE,8BAA8B,EAAE,wBAAwB,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAC9G,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,kCAAkC,CAAA;AACtE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,iCAAiC,CAAA;AACvE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAA;AAC/D,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,qCAAqC,CAAA;AAE3E,MAAM,WAAW,kBAAkB;IAC/B,GAAG,EAAE,cAAc,CAAC;IACpB,MAAM,EAAE,wBAAwB,CAAC;CACpC;AAED,MAAM,WAAW,wBAAyB,SAAQ,OAAO,CAAC,OAAO,CAAC,EAAE,wBAAwB,EAAE,8BAA8B;IACxH;;;OAGG;IACH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;CACvC;AAED,MAAM,WAAW,yBAA0B,SAAQ,wBAAwB,EAAE,kBAAkB;CAAI;AAEnG,MAAM,WAAW,mBAAmB;IAChC,GAAG,EAAE,cAAc,CAAC;IACpB,MAAM,EAAE,yBAAyB,CAAC;CACrC;AAED,sBAAsB;AACtB,MAAM,MAAM,UAAU,GAAG,WAAW,CAAC,OAAO,GAAG,uBAAuB,CAAA;AAEtE,MAAM,MAAM,aAAa,GAAG,gBAAgB,GAAG,UAAU,CAAA"}

package/dist/commands/element.interfaces.js

@@ -0,0 +1 @@
+export {};

package/dist/commands/fullPage.interfaces.d.ts

@@ -0,0 +1,38 @@
+import type { BaseMobileWebScreenshotOptions, BaseWebScreenshotOptions, Folders } from '../base.interfaces.js';
+import type { DefaultOptions } from '../helpers/options.interfaces.js';
+import type { ResizeDimensions } from '../methods/images.interfaces.js';
+import type { CheckMethodOptions } from './check.interfaces.js';
+export interface SaveFullPageOptions {
+    wic: DefaultOptions;
+    method: SaveFullPageMethodOptions;
+}
+export interface SaveFullPageMethodOptions extends Partial<Folders>, BaseWebScreenshotOptions, BaseMobileWebScreenshotOptions {
+    /**
+     * The amount of milliseconds to wait for a new scroll. This will be used for the legacy
+     * fullpage screenshot method.
+     * @default 1500
+     */
+    fullPageScrollTimeout?: number;
+    /**
+     * Elements that need to be hidden after the first scroll for a fullpage scroll
+     * @default []
+     */
+    hideAfterFirstScroll?: HTMLElement[];
+    /**
+     * The resizeDimensions
+     * @default { top: 0, left: 0, width: 0, height: 0 }
+     */
+    resizeDimensions?: ResizeDimensions;
+    /**
+     * Create fullpage screenshots with the "legacy" protocol which used scrolling and stitching
+     * @default false
+     */
+    userBasedFullPageScreenshot?: boolean;
+}
+export interface CheckFullPageMethodOptions extends SaveFullPageMethodOptions, CheckMethodOptions {
+}
+export interface CheckFullPageOptions {
+    wic: DefaultOptions;
+    method: CheckFullPageMethodOptions;
+}
+//# sourceMappingURL=fullPage.interfaces.d.ts.map

package/dist/commands/fullPage.interfaces.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fullPage.interfaces.d.ts","sourceRoot":"","sources":["../../src/commands/fullPage.interfaces.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,8BAA8B,EAAE,wBAAwB,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAC9G,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,kCAAkC,CAAA;AACtE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,iCAAiC,CAAA;AACvE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAA;AAE/D,MAAM,WAAW,mBAAmB;IAChC,GAAG,EAAE,cAAc,CAAC;IACpB,MAAM,EAAE,yBAAyB,CAAC;CACrC;AAED,MAAM,WAAW,yBAA0B,SAAQ,OAAO,CAAC,OAAO,CAAC,EAAE,wBAAwB,EAAE,8BAA8B;IACzH;;;;OAIG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B;;;OAGG;IACH,oBAAoB,CAAC,EAAE,WAAW,EAAE,CAAC;IACrC;;;OAGG;IACH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;IACpC;;;OAGG;IACH,2BAA2B,CAAC,EAAE,OAAO,CAAC;CACzC;AAED,MAAM,WAAW,0BAA2B,SAAQ,yBAAyB,EAAE,kBAAkB;CAAI;AAErG,MAAM,WAAW,oBAAoB;IACjC,GAAG,EAAE,cAAc,CAAC;IACpB,MAAM,EAAE,0BAA0B,CAAC;CACtC"}

package/dist/commands/fullPage.interfaces.js

@@ -0,0 +1 @@
+export {};

package/dist/commands/save.interfaces.d.ts

@@ -0,0 +1,27 @@
+import type { InstanceData } from '../methods/instanceData.interfaces.js';
+import type { SaveFullPageOptions } from './fullPage.interfaces.js';
+import type { SaveScreenOptions } from './screen.interfaces.js';
+import type { SaveElementOptions, WicElement } from './element.interfaces.js';
+import type { SaveTabbableOptions } from './tabbable.interfaces.js';
+import type { Folders } from '../base.interfaces.js';
+export interface InternalSaveMethodOptions {
+    browserInstance: WebdriverIO.Browser;
+    instanceData: InstanceData;
+    isNativeContext?: boolean;
+    folders: Folders;
+    tag: string;
+}
+export interface InternalSaveScreenMethodOptions extends InternalSaveMethodOptions {
+    saveScreenOptions: SaveScreenOptions;
+}
+export interface InternalSaveElementMethodOptions extends InternalSaveMethodOptions {
+    element: HTMLElement | WicElement;
+    saveElementOptions: SaveElementOptions;
+}
+export interface InternalSaveFullPageMethodOptions extends InternalSaveMethodOptions {
+    saveFullPageOptions: SaveFullPageOptions;
+}
+export interface InternalSaveTabbablePageMethodOptions extends InternalSaveMethodOptions {
+    saveTabbableOptions: SaveTabbableOptions;
+}
+//# sourceMappingURL=save.interfaces.d.ts.map

package/dist/commands/save.interfaces.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"save.interfaces.d.ts","sourceRoot":"","sources":["../../src/commands/save.interfaces.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,uCAAuC,CAAA;AACzE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAA;AACnE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAA;AAC/D,OAAO,KAAK,EAAE,kBAAkB,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAA;AAC7E,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAA;AACnE,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAEpD,MAAM,WAAW,yBAAyB;IACtC,eAAe,EAAE,WAAW,CAAC,OAAO,CAAC;IACrC,YAAY,EAAE,YAAY,CAAC;IAC3B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,OAAO,EAAE,OAAO,CAAC;IACjB,GAAG,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,+BAAgC,SAAQ,yBAAyB;IAC9E,iBAAiB,EAAE,iBAAiB,CAAC;CACxC;AAED,MAAM,WAAW,gCAAiC,SAAQ,yBAAyB;IAC/E,OAAO,EAAE,WAAW,GAAG,UAAU,CAAC;IAClC,kBAAkB,EAAE,kBAAkB,CAAC;CAC1C;AAED,MAAM,WAAW,iCAAkC,SAAQ,yBAAyB;IAChF,mBAAmB,EAAE,mBAAmB,CAAC;CAC5C;AAED,MAAM,WAAW,qCAAsC,SAAQ,yBAAyB;IACpF,mBAAmB,EAAE,mBAAmB,CAAC;CAC5C"}

package/dist/commands/save.interfaces.js

@@ -0,0 +1 @@
+export {};

package/dist/commands/saveAppElement.d.ts

@@ -0,0 +1,7 @@
+import type { ScreenshotOutput } from '../helpers/afterScreenshot.interfaces.js';
+import type { InternalSaveElementMethodOptions } from './save.interfaces.js';
+/**
+ * Saves an element image for a native app
+ */
+export default function saveAppElement({ browserInstance, instanceData, folders, element, tag, saveElementOptions, isNativeContext, }: InternalSaveElementMethodOptions): Promise<ScreenshotOutput>;
+//# sourceMappingURL=saveAppElement.d.ts.map

package/dist/commands/saveAppElement.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"saveAppElement.d.ts","sourceRoot":"","sources":["../../src/commands/saveAppElement.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,0CAA0C,CAAA;AAOhF,OAAO,KAAK,EAAE,gCAAgC,EAAE,MAAM,sBAAsB,CAAA;AAE5E;;GAEG;AACH,wBAA8B,cAAc,CACxC,EACI,eAAe,EACf,YAAY,EACZ,OAAO,EACP,OAAO,EACP,GAAG,EACH,kBAAkB,EAClB,eAAuB,GAC1B,EAAE,gCAAgC,GACpC,OAAO,CAAC,gBAAgB,CAAC,CAyB3B"}

package/dist/commands/saveAppElement.js

@@ -0,0 +1,30 @@
+import afterScreenshot from '../helpers/afterScreenshot.js';
+import { DEFAULT_RESIZE_DIMENSIONS } from '../helpers/constants.js';
+import { buildAfterScreenshotOptions } from '../helpers/options.js';
+import { takeBase64ElementScreenshot } from '../methods/images.js';
+/**
+ * Saves an element image for a native app
+ */
+export default async function saveAppElement({ browserInstance, instanceData, folders, element, tag, saveElementOptions, isNativeContext = false, }) {
+    // 1. Set some variables
+    const resizeDimensions = saveElementOptions.method.resizeDimensions || DEFAULT_RESIZE_DIMENSIONS;
+    const { devicePixelRatio, isIOS } = instanceData;
+    // 2. Take the screenshot
+    const base64Image = await takeBase64ElementScreenshot({
+        browserInstance,
+        element: element,
+        devicePixelRatio,
+        isIOS,
+        resizeDimensions,
+    });
+    // 3. Return the data
+    const afterOptions = buildAfterScreenshotOptions({
+        base64Image,
+        folders,
+        tag,
+        isNativeContext,
+        instanceData: instanceData,
+        wicOptions: saveElementOptions.wic
+    });
+    return afterScreenshot(browserInstance, afterOptions);
+}

package/dist/commands/saveAppElement.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=saveAppElement.test.d.ts.map

package/dist/commands/saveAppElement.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"saveAppElement.test.d.ts","sourceRoot":"","sources":["../../src/commands/saveAppElement.test.ts"],"names":[],"mappings":""}

package/dist/commands/saveAppElement.test.js

@@ -0,0 +1,199 @@
+import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
+import saveAppElement from './saveAppElement.js';
+import { BASE_CHECK_OPTIONS, createMethodOptions, createTestOptions } from '../mocks/mocks.js';
+import { DEVICE_RECTANGLES } from '../helpers/constants.js';
+vi.mock('../methods/images.js', () => ({
+    takeBase64ElementScreenshot: vi.fn().mockResolvedValue('base64-screenshot-data')
+}));
+vi.mock('../helpers/afterScreenshot.js', () => ({
+    default: vi.fn().mockResolvedValue({
+        devicePixelRatio: 2,
+        fileName: 'test-element.png'
+    })
+}));
+vi.mock('../helpers/options.js', () => ({
+    buildAfterScreenshotOptions: vi.fn().mockReturnValue({
+        actualFolder: '/path/to/actual',
+        base64Image: 'base64-screenshot-data',
+        filePath: {
+            browserName: 'chrome',
+            deviceName: '',
+            isMobile: false,
+            savePerInstance: false
+        },
+        fileName: {
+            browserName: 'chrome',
+            browserVersion: 'latest',
+            deviceName: '',
+            devicePixelRatio: 1,
+            formatImageName: '{tag}',
+            isMobile: false,
+            isTestInBrowser: false,
+            logName: 'chrome',
+            name: '',
+            platformName: 'Windows',
+            platformVersion: 'latest',
+            screenHeight: 720,
+            screenWidth: 1366,
+            tag: 'test-element'
+        },
+        isNativeContext: true,
+        isLandscape: false,
+        platformName: 'Windows'
+    })
+}));
+describe('saveAppElement', () => {
+    let takeBase64ElementScreenshotSpy;
+    let afterScreenshotSpy;
+    let buildAfterScreenshotOptionsSpy;
+    const baseOptions = {
+        element: {
+            elementId: 'test-element',
+            selector: '#test-element',
+            isDisplayed: vi.fn().mockResolvedValue(true),
+            getSize: vi.fn().mockResolvedValue({ width: 100, height: 100 }),
+            getLocation: vi.fn().mockResolvedValue({ x: 0, y: 0 })
+        },
+        saveElementOptions: {
+            wic: BASE_CHECK_OPTIONS.wic,
+            method: createMethodOptions()
+        },
+        browserInstance: { isAndroid: false, isMobile: false },
+        folders: BASE_CHECK_OPTIONS.folders,
+        instanceData: BASE_CHECK_OPTIONS.instanceData,
+        isNativeContext: true,
+        tag: 'test-element'
+    };
+    beforeEach(async () => {
+        const { takeBase64ElementScreenshot } = await import('../methods/images.js');
+        const afterScreenshot = (await import('../helpers/afterScreenshot.js')).default;
+        const { buildAfterScreenshotOptions } = await import('../helpers/options.js');
+        takeBase64ElementScreenshotSpy = vi.mocked(takeBase64ElementScreenshot);
+        afterScreenshotSpy = vi.mocked(afterScreenshot);
+        buildAfterScreenshotOptionsSpy = vi.mocked(buildAfterScreenshotOptions);
+    });
+    afterEach(() => {
+        vi.clearAllMocks();
+    });
+    it('should execute saveAppElement with basic options', async () => {
+        const result = await saveAppElement(baseOptions);
+        expect(result).toMatchSnapshot();
+        expect(takeBase64ElementScreenshotSpy.mock.calls[0]).toMatchSnapshot();
+        expect(buildAfterScreenshotOptionsSpy.mock.calls[0][0]).toMatchSnapshot();
+        expect(afterScreenshotSpy.mock.calls[0][1]).toMatchSnapshot();
+    });
+    it('should handle custom resize dimensions', async () => {
+        const options = createTestOptions(baseOptions, {
+            saveElementOptions: {
+                wic: {
+                    ...BASE_CHECK_OPTIONS.wic
+                },
+                method: {
+                    resizeDimensions: {
+                        top: 10,
+                        right: 20,
+                        bottom: 30,
+                        left: 40
+                    }
+                }
+            }
+        });
+        await saveAppElement(options);
+        expect(takeBase64ElementScreenshotSpy.mock.calls[0]).toMatchSnapshot();
+        expect(buildAfterScreenshotOptionsSpy.mock.calls[0][0]).toMatchSnapshot();
+        expect(afterScreenshotSpy.mock.calls[0][1]).toMatchSnapshot();
+    });
+    it('should handle iOS device correctly', async () => {
+        const options = createTestOptions(baseOptions, {
+            browserInstance: { isAndroid: false, isMobile: true },
+            instanceData: {
+                ...BASE_CHECK_OPTIONS.instanceData,
+                deviceName: 'iPhone 12',
+                isAndroid: false,
+                isIOS: true,
+                isMobile: true,
+                platformName: 'iOS',
+                platformVersion: '14.0',
+                deviceRectangles: {
+                    ...DEVICE_RECTANGLES,
+                    screenSize: { height: 844, width: 390 },
+                }
+            }
+        });
+        await saveAppElement(options);
+        expect(takeBase64ElementScreenshotSpy.mock.calls[0]).toMatchSnapshot();
+        expect(buildAfterScreenshotOptionsSpy.mock.calls[0][0]).toMatchSnapshot();
+        expect(afterScreenshotSpy.mock.calls[0][1]).toMatchSnapshot();
+    });
+    it('should handle Android device correctly', async () => {
+        const options = createTestOptions(baseOptions, {
+            browserInstance: { isAndroid: true, isMobile: true },
+            instanceData: {
+                ...BASE_CHECK_OPTIONS.instanceData,
+                deviceName: 'Pixel 4',
+                isAndroid: true,
+                isIOS: false,
+                isMobile: true,
+                platformName: 'Android',
+                platformVersion: '11.0',
+                deviceRectangles: {
+                    ...DEVICE_RECTANGLES,
+                    screenSize: { height: 915, width: 412 },
+                }
+            }
+        });
+        await saveAppElement(options);
+        expect(takeBase64ElementScreenshotSpy.mock.calls[0]).toMatchSnapshot();
+        expect(buildAfterScreenshotOptionsSpy.mock.calls[0][0]).toMatchSnapshot();
+        expect(afterScreenshotSpy.mock.calls[0][1]).toMatchSnapshot();
+    });
+    it('should handle non-native context correctly', async () => {
+        const options = createTestOptions(baseOptions, {
+            isNativeContext: false
+        });
+        await saveAppElement(options);
+        expect(takeBase64ElementScreenshotSpy.mock.calls[0]).toMatchSnapshot();
+        expect(buildAfterScreenshotOptionsSpy.mock.calls[0][0]).toMatchSnapshot();
+        expect(afterScreenshotSpy.mock.calls[0][1]).toMatchSnapshot();
+    });
+    it('should handle custom image naming', async () => {
+        const options = createTestOptions(baseOptions, {
+            tag: 'custom-element-name'
+        });
+        await saveAppElement(options);
+        expect(buildAfterScreenshotOptionsSpy.mock.calls[0][0]).toMatchSnapshot();
+        expect(afterScreenshotSpy.mock.calls[0][1]).toMatchSnapshot();
+    });
+    it('should handle save per instance', async () => {
+        const options = createTestOptions(baseOptions, {
+            saveElementOptions: {
+                wic: {
+                    ...BASE_CHECK_OPTIONS.wic,
+                    savePerInstance: true
+                },
+                method: {}
+            }
+        });
+        await saveAppElement(options);
+        expect(buildAfterScreenshotOptionsSpy.mock.calls[0][0]).toMatchSnapshot();
+        expect(afterScreenshotSpy.mock.calls[0][1]).toMatchSnapshot();
+    });
+    it('should handle custom screen sizes', async () => {
+        const options = createTestOptions(baseOptions, {
+            instanceData: {
+                ...BASE_CHECK_OPTIONS.instanceData,
+                deviceRectangles: {
+                    ...DEVICE_RECTANGLES,
+                    screenSize: {
+                        width: 375,
+                        height: 812
+                    }
+                }
+            }
+        });
+        await saveAppElement(options);
+        expect(takeBase64ElementScreenshotSpy.mock.calls[0]).toMatchSnapshot();
+        expect(buildAfterScreenshotOptionsSpy.mock.calls[0][0]).toMatchSnapshot();
+        expect(afterScreenshotSpy.mock.calls[0][1]).toMatchSnapshot();
+    });
+});

package/dist/commands/saveAppScreen.d.ts

@@ -0,0 +1,7 @@
+import type { ScreenshotOutput } from '../helpers/afterScreenshot.interfaces.js';
+import type { InternalSaveScreenMethodOptions } from './save.interfaces.js';
+/**
+ * Saves an image of the device screen for a native app
+ */
+export default function saveAppScreen({ browserInstance, instanceData, folders, tag, saveScreenOptions, isNativeContext, }: InternalSaveScreenMethodOptions): Promise<ScreenshotOutput>;
+//# sourceMappingURL=saveAppScreen.d.ts.map

package/dist/commands/saveAppScreen.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"saveAppScreen.d.ts","sourceRoot":"","sources":["../../src/commands/saveAppScreen.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,0CAA0C,CAAA;AAKhF,OAAO,KAAK,EAAE,+BAA+B,EAAE,MAAM,sBAAsB,CAAA;AAE3E;;GAEG;AACH,wBAA8B,aAAa,CACvC,EACI,eAAe,EACf,YAAY,EACZ,OAAO,EACP,GAAG,EACH,iBAAiB,EACjB,eAAsB,GACzB,EAAE,+BAA+B,GACnC,OAAO,CAAC,gBAAgB,CAAC,CAuC3B"}

package/dist/commands/saveAppScreen.js

@@ -0,0 +1,43 @@
+import afterScreenshot from '../helpers/afterScreenshot.js';
+import { makeCroppedBase64Image } from '../methods/images.js';
+import { takeBase64Screenshot } from '../methods/screenshots.js';
+import { buildAfterScreenshotOptions } from '../helpers/options.js';
+/**
+ * Saves an image of the device screen for a native app
+ */
+export default async function saveAppScreen({ browserInstance, instanceData, folders, tag, saveScreenOptions, isNativeContext = true, }) {
+    // 1. Set some variables
+    const { addIOSBezelCorners } = saveScreenOptions.wic;
+    const { deviceName, devicePixelRatio, deviceRectangles: { screenSize }, isIOS } = instanceData;
+    // 2a.  Take the screenshot
+    let base64Image = await takeBase64Screenshot(browserInstance);
+    // 2b.  We only need to use the `makeCroppedBase64Image` for iOS and when `addIOSBezelCorners` is true
+    if (isIOS && addIOSBezelCorners) {
+        base64Image = await makeCroppedBase64Image({
+            addIOSBezelCorners,
+            base64Image,
+            deviceName,
+            devicePixelRatio,
+            isIOS,
+            // @TODO: is this one needed for native apps?
+            isLandscape: false,
+            rectangles: {
+                // For iOS the screen size is always in css pixels, the screenshot is in device pixels
+                height: screenSize.height * devicePixelRatio,
+                width: screenSize.width * devicePixelRatio,
+                x: 0,
+                y: 0,
+            },
+        });
+    }
+    // 3.  Return the data
+    const afterOptions = buildAfterScreenshotOptions({
+        base64Image,
+        folders,
+        tag,
+        isNativeContext,
+        instanceData,
+        wicOptions: saveScreenOptions.wic
+    });
+    return afterScreenshot(browserInstance, afterOptions);
+}

package/dist/commands/saveAppScreen.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=saveAppScreen.test.d.ts.map

package/dist/commands/saveAppScreen.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"saveAppScreen.test.d.ts","sourceRoot":"","sources":["../../src/commands/saveAppScreen.test.ts"],"names":[],"mappings":""}