From bfb6b8fb611e78aa16384389154ca83a0aaed082 Mon Sep 17 00:00:00 2001 From: Dario Blanco Date: Sat, 8 Jun 2019 03:37:14 +0200 Subject: [PATCH] Add types for backstopjs 4.1 (#36022) --- types/backstopjs/backstopjs-tests.ts | 64 +++++++++++++++++++ types/backstopjs/index.d.ts | 94 ++++++++++++++++++++++++++++ types/backstopjs/tsconfig.json | 23 +++++++ types/backstopjs/tslint.json | 1 + 4 files changed, 182 insertions(+) create mode 100644 types/backstopjs/backstopjs-tests.ts create mode 100644 types/backstopjs/index.d.ts create mode 100644 types/backstopjs/tsconfig.json create mode 100644 types/backstopjs/tslint.json diff --git a/types/backstopjs/backstopjs-tests.ts b/types/backstopjs/backstopjs-tests.ts new file mode 100644 index 0000000000..651d19c67e --- /dev/null +++ b/types/backstopjs/backstopjs-tests.ts @@ -0,0 +1,64 @@ +import backstop, { Scenario, Viewport } from 'backstopjs'; + +/** Examples inspired on https://github.com/garris/BackstopJS#integration-options-local-install */ + +backstop('approve').then(() => { }).catch(() => { }); + +backstop('init'); + +backstop('reference', { + filter: 'someScenarioLabelAsRegExString' +}); + +backstop('test', { config: 'custom/backstop/config.json' }); + +backstop('test', { + filter: 'someScenarioLabelAsRegExString', + config: { + id: 'foo', + scenarios: [], + viewports: [], + } +}); + +/** Custom example */ + +const scenarios: Scenario[] = [{ label: 'fake', url: 'fakeUrl' }]; +const viewports: Viewport[] = [ + { + name: 'phone', + width: 320, + height: 480, + }, + { + name: 'tablet', + width: 1024, + height: 768, + }, + { + name: 'desktop', + width: 1280, + height: 1024, + }, +]; +backstop('test', { + config: { + scenarios, + viewports, + asyncCaptureLimit: 10, + asyncCompareLimit: 100, + baseUrl: 'http://fake:8080', + id: 'fakeId', + engine: 'puppeteer', + engineOptions: { + args: ['--no-sandbox'], + }, + onReadyScript: 'fake/path', + paths: { + bitmaps_reference: 'fake/path', + bitmaps_test: 'fake/path', + html_report: 'fake/path', + }, + report: ['browser'], + }, +}); diff --git a/types/backstopjs/index.d.ts b/types/backstopjs/index.d.ts new file mode 100644 index 0000000000..7e760f28ef --- /dev/null +++ b/types/backstopjs/index.d.ts @@ -0,0 +1,94 @@ +// Type definitions for backstopjs 4.0 +// Project: https://github.com/garris/backstopjs#readme +// Definitions by: DarĂ­o Blanco , MindDoc +// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped + +export interface Config { + asyncCaptureLimit?: number; + asyncCompareLimit?: number; + baseUrl?: string; + ci?: { + format?: string; + testReportFileName?: string; + testSuiteName?: string; + }; + debugWindow?: boolean; + debug?: boolean; + engine?: 'chromy' | 'puppeteer'; + engineOptions?: { + args: string[]; + chromeFlags?: string[]; + chromePath?: string; + ignoreHTTPSErrors?: boolean; + waitTimeout?: number; + }; + id: string; + onBeforeScript?: string; + onReadyScript?: string; + paths?: { + ci_report?: string; + bitmaps_reference?: string; + bitmaps_test?: string; + engine_scripts?: string; + html_report?: string; + json_report?: string; + }; + report?: Array<'browser' | 'CI' | 'json'>; + resembleOutputOptions?: { // See https://github.com/rsmbl/Resemble.js + errorColor?: { + red: number; + green: number; + blue: number; + }, + errorType?: string; + transparency?: number; + ignoreAntialiasing?: boolean; + }; + scenarios: Scenario[]; + viewports: Viewport[]; +} + +export interface KeypressSelector { + selector: string; + keyPress: string; +} + +/** The Backstop test definition. See https://github.com/garris/BackstopJS#advanced-scenarios */ +export interface Scenario { + clickSelector?: string; // Click the specified DOM element prior to screenshot + clickSelectors?: string[]; // Simulates multiple sequential click interactions + cookiePath?: string; // Import cookies in JSON format + delay?: number; // Wait for x milliseconds + expect?: number; // Use with selectorExpansion true to expect number of results found + hideSelectors?: string[]; // Selectors set to visibility: hidden + hoverSelector?: string; // Move pointer over the given DOM element prior to screenshot + hoverSelectors?: string[]; // Simulates multiple sequential hover interactions + keyPressSelector?: KeypressSelector; // Press key in the DOM element prior to screenshot + keyPressSelectors?: KeypressSelector[]; // Simulates multiple sequential keypress interactions + label: string; // Tag saved with your reference images + misMatchThreshold?: string; // Percentage of different pixels allowed to pass test + onBeforeScript?: string; // Used to set up browser state e.g. cookies + onReadyScript?: string; // Used to modify UI state prior to screenshots e.g. hovers, clicks etc + postInteractionWait?: number; // Wait for selector (ms) after interacting with hover or click + readyEvent?: string; // Wait until this string has been logged to the console + readySelector?: string; // Wait until this selector exists before continuing + referenceUrl?: string; // Specify a different state or environment when creating reference + removeSelectors?: string[]; // Selectors set to display: none + requireSameDimensions?: boolean; // If true, any change in selector size will trigger a failure + selectors?: string[]; // Selectors to capture + selectorExpansion?: boolean; // If true, take screenshots of all matching selector instances + scrollToSelector?: string; // Scroll the specified DOM element into view prior to screenshots + url: string; // The url of your app state + viewports?: Viewport[]; // Override global viewports +} + +export interface Viewport { + name: 'phone' | 'tablet' | 'desktop'; + width: number; + height: number; +} + +export default function backstop( + command: 'approve' | 'init' | 'reference' | 'test', + options?: { config?: Config | string, filter?: string }, +): Promise; diff --git a/types/backstopjs/tsconfig.json b/types/backstopjs/tsconfig.json new file mode 100644 index 0000000000..35e2662b93 --- /dev/null +++ b/types/backstopjs/tsconfig.json @@ -0,0 +1,23 @@ +{ + "compilerOptions": { + "module": "commonjs", + "lib": [ + "es6" + ], + "noImplicitAny": true, + "noImplicitThis": true, + "strictFunctionTypes": true, + "strictNullChecks": true, + "baseUrl": "../", + "typeRoots": [ + "../" + ], + "types": [], + "noEmit": true, + "forceConsistentCasingInFileNames": true + }, + "files": [ + "index.d.ts", + "backstopjs-tests.ts" + ] +} diff --git a/types/backstopjs/tslint.json b/types/backstopjs/tslint.json new file mode 100644 index 0000000000..3db14f85ea --- /dev/null +++ b/types/backstopjs/tslint.json @@ -0,0 +1 @@ +{ "extends": "dtslint/dt.json" }