refactor: pre-handle white space

Author: Arman19941113

build/rollup.config.mjs

@@ -9,7 +9,7 @@ import rollupPostcss from 'rollup-plugin-postcss'
 const resolve = file => path.join(import.meta.dirname, '../packages/html-diff', file)
 
 const dtsTask = {
-  input: resolve('dist-ts/index.d.ts'),
+  input: resolve('dist-ts/src/index.d.ts'),
   output: {
     file: resolve('dist/index.d.ts'),
     format: 'es',

package.json

@@ -9,6 +9,7 @@
   "devDependencies": {
     "@rollup/plugin-node-resolve": "^15.3.0",
     "@rollup/plugin-typescript": "^12.1.1",
+    "@types/node": "^20.17.6",
     "chalk": "^5.3.0",
     "enquirer": "^2.4.1",
     "postcss": "^8.4.49",

packages/html-diff/src/index.ts

@@ -110,6 +110,9 @@ export default class HtmlDiff {
         ...classNames,
       },
     }
+    // white space is junk
+    oldHtml = oldHtml.trim()
+    newHtml = newHtml.trim()
 
     // no need to diff
     if (oldHtml === newHtml) {

packages/html-diff/tests/__snapshots__/index.spec.ts.snap

@@ -155,3 +155,12 @@ exports[`HtmlDiff > should work with equal start 2`] = `
 <p data-seq="2"><span class="html-diff-create-text-wrapper">今天天气很不错</span></p>",
 ]
 `;
+
+exports[`HtmlDiff > should work with white space 1`] = `"<div>hello</div>"`;
+
+exports[`HtmlDiff > should work with white space 2`] = `
+[
+  "<div data-seq="1">hello</div>",
+  "<div data-seq="1">hello</div>",
+]
+`;

packages/html-diff/tests/index.spec.ts

@@ -2,6 +2,14 @@ import { describe, expect, it } from 'vitest'
 import HtmlDiff from '../src'
 
 describe('HtmlDiff', () => {
+  it('should work with white space', function () {
+    const oldHtml = `<div>hello</div>`
+    const newHtml = `    <div>hello        </div>`
+    const diff = new HtmlDiff(oldHtml, newHtml)
+    expect(diff.getUnifiedContent()).toMatchSnapshot()
+    expect(diff.getSideBySideContents()).toMatchSnapshot()
+  })
+
   it('should work with basic create', function () {
     const oldHtml = `<div>hello</div>`
     const newHtml = `<div>hello world</div>`

packages/html-diff/tsconfig.json

@@ -2,7 +2,7 @@
   "compilerOptions": {
     "target": "esnext",
     "module": "esnext",
-    "moduleResolution": "node",
+    "moduleResolution": "bundler",
     "resolveJsonModule": true,
     "esModuleInterop": true,
     "strict": true,
@@ -15,5 +15,5 @@
     "strictNullChecks": true,
     "allowUnreachableCode": false
   },
-  "include": ["src/**/*.ts", "tests/**/*.test.ts"]
+  "include": ["src/**/*.ts", "tests/**/*.spec.ts"]
 }