fix: skip root margin

qq15725 · May 8, 2023 · a567b62 · a567b62 · vercel · May 8, 2023
1 parent 60bf91b
commit a567b62
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 1 deletion.
diff --git a/src/clone-node.ts b/src/clone-node.ts
@@ -87,7 +87,7 @@ export async function cloneNode<T extends Node>(
     const cloned = await cloneElement(node, context)
     const clonedStyle = cloned.style
 
-    copyCssStyles(node, computedStyle, cloned, context)
+    copyCssStyles(node, computedStyle, cloned, isRoot, context)
 
     if (isRoot) {
       applyCssStyleWithOptions(clonedStyle, context)

diff --git a/src/copy-css-styles.ts b/src/copy-css-styles.ts
@@ -14,6 +14,7 @@ export function copyCssStyles<T extends HTMLElement | SVGElement>(
   node: T,
   computedStyle: CSSStyleDeclaration,
   cloned: T,
+  isRoot: boolean,
   context: Context,
 ) {
   const clonedStyle = cloned.style
@@ -23,6 +24,8 @@ export function copyCssStyles<T extends HTMLElement | SVGElement>(
   for (const [name, [value, priority]] of Object.entries(diffStyle)) {
     if (ignoredStyle.includes(name)) continue
 
+    if (isRoot && name.startsWith('margin')) continue
+
     // fix background-clip: text
     if (name === 'background-clip' && value === 'text') {
       cloned.classList.add('______background-clip--text')

diff --git a/test/fixtures/css.margin.html b/test/fixtures/css.margin.html
@@ -0,0 +1,8 @@
+<style>
+  #root {
+    width: 100px;
+    height: 100px;
+    background-color: grey;
+    margin: 30px;
+  }
+</style>
diff --git a/test/fixtures/css.margin.png b/test/fixtures/css.margin.png