@o3r/testing/visual-test/visual-test.d.ts

The module provides testing (e2e, unit test) utilities to help you build your own E2E pipeline integrating visual testing.

import { PNG } from 'pngjs';
export { prepareVisualTesting, toggleVisualTestingRender, } from './utils';
/** Error types returned by visual testing comparison */
export interface VisualTestMessage {
    /** Error message when base image and actual image have different sizes */
    imagesSize: string;
    /** Error message when base screensot not found */
    baseImgNotFound: string;
    /** Error message when the threshold is passed */
    diffMessage: string;
    /** The message in case of success */
    success: string;
    /** The message in case of generate mode run */
    generateMode: string;
}
/** Error messages in case of visual testing failure */
export declare const visualTestMessages: Readonly<VisualTestMessage>;
/**
 * Object returned by a visual test operation
 */
export interface VisualTestResult {
    /** Error object when base image and actual image have different sizes; Contains the screenshot ffile name */
    imagesSize?: {
        screenshotName: string;
    };
    /** Error object when base screensot not found. Contains the not found path as a string */
    baseScreenshotNotFound?: {
        baseScreenshotPath: string;
    };
    /** Object containing the actual diff between images as percentage, the threshold and screenshot file name */
    diff?: {
        actualDiff: number;
        threshold: number;
        screenshotName: string;
    };
    /** Run only generation of screenshots */
    generateMode?: boolean;
}
/**
 * Visual test matcher
 * Based on the VisualTestResult object return by compareScreenshots function, this matcher will compute the error messages
 */
export declare function toBeVisuallySimilar(): {
    compare: (actual: VisualTestResult, _expected: VisualTestResult) => {
        pass: boolean;
        message: string;
    };
};
/**
 * It will create a file for the passed screenshot object.
 * The path of the new file will be calculated using the parameters
 * Ex: ./dist-screenshots\OWBooking\windows_chrome_91\fare-page-after-click-on-continue-0.png
 * distScreenshotsDir/scenarionName/device/filenameWithoutExtension.png
 * @param screenshot The screenshot object captured. Ex: for protractor - browser.takeScreenshot()
 * @param scenarioName E2e Scenario class name
 * @param device Details of the platform on which the test is run. If there are spaces the helper will do the concatenation. Ex: `Windows 10 chrome 89`
 * @param filenameWithoutExtension file name to save the screenshot - .png will be added at the end
 * @param distScreenshotsDir Name of the directory to save the screenshots
 */
export declare function saveScreenshot(screenshot: string, scenarioName: string, device: string, filenameWithoutExtension: string, distScreenshotsDir?: string): void;
/**
 * Write the 3 images (base/new/diff) on the reports folder
 * The path inside the reports forlder will be calculated using the parameters
 * @param pathToScenarioReport Path where the scenario report is saved inside reports folder
 * @param screenshotsDirName Name of the directory which will contain the 3 images
 * @param diff diff image
 * @param baseImage the base image
 * @param currentImg the actual taken screenshot image
 */
export declare function writeScreenshotsDiff(pathToScenarioReport: string, screenshotsDirName: string, diff: PNG, baseImage: PNG, currentImg: PNG): void;
/**
 * Compare images helper function. If the comparison fails the 3 images (base/new/diff) will be written inside the reports folder of the actual scenario
 * @param screenshot Actual captured screenshot object
 * @param baseImagePath The path to the base screenshot
 * @param threshold The diff between base screenshot and the current one should not be bigger than this value.
 * @param pathToScenarioReport Path where the scenario report is saved inside reports folder. Used to compute the path to write diff images in case there is a diff at comparison
 * @returns An object of visual test result type
 */
export declare function compareScreenshot(screenshot: string, baseImagePath: string, threshold: number, pathToScenarioReport: string): VisualTestResult;
/**
 * Helper function to perform a visual test operation
 * @param screenshotObj Ex: for protractor browser.takeScreenshot()
 * @param filenameWithoutExtension file name to save the screenshot - .png will be added at the end
 * @param device os followed by browser version - ex: `Windows 10 chrome 89`
 * @param scenarioName E2e Scenario class name
 * @param pathToScenarioReport Path used in compare mode for saving the base,new,diff images in reports in case there is a diff
 * @param threshold The diff between base screenshot and the current one should not be bigger than this value.
 * If the diff is bigger, 3 png files will be created: base screenshot, new screenshot and diff image
 * @param generateMode If true it will generate the screenshot file without screenshots comparison
 * @param baseScreenshotsDirPath The folder path to search base screenshots; used only in compare mode
 */
export declare function o3rVisualTest(screenshotObj: string, filenameWithoutExtension: string, device: string, scenarioName: string, pathToScenarioReport?: string, threshold?: number, generateMode?: boolean, baseScreenshotsDirPath?: string): VisualTestResult;
//# sourceMappingURL=visual-test.d.ts.map