From 8301a3bfe0a16044dde55d82c7fc0aaa99dfabf6 Mon Sep 17 00:00:00 2001
From: Halo <1654403734@qq.com>
Date: Thu, 6 Apr 2023 14:41:16 +0800
Subject: [PATCH] fix: resolve missing svg serialized content

dealing with the issue of incomplete rendering content when using 'position: absolute' to render SVG
---
 .../svg-element-container.ts                  | 28 +++++++++++++------
 1 file changed, 19 insertions(+), 9 deletions(-)

diff --git a/src/dom/replaced-elements/svg-element-container.ts b/src/dom/replaced-elements/svg-element-container.ts
index ae9c5a4..45f842a 100644
--- a/src/dom/replaced-elements/svg-element-container.ts
+++ b/src/dom/replaced-elements/svg-element-container.ts
@@ -8,16 +8,26 @@ export class SVGElementContainer extends ElementContainer {
     intrinsicHeight: number;
 
     constructor(context: Context, img: SVGSVGElement) {
-        super(context, img);
-        const s = new XMLSerializer();
-        const bounds = parseBounds(context, img);
-        img.setAttribute('width', `${bounds.width}px`);
-        img.setAttribute('height', `${bounds.height}px`);
+        super(context, img)
+        const s = new XMLSerializer()
+        const bounds = parseBounds(context, img)
+        let originPosition: string = img.style.position
+        img.setAttribute('width', `${bounds.width}px`)
+        img.setAttribute('height', `${bounds.height}px`)
+        
+        // fix: resolve missing svg serialized content
+        // if svg's tag has absolute position, when converting through serializeToString, it will result in missing SVG content.
+        // so, it is necessary to eliminate positioning before serialization.
+        img.style.position = 'initial'
 
-        this.svg = `data:image/svg+xml,${encodeURIComponent(s.serializeToString(img))}`;
-        this.intrinsicWidth = img.width.baseVal.value;
-        this.intrinsicHeight = img.height.baseVal.value;
+        this.svg = `data:image/svg+xml,${encodeURIComponent(s.serializeToString(img))}`
+        
+        // reset position
+        img.style.position = originPosition
+        
+        this.intrinsicWidth = img.width.baseVal.value
+        this.intrinsicHeight = img.height.baseVal.value
 
-        this.context.cache.addImage(this.svg);
+        this.context.cache.addImage(this.svg)
     }
 }