@progress/kendo-e2e
Version:
Kendo UI end-to-end test utilities.
198 lines • 8.76 kB
JavaScript
;
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
var desc = Object.getOwnPropertyDescriptor(m, k);
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
desc = { enumerable: true, get: function() { return m[k]; } };
}
Object.defineProperty(o, k2, desc);
}) : (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
o["default"] = v;
});
var __importStar = (this && this.__importStar) || (function () {
var ownKeys = function(o) {
ownKeys = Object.getOwnPropertyNames || function (o) {
var ar = [];
for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
return ar;
};
return ownKeys(o);
};
return function (mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
__setModuleDefault(result, mod);
return result;
};
})();
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.snapshotImage = snapshotImage;
exports.snapshotViewPort = snapshotViewPort;
/* eslint-disable @typescript-eslint/no-explicit-any */
/* eslint-disable @typescript-eslint/explicit-module-boundary-types */
const fs = __importStar(require("fs"));
const looks_same_1 = __importDefault(require("looks-same"));
const selenium_webdriver_1 = require("selenium-webdriver");
const util_1 = require("util");
const crop_1 = require("./crop");
const scripts_1 = require("./scripts");
const writeFile = (0, util_1.promisify)(fs.writeFile);
const exists = (0, util_1.promisify)(fs.exists);
const looksSame = (0, util_1.promisify)(looks_same_1.default);
const defaults = {
hideSelectors: [],
offsetY: 0,
sleep: 0,
tolerance: 0,
ignoreCaret: true,
timeout: 3000
};
/**
* Takes an image snapshot of an element and stores in the specified location.
*
* The image is compared using [looks-same](https://www.npmjs.com/package/looks-same) before overwriting.
*
* If `SKIP_IMAGE_UPLOAD_AND_FAIL` environment variable provided, the method throws error and the image writing is skipped.
*
* @example
* await snapshotImage(driver, '#test-area', `${artifactsPath}/column-menu.png`, {
* hideSelectors: ['div#demoToolbar']
* });
*
* @param driver WebDriver instance
* @param selector A selector that matches the element to screenshot. If multiple elements match, only the first will be used.
* @param outputPath The path to the screenshot file to be created or updated.
* @param options Screenshot options.
*/
function snapshotImage(driver, selector, outputPath, options) {
return __awaiter(this, void 0, void 0, function* () {
const { hideSelectors, offsetY, sleep, tolerance, ignoreCaret, timeout } = Object.assign(Object.assign({}, defaults), options);
// Wait for element to be present
const waitCondition = (driver) => __awaiter(this, void 0, void 0, function* () {
try {
const element = yield driver.findElement(selenium_webdriver_1.By.css(selector));
return yield element.isDisplayed();
}
catch (_a) {
return false;
}
});
yield driver.wait(waitCondition, 10000, `Failed to find element located by ${selector}.`);
// Wait until screenshot match expected image
const snapshotResult = { same: false };
let same = false;
let cropped;
try {
if (sleep > 0) {
yield driver.sleep(sleep);
}
yield driver.executeScript(scripts_1.hideElements, hideSelectors);
const viewport = yield driver.executeScript(scripts_1.setViewport, selector, offsetY);
const actualScreenViewport = yield driver.executeScript("return [window.innerWidth, window.innerHeight];");
viewport.width = Math.min(actualScreenViewport[0], viewport.width);
viewport.height = Math.min(actualScreenViewport[1], viewport.height);
yield driver.wait(() => __awaiter(this, void 0, void 0, function* () {
const data = yield driver.takeScreenshot();
const image = Buffer.from(data, 'base64');
cropped = (0, crop_1.crop)(image, viewport);
if (yield exists(outputPath)) {
const result = yield looksSame(cropped, outputPath, { strict: false, tolerance: tolerance, ignoreCaret: ignoreCaret });
return result.equal;
}
else {
return false;
}
}), timeout);
same = true;
}
catch (_a) {
console.warn(`Actual screenshot does not match ${outputPath}`);
}
finally {
if (!same) {
if (!process.env.SKIP_IMAGE_UPLOAD_AND_FAIL) {
yield writeFile(outputPath, cropped);
}
else {
// Environment variable SKIP_IMAGE_UPLOAD_AND_FAIL could be set for executions against read-only branches, the test throws error
throw new Error(`Snapshot doesn't match reference for ${outputPath}.\nWill not update the image on disk as the SKIP_IMAGE_UPLOAD_AND_FAIL is set.\nAborting!`);
}
}
yield driver.executeScript(scripts_1.restoreElements, hideSelectors);
}
snapshotResult.same = same;
return snapshotResult;
});
}
/**
* Takes an image snapshot of view port.
*
* The image is compared using [looks-same](https://www.npmjs.com/package/looks-same) before overwriting.
*
* @example
* await snapshotViewPort(driver, `${artifactsPath}/column-menu.png`, {
* hideSelectors: ['div#demoToolbar']
* });
*
* @param driver WebDriver instance
* @param outputPath The path to the screenshot file to be created or updated.
* @param options Screenshot options.
*/
function snapshotViewPort(driver, outputPath, options) {
return __awaiter(this, void 0, void 0, function* () {
const { hideSelectors, sleep, tolerance, ignoreCaret, timeout } = Object.assign(Object.assign({}, defaults), options);
// Wait until screenshot match expected image
const snapshotResult = { same: false };
let same = false;
let image;
try {
if (sleep > 0) {
yield driver.sleep(sleep);
}
yield driver.executeScript(scripts_1.hideElements, hideSelectors);
yield driver.wait(() => __awaiter(this, void 0, void 0, function* () {
const data = yield driver.takeScreenshot();
image = Buffer.from(data, 'base64');
if (yield exists(outputPath)) {
const result = yield looksSame(image, outputPath, { strict: false, tolerance: tolerance, ignoreCaret: ignoreCaret });
return result.equal;
}
else {
return false;
}
}), timeout);
same = true;
}
catch (_a) {
console.warn(`Actual screenshot do not match ${outputPath}`);
}
finally {
if (!same) {
yield writeFile(outputPath, image);
}
yield driver.executeScript(scripts_1.restoreElements, hideSelectors);
}
snapshotResult.same = same;
return snapshotResult;
});
}
//# sourceMappingURL=snapshot-image.js.map