yippee.fun
Precise DOM morphing
morphing
typescript
dom
joel.drapper.me
1import { test, expect } from "vitest"
2import { morphDocument } from "../../src/morphlex"
3
4test("morphing an entire document", () => {
5 const parser = new DOMParser()
6 const originalDocument = parser.parseFromString(
7 `
8 <html>
9 <head>
10 <title>Original Title</title>
11 <meta name="description" content="original">
12 </head>
13 <body>
14 <div id="content">Original Content</div>
15 </body>
16 </html>
17 `,
18 "text/html",
19 )
20
21 morphDocument(
22 originalDocument,
23 `
24 <html>
25 <head>
26 <title>New Title</title>
27 <meta name="description" content="new">
28 </head>
29 <body>
30 <div id="content">New Content</div>
31 </body>
32 </html>
33 `,
34 )
35
36 expect(originalDocument.querySelector("title")?.textContent).toBe("New Title")
37 expect(originalDocument.querySelector('meta[name="description"]')?.getAttribute("content")).toBe("new")
38 expect(originalDocument.querySelector("#content")?.textContent).toBe("New Content")
39})