@swimlane/cy-dom-diff - npm Package Compare versions

Comparing version 1.0.1 to 2.0.0

CHANGELOG.md

@@ -9,2 +9,5 @@ CHANGELOG
 
+## 2.0.0 (2021-02-02)
+* Possible breaking: Replaced @open-wc/sematic-dom-diff with @swimlane/dom-diff
+
 ## 1.0.1 (2021-02-01)
@@ -11,0 +14,0 @@ * Fixed bug causing uncaught failures in Cypress 6

commands.js

@@ -1,8 +0,9 @@
-import { clean, disambiguateArgs, getDom } from './lib/util';
+import { diff, getDiffableHTML, } from '@swimlane/dom-diff';
+import { disambiguateArgs, getDom } from './lib/util';
 import { chaiDomMatch } from './lib/assertion';
 chai.use(chaiDomMatch);
 const logDiff = (name, state, $el, re, options) => {
-    const actual = clean(getDom($el), options);
-    const expected = (re === null || re === void 0 ? void 0 : re.pattern) ? re.replace(re.pattern) : re;
-    const difference = (re === null || re === void 0 ? void 0 : re.diff) ? re.diff(actual) : undefined;
+    const actual = getDiffableHTML(getDom($el), options);
+    const expected = (re === null || re === void 0 ? void 0 : re.matchers) ? re.expected : re;
+    const difference = (re === null || re === void 0 ? void 0 : re.matchers) ? diff(re, actual) : undefined;
     if (state === undefined) {
@@ -9,0 +10,0 @@ state = difference === '' ? 'passed' : 'failed';

index.js

 export * from './lib/regexps';
-export * from './lib/matchers';
+export { dom } from '@swimlane/dom-diff';

lib/assertion.js

@@ -1,2 +0,3 @@
-import { getDom, clean, disambiguateArgs } from './util';
+import { getDiffableHTML } from '@swimlane/dom-diff';
+import { getDom, disambiguateArgs } from './util';
 export const chaiDomMatch = (chai, utils) => {
@@ -7,3 +8,3 @@ function assertDomMatch(re, ...args) {
         const object = utils.flag(this, 'object');
-        const dom = clean(getDom(object), options);
+        const dom = getDiffableHTML(getDom(object), options);
         if (negate) {
@@ -10,0 +11,0 @@ new chai.Assertion(dom).not.match(re, message);

lib/matchers.js

@@ -1,60 +0,1 @@
-import { clean } from './util';
-import { createPatch } from 'diff';
-const escape = (source) => {
-    if (source instanceof RegExp)
-        return source.source;
-    return source.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&');
-};
-const formatPatch = (text) => {
-    return text
-        .replace(/^([^\n]+)\n([^\n]+)\n/m, '')
-        .replace(/--- \t\n/g, '') // headers
-        .replace(/\+\+\+ \t\n/g, '')
-        .split('\n')
-        .filter((x) => !x.includes('--- removed')) // Explanation
-        .filter((x) => !x.includes('+++ added'))
-        .filter((x) => !x.includes('@@ '))
-        .filter((x) => !x.includes('No newline at end of file'))
-        .join('\n')
-        .replace(/\n+$/, '\n')
-        .trim();
-};
-export class PatternRegExp extends RegExp {
-    constructor(source, pattern, matchers) {
-        super(source);
-        this.pattern = pattern;
-        this.matchers = matchers;
-        this.compare = function (left, right) {
-            if (right.includes('__arg')) {
-                const source = this.matchers.reduce((acc, m, i) => {
-                    return acc.replace(`__arg${i}__`, escape(m));
-                }, escape(right));
-                return new RegExp(source).test(left);
-            }
-            return left === right;
-        };
-        this.replace = function (str) {
-            return this.matchers.reduce((acc, m, i) => {
-                return acc.replace(`__arg${i}__`, `\${${m}}`);
-            }, str);
-        };
-        this.diff = function (str) {
-            const options = {
-                comparator: (l, r) => this.compare(l, r),
-            };
-            const patch = createPatch('', this.pattern, str, '', '', options);
-            return formatPatch(this.replace(patch));
-        };
-    }
-}
-export const dom = (strings, ...args) => {
-    const result = [strings[0]];
-    args.forEach((arg, i) => {
-        result.push(`__arg${i}__`, strings[i + 1]);
-    });
-    const pattern = clean(result.join(''));
-    const source = args.reduce((acc, arg, i) => {
-        return acc.replace(`__arg${i}__`, escape(arg));
-    }, escape(pattern));
-    return new PatternRegExp(`^${source}$`, pattern, args);
-};
+export { dom } from '@swimlane/dom-diff';

lib/util.js

@@ -1,3 +0,1 @@
-import { getDiffableHTML, } from '@open-wc/semantic-dom-diff/get-diffable-html';
-import unindent from 'strip-indent';
 const { isJquery, isElement } = Cypress.dom;
@@ -13,8 +11,2 @@ export const getDom = ($el) => {
 };
-const domparser = new DOMParser();
-export const clean = (html, options) => {
-    // Create a Node using DOMParser to avoid rendering in Cypress
-    const doc = domparser.parseFromString(`<diff-container>${html}</diff-container>`, 'text/html');
-    return unindent(getDiffableHTML(doc.body.firstChild, options));
-};
 export const disambiguateArgs = (args) => {
@@ -21,0 +13,0 @@ if (args.length === 2) {

package.json

 {
   "name": "@swimlane/cy-dom-diff",
-  "version": "1.0.1",
+  "version": "2.0.0",
   "description": "matching chunks of DOM against HTML; including dynamic content.",
@@ -21,3 +21,3 @@ "main": "index.js",
     "fix:tslint": "eslint -c .eslintrc.js --ext .ts ./src/ --fix",
-    "test": "run-s test:*",
+    "test": "run-s build test:*",
     "test:prettier": "prettier \"src/**/*.ts\" --list-different",
@@ -35,4 +35,3 @@ "test:lint": "eslint -c .eslintrc.js --ext .ts ./src/",
   "dependencies": {
-    "@open-wc/semantic-dom-diff": "^0.18.0",
-    "diff": "^4.0.2",
+    "@swimlane/dom-diff": "^1.0.1",
     "strip-indent": "^3.0.0"
@@ -47,3 +46,3 @@ },
     "chg": "^0.4.0",
-    "cypress": "^5.6.0",
+    "cypress": "^6.4.0",
     "eslint": "^7.14.0",
@@ -50,0 +49,0 @@ "eslint-config-prettier": "^6.15.0",

src/commands.ts

@@ -1,5 +0,9 @@
-import { DiffOptions } from '@open-wc/semantic-dom-diff/get-diffable-html';
+import {
+  diff,
+  getDiffableHTML,
+  PatternRegExp,
+  ProcessorOptions,
+} from '@swimlane/dom-diff';
 
-import { PatternRegExp } from './lib/matchers';
-import { clean, disambiguateArgs, getDom } from './lib/util';
+import { disambiguateArgs, getDom } from './lib/util';
 import { chaiDomMatch } from './lib/assertion';
@@ -10,3 +14,3 @@
 type Options =
-  | Partial<Cypress.Loggable & Cypress.Timeoutable & DiffOptions>
+  | Partial<Cypress.Loggable & Cypress.Timeoutable & ProcessorOptions>
   | undefined;
@@ -21,5 +25,5 @@
 ) => {
-  const actual = clean(getDom($el), options);
-  const expected = re?.pattern ? re.replace(re.pattern) : re;
-  const difference = re?.diff ? re.diff(actual) : undefined;
+  const actual = getDiffableHTML(getDom($el), options);
+  const expected = re?.matchers ? re.expected : re;
+  const difference = re?.matchers ? diff(re, actual) : undefined;
 
@@ -26,0 +30,0 @@ if (state === undefined) {

src/index.ts

 export * from './lib/regexps';
-export * from './lib/matchers';
+export { dom, PatternRegExp } from '@swimlane/dom-diff';

src/lib/assertion.ts

@@ -1,4 +0,4 @@
-import { DiffOptions } from '@open-wc/semantic-dom-diff/get-diffable-html';
+import { getDiffableHTML, ProcessorOptions } from '@swimlane/dom-diff';
 
-import { getDom, clean, disambiguateArgs } from './util';
+import { getDom, disambiguateArgs } from './util';
 
@@ -9,5 +9,8 @@ export const chaiDomMatch = (chai: Chai.ChaiStatic, utils: Chai.ChaiUtils) => {
     re: RegExp,
-    ...args: [string | DiffOptions, DiffOptions]
+    ...args: [string | ProcessorOptions, ProcessorOptions]
   ) {
-    const [message, options] = disambiguateArgs(args) as [string, DiffOptions];
+    const [message, options] = disambiguateArgs(args) as [
+      string,
+      ProcessorOptions
+    ];
 
@@ -17,3 +20,3 @@ const negate = utils.flag(this, 'negate');
 
-    const dom = clean(getDom(object), options);
+    const dom = getDiffableHTML(getDom(object), options);
 
@@ -20,0 +23,0 @@ if (negate) {

src/lib/matchers.ts

@@ -1,72 +0,1 @@
-import { clean } from './util';
-import { createPatch } from 'diff';
-
-const escape = (source: RegExp | string) => {
-  if (source instanceof RegExp) return source.source;
-  return source.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&');
-};
-
-const formatPatch = (text: string) => {
-  return text
-    .replace(/^([^\n]+)\n([^\n]+)\n/m, '')
-    .replace(/--- \t\n/g, '') // headers
-    .replace(/\+\+\+ \t\n/g, '')
-    .split('\n')
-    .filter((x) => !x.includes('--- removed')) // Explanation
-    .filter((x) => !x.includes('+++ added'))
-    .filter((x) => !x.includes('@@ '))
-    .filter((x) => !x.includes('No newline at end of file'))
-    .join('\n')
-    .replace(/\n+$/, '\n')
-    .trim();
-};
-
-export class PatternRegExp extends RegExp {
-  constructor(
-    source: string,
-    public readonly pattern: string,
-    public readonly matchers: any[]
-  ) {
-    super(source);
-  }
-
-  compare = function (this: PatternRegExp, left: string, right: string) {
-    if (right.includes('__arg')) {
-      const source = this.matchers.reduce((acc, m, i) => {
-        return acc.replace(`__arg${i}__`, escape(m));
-      }, escape(right));
-      return new RegExp(source).test(left);
-    }
-    return left === right;
-  };
-
-  replace = function (this: PatternRegExp, str: string) {
-    return this.matchers.reduce((acc, m, i) => {
-      return acc.replace(`__arg${i}__`, `\${${m}}`);
-    }, str);
-  };
-
-  diff = function (this: PatternRegExp, str: string) {
-    const options = {
-      comparator: (l: string, r: string) => this.compare(l, r),
-    };
-
-    const patch = createPatch('', this.pattern, str, '', '', options as any);
-    return formatPatch(this.replace(patch));
-  };
-}
-
-export const dom = (
-  strings: TemplateStringsArray,
-  ...args: any[]
-): PatternRegExp => {
-  const result = [strings[0]];
-  args.forEach((arg, i) => {
-    result.push(`__arg${i}__`, strings[i + 1]);
-  });
-  const pattern = clean(result.join(''));
-  const source = args.reduce((acc, arg, i) => {
-    return acc.replace(`__arg${i}__`, escape(arg));
-  }, escape(pattern));
-  return new PatternRegExp(`^${source}$`, pattern, args);
-};
+export { dom, PatternRegExp } from '@swimlane/dom-diff';

src/lib/util.ts

@@ -1,8 +0,1 @@
-import {
-  DiffOptions,
-  getDiffableHTML,
-} from '@open-wc/semantic-dom-diff/get-diffable-html';
-
-import unindent from 'strip-indent';
-
 const { isJquery, isElement } = Cypress.dom;
@@ -20,13 +13,2 @@
 
-const domparser = new DOMParser();
-
-export const clean = (html: string, options?: DiffOptions): string => {
-  // Create a Node using DOMParser to avoid rendering in Cypress
-  const doc = domparser.parseFromString(
-    `<diff-container>${html}</diff-container>`,
-    'text/html'
-  );
-  return unindent(getDiffableHTML(doc.body.firstChild as Node, options));
-};
-
 export const disambiguateArgs = (
@@ -33,0 +15,0 @@ args: [

src/types/chai-dom.d.ts

 declare namespace Chai {
-  type DiffOptions = import('@open-wc/semantic-dom-diff/get-diffable-html').DiffOptions;
+  type ProcessorOptions = import('@swimlane/dom-diff').ProcessorOptions;
 
   interface Assertion {
-    domMatch(re: RegExp, message?: string | DiffOptions): Assertion;
-    domMatch(re: RegExp, message?: string, options?: DiffOptions): Assertion;
+    domMatch(re: RegExp, message?: string | ProcessorOptions): Assertion;
+    domMatch(
+      re: RegExp,
+      message?: string,
+      options?: ProcessorOptions
+    ): Assertion;
   }
 }

src/types/cy-commands.d.ts

 /// <reference types="cypress" />
 
 declare namespace Cypress {
-  type DiffOptions = import('@open-wc/semantic-dom-diff/get-diffable-html').DiffOptions;
+  type ProcessorOptions = import('@swimlane/dom-diff').ProcessorOptions;
   type Options =
-    | Partial<Cypress.Loggable & Cypress.Timeoutable & DiffOptions>
+    | Partial<Cypress.Loggable & Cypress.Timeoutable & ProcessorOptions>
     | undefined;
@@ -8,0 +8,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Dependency count

3

decreased by-25%

Worsened metrics

Total package byte prevSize

14166

decreased by-25.43%

Lines of code

243

decreased by-35.03%

Dependency changes

• + Added@swimlane/dom-diff@^1.0.1

• + Added@starptech/expression-parser@0.10.0(transitive)

• + Added@starptech/hast-util-from-webparser@0.10.0(transitive)

• + Added@starptech/prettyhtml-formatter@0.10.0(transitive)

• + Added@starptech/prettyhtml-hast-to-html@0.10.0(transitive)

• + Added@starptech/prettyhtml-hastscript@0.10.0(transitive)

• + Added@starptech/prettyhtml-sort-attributes@0.10.0(transitive)

• + Added@starptech/rehype-minify-whitespace@0.10.0(transitive)

• + Added@starptech/rehype-webparser@0.10.0(transitive)

• + Added@starptech/webparser@0.10.0(transitive)

• + Added@swimlane/dom-diff@1.0.1(transitive)

• + Added@types/hast@2.3.10(transitive)

• + Added@types/node@22.8.6(transitive)

• + Added@types/parse5@5.0.3(transitive)

• + Added@types/unist@2.0.113.0.3(transitive)

• + Added@types/vfile@3.0.2(transitive)

• + Added@types/vfile-message@2.0.0(transitive)

• + Addedarray-iterate@1.1.4(transitive)

• + Addedbail@1.0.5(transitive)

• + Addedbalanced-match@1.0.2(transitive)

• + Addedbrace-expansion@1.1.11(transitive)

• + Addedccount@1.1.0(transitive)

• + Addedcharacter-entities-html4@1.1.4(transitive)

• + Addedcharacter-entities-legacy@1.1.4(transitive)

• + Addedclean-css@4.2.4(transitive)

• + Addedclone-regexp@2.2.0(transitive)

• + Addedcollapse-white-space@1.0.6(transitive)

• + Addedcomma-separated-tokens@1.0.8(transitive)

• + Addedconcat-map@0.0.1(transitive)

• + Addeddiff@5.2.0(transitive)

• + Addedescape-string-regexp@4.0.0(transitive)

• + Addedfs.realpath@1.0.0(transitive)

• + Addedglob@7.2.3(transitive)

• + Addedhast-util-embedded@1.0.6(transitive)

• + Addedhast-util-from-parse5@6.0.1(transitive)

• + Addedhast-util-from-string@1.0.4(transitive)

• + Addedhast-util-has-property@1.0.4(transitive)

• + Addedhast-util-is-body-ok-link@1.0.4(transitive)

• + Addedhast-util-is-conditional-comment@1.0.4(transitive)

• + Addedhast-util-is-css-style@1.0.5(transitive)

• + Addedhast-util-is-element@1.1.0(transitive)

• + Addedhast-util-is-event-handler@1.0.4(transitive)

• + Addedhast-util-parse-selector@2.2.5(transitive)

• + Addedhast-util-phrasing@1.0.5(transitive)

• + Addedhast-util-to-string@1.0.4(transitive)

• + Addedhast-util-whitespace@1.0.4(transitive)

• + Addedhastscript@6.0.0(transitive)

• + Addedhtml-void-elements@1.0.5(transitive)

• + Addedhtml-whitespace-sensitive-tag-names@1.0.3(transitive)

• + Addedinflight@1.0.6(transitive)

• + Addedis-alphabetical@1.0.4(transitive)

• + Addedis-alphanumerical@1.0.4(transitive)

• + Addedis-buffer@2.0.5(transitive)

• + Addedis-decimal@1.0.4(transitive)

• + Addedis-hexadecimal@1.0.4(transitive)

• + Addedis-hidden@1.1.3(transitive)

• + Addedis-plain-obj@1.1.02.1.0(transitive)

• + Addedis-regexp@2.1.0(transitive)

• + Addedlit-regex@1.0.0(transitive)

• + Addedlodash.iteratee@4.7.0(transitive)

• + Addedminimatch@3.1.2(transitive)

• + Addedparse5@6.0.1(transitive)

• + Addedpath-is-absolute@1.0.1(transitive)

• + Addedprettier@1.19.1(transitive)

• + Addedproperty-information@5.6.0(transitive)

• + Addedrehype-format@3.1.0(transitive)

• + Addedrehype-minify-attribute-whitespace@2.0.3(transitive)

• + Addedrehype-minify-css-style@2.0.2(transitive)

• + Addedrehype-minify-enumerated-attribute@3.1.0(transitive)

• + Addedrehype-minify-style-attribute@2.0.2(transitive)

• + Addedrehype-minify-whitespace@4.0.5(transitive)

• + Addedrehype-parse@7.0.1(transitive)

• + Addedrehype-remove-comments@4.0.2(transitive)

• + Addedrehype-remove-duplicate-attribute-values@2.0.2(transitive)

• + Addedrehype-sort-attribute-values@3.0.2(transitive)

• + Addedrepeat-string@1.6.1(transitive)

• + Addedreplace-ext@1.0.0(transitive)

• + Addedrimraf@3.0.2(transitive)

• + Addedsource-map@0.6.1(transitive)

• + Addedspace-separated-tokens@1.1.5(transitive)

• + Addedstringify-entities@2.0.0(transitive)

• + Addedto-vfile@6.1.0(transitive)

• + Addedtrim@1.0.01.0.1(transitive)

• + Addedtrough@1.0.5(transitive)

• + Addedundici-types@6.19.8(transitive)

• + Addedunified@7.1.09.2.2(transitive)

• + Addeduniq@1.0.1(transitive)

• + Addedunist-util-filter@2.0.3(transitive)

• + Addedunist-util-find@1.0.4(transitive)

• + Addedunist-util-is@2.1.33.0.04.1.0(transitive)

• + Addedunist-util-modify-children@1.1.6(transitive)

• + Addedunist-util-remove@2.1.0(transitive)

• + Addedunist-util-stringify-position@1.1.22.0.34.0.0(transitive)

• + Addedunist-util-visit@1.4.12.0.3(transitive)

• + Addedunist-util-visit-parents@2.1.23.1.1(transitive)

• + Addedvfile@3.0.14.2.1(transitive)

• + Addedvfile-location@3.2.0(transitive)

• + Addedvfile-message@1.1.12.0.44.0.2(transitive)

• + Addedweb-namespaces@1.1.4(transitive)

• + Addedx-is-array@0.1.0(transitive)

• + Addedx-is-string@0.1.0(transitive)

• + Addedxtend@4.0.2(transitive)

• - Removed@open-wc/semantic-dom-diff@^0.18.0

• - Removeddiff@^4.0.2

• - Removed@open-wc/semantic-dom-diff@0.18.0(transitive)

• - Removed@types/chai@4.3.20(transitive)

• - Removeddiff@4.0.2(transitive)