@progress/kendo-e2e 1.3.0 → 1.4.0

package/dist/index.d.ts

@@ -1,6 +1,7 @@
 export { By, Key, until, WebElement, } from 'selenium-webdriver';
 export * from './a11y';
 export * from './components';
+export * from './rendering';
 export * from './selenium';
 export * from './settings';
 export * from './snapshot-markup';

package/dist/index.js

@@ -18,6 +18,7 @@ Object.defineProperty(exports, "until", { enumerable: true, get: function () { r
 Object.defineProperty(exports, "WebElement", { enumerable: true, get: function () { return selenium_webdriver_1.WebElement; } });
 __exportStar(require("./a11y"), exports);
 __exportStar(require("./components"), exports);
+__exportStar(require("./rendering"), exports);
 __exportStar(require("./selenium"), exports);
 __exportStar(require("./settings"), exports);
 __exportStar(require("./snapshot-markup"), exports);

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;AAAA,yDAAiE;AAAxD,wGAAA,EAAE,OAAA;AAAE,yGAAA,GAAG,OAAA;AAAE,2GAAA,KAAK,OAAA;AAAE,gHAAA,UAAU,OAAA;AACnC,yCAAuB;AACvB,+CAA6B;AAC7B,6CAA2B;AAC3B,6CAA2B;AAC3B,oDAAkC;AAClC,kEAAgD"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;AAAA,yDAAiE;AAAxD,wGAAA,EAAE,OAAA;AAAE,yGAAA,GAAG,OAAA;AAAE,2GAAA,KAAK,OAAA;AAAE,gHAAA,UAAU,OAAA;AACnC,yCAAuB;AACvB,+CAA6B;AAC7B,8CAA4B;AAC5B,6CAA2B;AAC3B,6CAA2B;AAC3B,oDAAkC;AAClC,kEAAgD"}

package/dist/rendering/html-comparer.d.ts

@@ -0,0 +1,20 @@
+declare type CompereOptions = {
+    allowMissing?: string[];
+    allowExtra?: string[];
+};
+declare type Result = {
+    passed: string[];
+    missing: string[];
+    extra: string[];
+};
+/**
+ * Check if two html documents have same class hierarchy.
+ *
+ * @example
+ * await compareHtml("<div class="set">SET</div>", "<div class="qa">QA</div>");
+ *
+ * @param actualHtml An html object.
+ * @param expectedHtml An html object.
+ */
+export declare function compareHtml(actualHtml: string, expectedHtml: string, options?: CompereOptions): Result;
+export {};

package/dist/rendering/html-comparer.js

@@ -0,0 +1,65 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.compareHtml = void 0;
+/* eslint-disable prefer-const */
+const sanitize_html_1 = __importDefault(require("sanitize-html"));
+const jsdom_1 = __importDefault(require("jsdom"));
+/**
+ * Check if two html documents have same class hierarchy.
+ *
+ * @example
+ * await compareHtml("<div class="set">SET</div>", "<div class="qa">QA</div>");
+ *
+ * @param actualHtml An html object.
+ * @param expectedHtml An html object.
+ */
+function compareHtml(actualHtml, expectedHtml, options) {
+    const passed = [];
+    const missing = [];
+    const extra = [];
+    const result = { passed, missing, extra };
+    const config = {
+        allowedTags: false,
+        allowVulnerableTags: true,
+        allowedAttributes: { "*": ["class"] },
+    };
+    const actualDom = new jsdom_1.default.JSDOM(sanitize_html_1.default(actualHtml, config)).window.document.documentElement;
+    const expectedDom = new jsdom_1.default.JSDOM(sanitize_html_1.default(expectedHtml, config)).window.document.documentElement;
+    let actualSelectors = [];
+    let parent = "";
+    parseDom(actualDom, actualSelectors, parent);
+    parent = "";
+    let expectedSelectors = [];
+    parseDom(expectedDom, expectedSelectors);
+    result.passed = actualSelectors.filter((element) => expectedSelectors.includes(element));
+    result.extra = actualSelectors.filter((element) => !expectedSelectors.includes(element));
+    result.missing = expectedSelectors.filter((element) => !actualSelectors.includes(element));
+    if ((options === null || options === void 0 ? void 0 : options.allowExtra) !== undefined) {
+        for (const extraItem of options === null || options === void 0 ? void 0 : options.allowExtra) {
+            result.extra = result.extra.filter((item) => !item.includes(extraItem));
+        }
+    }
+    if ((options === null || options === void 0 ? void 0 : options.allowMissing) !== undefined) {
+        for (const missingItem of options === null || options === void 0 ? void 0 : options.allowMissing) {
+            result.missing = result.missing.filter((item) => !item.includes(missingItem));
+        }
+    }
+    return result;
+}
+exports.compareHtml = compareHtml;
+function parseDom(node, attributes, parent = "") {
+    if (node === null) {
+        return;
+    }
+    let newParent = parent;
+    if (node.attributes[0] !== undefined) {
+        attributes.push(`${parent}.${node.attributes[0].value.split(" ").sort().join(".")}`);
+        newParent = `${parent}.${node.attributes[0].value.split(" ").sort().join(".")} `;
+    }
+    parseDom(node.firstElementChild, attributes, newParent);
+    parseDom(node.nextElementSibling, attributes, parent);
+}
+//# sourceMappingURL=html-comparer.js.map

package/dist/rendering/html-comparer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"html-comparer.js","sourceRoot":"","sources":["../../src/rendering/html-comparer.ts"],"names":[],"mappings":";;;;;;AAAA,iCAAiC;AACjC,kEAAyC;AACzC,kDAA0B;AAa1B;;;;;;;;GAQG;AACH,SAAgB,WAAW,CAAC,UAAkB,EAAE,YAAoB,EAAE,OAAwB;IAC1F,MAAM,MAAM,GAAa,EAAE,CAAC;IAC5B,MAAM,OAAO,GAAa,EAAE,CAAC;IAC7B,MAAM,KAAK,GAAa,EAAE,CAAC;IAC3B,MAAM,MAAM,GAAW,EAAE,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;IAElD,MAAM,MAAM,GAAG;QACX,WAAW,EAAE,KAAK;QAClB,mBAAmB,EAAE,IAAI;QACzB,iBAAiB,EAAE,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,EAAE;KACxC,CAAC;IAEF,MAAM,SAAS,GAAG,IAAI,eAAK,CAAC,KAAK,CAAC,uBAAY,CAAC,UAAU,EAAE,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,eAAe,CAAC;IACpG,MAAM,WAAW,GAAG,IAAI,eAAK,CAAC,KAAK,CAAC,uBAAY,CAAC,YAAY,EAAE,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,eAAe,CAAC;IAExG,IAAI,eAAe,GAAG,EAAE,CAAC;IACzB,IAAI,MAAM,GAAG,EAAE,CAAC;IAChB,QAAQ,CAAC,SAAS,EAAE,eAAe,EAAE,MAAM,CAAC,CAAC;IAE7C,MAAM,GAAG,EAAE,CAAC;IACZ,IAAI,iBAAiB,GAAG,EAAE,CAAC;IAC3B,QAAQ,CAAC,WAAW,EAAE,iBAAiB,CAAC,CAAC;IAEzC,MAAM,CAAC,MAAM,GAAG,eAAe,CAAC,MAAM,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,iBAAiB,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC;IACzF,MAAM,CAAC,KAAK,GAAG,eAAe,CAAC,MAAM,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC,iBAAiB,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC;IACzF,MAAM,CAAC,OAAO,GAAG,iBAAiB,CAAC,MAAM,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC,eAAe,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC;IAE3F,IAAI,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,UAAU,MAAK,SAAS,EAAE;QACnC,KAAK,MAAM,SAAS,IAAI,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,UAAU,EAAE;YACzC,MAAM,CAAC,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC,CAAC;SAC3E;KACJ;IAED,IAAI,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,YAAY,MAAK,SAAS,EAAE;QACrC,KAAK,MAAM,WAAW,IAAI,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,YAAY,EAAE;YAC7C,MAAM,CAAC,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAC,CAAC;SACjF;KACJ;IAED,OAAO,MAAM,CAAC;AAClB,CAAC;AAxCD,kCAwCC;AAED,SAAS,QAAQ,CAAC,IAAa,EAAE,UAAoB,EAAE,MAAM,GAAG,EAAE;IAC9D,IAAI,IAAI,KAAK,IAAI,EAAE;QACf,OAAO;KACV;IAED,IAAI,SAAS,GAAG,MAAM,CAAC;IACvB,IAAI,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK,SAAS,EAAE;QAClC,UAAU,CAAC,IAAI,CAAC,GAAG,MAAM,IAAI,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;QACrF,SAAS,GAAG,GAAG,MAAM,IAAI,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC;KACpF;IAED,QAAQ,CAAC,IAAI,CAAC,iBAAiB,EAAE,UAAU,EAAE,SAAS,CAAC,CAAC;IACxD,QAAQ,CAAC,IAAI,CAAC,kBAAkB,EAAE,UAAU,EAAE,MAAM,CAAC,CAAC;AAC1D,CAAC"}

package/dist/rendering/index.d.ts

@@ -0,0 +1,2 @@
+export declare const specToHtml: (specFile: any, options?: {}) => any;
+export { compareHtml } from "./html-comparer";

package/dist/rendering/index.js

@@ -0,0 +1,15 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.compareHtml = exports.specToHtml = void 0;
+const react_1 = __importDefault(require("react"));
+const server_1 = __importDefault(require("react-dom/server"));
+const specToHtml = (specFile, options = {}) => {
+    return server_1.default.renderToStaticMarkup(react_1.default.createElement(specFile, options));
+};
+exports.specToHtml = specToHtml;
+var html_comparer_1 = require("./html-comparer");
+Object.defineProperty(exports, "compareHtml", { enumerable: true, get: function () { return html_comparer_1.compareHtml; } });
+//# sourceMappingURL=index.js.map

package/dist/rendering/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/rendering/index.ts"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,8DAAwC;AAEjC,MAAM,UAAU,GAAG,CAAC,QAAQ,EAAE,OAAO,GAAG,EAAE,EAAE,EAAE;IACjD,OAAO,gBAAQ,CAAC,oBAAoB,CAChC,eAAK,CAAC,aAAa,CAAC,QAAQ,EAAE,OAAO,CAAC,CACzC,CAAC;AACN,CAAC,CAAC;AAJW,QAAA,UAAU,cAIrB;AAEF,iDAA8C;AAArC,4GAAA,WAAW,OAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-e2e",
-  "version": "1.3.0",
+  "version": "1.4.0",
   "description": "Kendo UI end-to-end test utilities.",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",
@@ -12,6 +12,7 @@
     "build": "npm run lint && npx tsc",
     "test:a11y": "npx jest tests/a11y",
     "test:e2e": "npx jest tests/e2e",
+    "test:rendering": "npx jest tests/rendering",
     "test:visual": "npx jest tests/visual",
     "semantic-release": "semantic-release pre && semantic-prerelease publish --public && semantic-release post"
   },
@@ -59,12 +60,16 @@
     "jsdom": "^16.7.0",
     "looks-same": "^7.3.0",
     "pngjs": "^6.0.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "sanitize-html": "^2.10.0",
     "selenium-webdriver": "4.8.2"
   },
   "devDependencies": {
     "@commitlint/cli": "^17.0.3",
     "@commitlint/config-conventional": "^17.0.3",
     "@progress/kendo-common-tasks": "^8.0.2",
+    "@progress/kendo-themes-html": "^6.4.0",
     "@progress/semantic-prerelease": "^3.0.2",
     "@types/jest": "^28.1.6",
     "@types/node": "ts4.3",