@open-wc/semantic-dom-diff - npm Package Compare versions

Comparing version 0.6.2 to 0.7.0

CHANGELOG.md

@@ -6,2 +6,13 @@ # Change Log
 
+# [0.7.0](https://github.com/open-wc/open-wc/tree/master/packages/semantic-dom-diff/compare/@open-wc/semantic-dom-diff@0.6.2...@open-wc/semantic-dom-diff@0.7.0) (2018-12-29)
+
+
+### Features
+
+* **chai-dom-equals:** improve chai-dom-equals error reporting ([#111](https://github.com/open-wc/open-wc/tree/master/packages/semantic-dom-diff/issues/111)) ([2017cba](https://github.com/open-wc/open-wc/tree/master/packages/semantic-dom-diff/commit/2017cba))
+
+
+
+
+
 ## [0.6.2](https://github.com/open-wc/open-wc/tree/master/packages/semantic-dom-diff/compare/@open-wc/semantic-dom-diff@0.6.1...@open-wc/semantic-dom-diff@0.6.2) (2018-12-20)
@@ -8,0 +19,0 @@

index.d.ts

@@ -1,1 +0,1 @@
-export { getSemanticDomDiff, getAST } from './src/get-dom-diff';
+export { getDiffableSemanticHTML, getAST } from './src/get-dom-diff';

index.js

@@ -1,1 +0,1 @@
-export { getSemanticDomDiff } from './src/get-dom-diff.js';
+export { getDiffableSemanticHTML } from './src/get-dom-diff.js';

package.json

 {
   "name": "@open-wc/semantic-dom-diff",
-  "version": "0.6.2",
+  "version": "0.7.0",
   "description": "To compare dom and shadow dom trees. Part of open-wc recommendations",
@@ -20,5 +20,5 @@ "author": "open-wc",
   "dependencies": {
-    "@bundled-es-modules/deep-diff": "^1.0.2-rc.1",
     "@bundled-es-modules/parse5": "^5.1.0",
-    "@types/parse5": "^5.0.0"
+    "@types/parse5": "^5.0.0",
+    "diffable-html": "^3.0.0"
   },
@@ -33,3 +33,3 @@ "devDependencies": {
   },
-  "gitHead": "e252bcf876e3061f6434e5165a3f8497354ae48f"
+  "gitHead": "09fab1de027f048221088af5dd20b9cb73c6e58a"
 }

src/get-dom-diff.d.ts

 import { DocumentFragment } from 'parse5';
 
-interface DiffResult {
-  message: String;
-  path: String;
-  normalizedLeftHTML: String;
-  normalizedRightHTML: String;
-}
-
 export function getAST(value, config): DocumentFragment
-export function getSemanticDomDiff(leftHTML, rightHTML, config): DiffResult
+export function getDiffableSemanticHTML(html: string): string

src/get-dom-diff.js

 import { parseFragment, serialize } from '@bundled-es-modules/parse5';
-import { deepDiff } from '@bundled-es-modules/deep-diff';
+import toDiffableHtml from 'diffable-html';
 
 import { sanitizeHtmlString } from './sanitize-html-string.js';
 import { normalizeAST } from './normalize-ast.js';
-import { getDiffMessage } from './get-diff-message.js';
-import { findDiffedObject } from './find-diffed-object.js';
-import { getDiffPath } from './get-diff-path.js';
 
-/**
- * @typedef {object} DiffResult
- * @param {string} message
- * @param {string} path
- */
-
-/**
- * Creates the DiffResult for two AST trees.
- *
- * @param {ASTNode} leftTree the left tree AST
- * @param {ASTNode} rightTree the right tree AST
- * @param {Object} diff the semantic difference between the two trees
- *
- * @returns {DiffResult} the diff result containing the human readable semantic difference
- */
-function createDiffResult(leftTree, rightTree, diff) {
-  const leftDiffObject = findDiffedObject(leftTree, diff.path);
-  const rightDiffObject = findDiffedObject(rightTree, diff.path);
-
-  return {
-    message: getDiffMessage(diff, leftDiffObject, rightDiffObject),
-    path: getDiffPath(leftTree, diff.path),
-    normalizedLeftHTML: serialize(leftTree),
-    normalizedRightHTML: serialize(rightTree),
-  };
-}
-
 export function getAST(value, config = {}) {
@@ -44,27 +14,16 @@ const ast = parseFragment(sanitizeHtmlString(value));
 /**
- * Parses two HTML trees, and generates the semantic difference between the two trees.
- * The HTML is diffed semantically, not literally. This means that changes in attribute
- * and class order and whitespace/newlines are ignored. Also, script and style
- * tags ignored.
+ * Parses HTML and returns HTML in a formatted and diffable format which is semantically
+ * equal to the input, but with some transformations:
+ * - whitespace and newlines in and around tags are normalized
+ * - classes and attributes are ordered
+ * - script, style and comments are removed
  *
- * @param leftHTML the left HTML tree
- * @param rightHTML the right HTML tree
- * @returns {DiffResult | null} the diff result, or undefined if no diffs were found
+ * @param {string} html
+ * @returns {string}
  */
-export function getSemanticDomDiff(leftHTML, rightHTML, config = {}) {
-  const leftTree = getAST(leftHTML);
-  const rightTree = getAST(rightHTML);
-
-  normalizeAST(leftTree, config.ignoredTags);
-  normalizeAST(rightTree, config.ignoredTags);
-
-  // parentNode causes a circular reference, so ignore them.
-  const ignore = (path, key) => key === 'parentNode';
-  const diffs = deepDiff(leftTree, rightTree, ignore);
-
-  if (!diffs || !diffs.length) {
-    return null;
-  }
-
-  return createDiffResult(leftTree, rightTree, diffs[0]);
+export function getDiffableSemanticHTML(html) {
+  const ast = getAST(html);
+  normalizeAST(ast, []);
+  const serialized = serialize(ast);
+  return toDiffableHtml(serialized);
 }

src/parse5-utils.js

@@ -1,6 +0,2 @@
-export const isNode = arg => arg && 'nodeName' in arg;
 export const isElement = arg => arg && 'tagName' in arg;
 export const isParentNode = arg => arg && 'childNodes' in arg;
-export const isTextNode = arg => arg && arg.nodeName === '#text';
-export const isCommentNode = arg => arg && arg.nodeName === '#comment';
-export const isDocumentFragment = arg => arg && arg.nodeName === '#document-fragment';

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

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

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

Worsened metrics

Total package byte prevSize

12531

decreased by-32.48%

Number of package files

13

decreased by-18.75%

Lines of code

116

decreased by-62.82%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Addeddiffable-html@^3.0.0

• + Addeddiffable-html@3.0.0(transitive)

• + Addeddom-serializer@0.2.2(transitive)

• + Addeddomelementtype@1.3.12.3.0(transitive)

• + Addeddomhandler@2.4.2(transitive)

• + Addeddomutils@1.7.0(transitive)

• + Addedentities@1.1.22.2.0(transitive)

• + Addedhtmlparser2@3.10.1(transitive)

• + Addedinherits@2.0.4(transitive)

• + Addedreadable-stream@3.6.2(transitive)

• + Addedsafe-buffer@5.2.1(transitive)

• + Addedstring_decoder@1.3.0(transitive)

• + Addedutil-deprecate@1.0.2(transitive)

• - Removed@bundled-es-modules/deep-diff@^1.0.2-rc.1

• - Removed@bundled-es-modules/deep-diff@1.0.2-rc.1(transitive)