@swimlane/dom-diff
v1.0.1
Published
diffing chunks of dom or HTML for semantic equality
Downloads
2,913
Maintainers
manideep-swimlane
vishalakshi.murali
lazargersh
siva.yadala
ajaypalswimlane
adityagonnade
ashraygupta
prasanthsaiboyina
abhiswimlane0410
kodalipraveen
mohanalakshmi.s
nikshithkolan
steveblue
kasiviswanathan.mangudi
koushik.kumar
dmytro_skorokhodov
sasha.polishchuk
dabbott-sl
daniel.selig
jogaj_26
markcoleman1
caleb.bass
hansstoetzer
sarath.pantula
nikkuman
agustin.firpo
tmcclure
ischultz-swimlane
bensteele7
brantw
marjan-georgiev
danstory
seangrimes
adamfrank
bageldawg
it.admin.swim
smartinski
royar95
mr_charlie
swimlane.devKeywords
Readme
@swimlane/dom-diff
This library acts as a base project for diffing chunks of dom or HTML for semantic equality.
Used in:
API
getDiffableHTML
Takes a snippet of HTML and returns a semantically similar diffable HTML snippet.
import { getDiffableHTML } from '@swimlane/dom-diff';
const h = `
<head></head>
<div z="1" a="2" x>
<h1 z="3">Hello</h1>
<h2>World</h2>
<svg>SVG ignored</svg>
<script>scripts also ignored</script>
<style>styles also ignored</style>
<!-- comments ignored too -->
</div>`;
getDiffableHTML(h, {
ignoreAttributes: [{ tags: ['h1'], attributes: ['z'] }]
});
// <div
// a="2"
// x
// z="1"
// >
// <h1>
// Hello
// </h1>
// <h2>
// World
// </h2>
// </div>dom
Template tag that takes a snippet of HTML and returns a regular expression.
Follows rules defined in https://github.com/Hypercubed/lit-regex
import { dom } from '@swimlane/dom-diff';
dom`<h1>Hello ${/[\w-]+/}</h1>`;
// /^<h1>\n Hello [\w-]+\n<\/h1>$/diff
Takes a regular expression generated by dom and a string generated from getDiffableHTML returning a representation of the difference.
import { diff, dom, getDiffableHTML } from '@swimlane/dom-diff';
const h = getDiffableHTML('<div>Hello 123</div>');
const r = dom`<div>Hello ${/[a-zA-Z]+/}</div>`;
diff(r, h);
// <div>
// - Hello \${/[a-zA-Z]+/}
// + Hello 123
// </div>Release
- Checkout main (
git checkout main) - Pull from origin (
git pull origin main) - Examine
CHANGELOG.mdto determine next version (X.Y.Z) - Run np (
npm run np) and follow the prompts
License
Distributed under the MIT License. See LICENSE for more information.
Credits
@swimlane/dom-diff is a Swimlane open-source project; we
believe in giving back to the open-source community by sharing some of the
projects we build.
Swimlane is an automated cyber security operations and incident response platform that enables cyber security teams to leverage threat intelligence, speed up incident response and automate security operations.