@@ -62,7 +62,6 @@ function applyAllComputedStylesDeep(clone, original, inheritedFontFamily) {
62
62
63
63
let styleMap = { } ;
64
64
65
- // Get all already-inline styles
66
65
let inlineStyle = clone . getAttribute ( 'style' ) ;
67
66
if ( typeof inlineStyle !== 'string' ) inlineStyle = '' ;
68
67
inlineStyle . split ( ';' ) . forEach ( s => {
@@ -72,19 +71,29 @@ function applyAllComputedStylesDeep(clone, original, inheritedFontFamily) {
72
71
}
73
72
} ) ;
74
73
75
- // Copy *every* computed property
76
74
for ( let i = 0 ; i < computedStyle . length ; i += 1 ) {
77
75
const property = computedStyle [ i ] ;
78
76
const value = computedStyle . getPropertyValue ( property ) ;
79
77
styleMap [ property ] = value ;
80
78
}
81
79
82
- // ---- Strongest part: force resolved color and background-color ----
83
- // getPropertyValue always resolves to an actual color, not 'inherit'
84
80
styleMap [ 'color' ] = computedStyle . color ;
85
81
styleMap [ 'background-color' ] = computedStyle . backgroundColor ;
86
- // Add font props for safety (if they matter to your charts)
87
- styleMap [ 'font-family' ] = computedStyle . fontFamily || inheritedFontFamily || '' ;
82
+
83
+ let fontFamily = computedStyle . fontFamily || inheritedFontFamily || '' ;
84
+ if ( ! fontFamily ||
85
+ fontFamily . trim ( ) === '' ||
86
+ fontFamily === 'inherit' ||
87
+ fontFamily === 'initial' ||
88
+ fontFamily . toLowerCase ( ) . startsWith ( 'system-ui' ) ||
89
+ fontFamily . toLowerCase ( ) === 'sans-serif' ||
90
+ fontFamily . toLowerCase ( ) === 'serif' ||
91
+ fontFamily . toLowerCase ( ) === 'monospace'
92
+ ) {
93
+ fontFamily = 'Helvetica, Arial, sans-serif' ;
94
+ }
95
+ styleMap [ 'font-family' ] = fontFamily ;
96
+
88
97
styleMap [ 'font-size' ] = computedStyle . fontSize ;
89
98
styleMap [ 'font-weight' ] = computedStyle . fontWeight ;
90
99
@@ -105,8 +114,6 @@ function applyAllComputedStylesDeep(clone, original, inheritedFontFamily) {
105
114
styleMap [ prop ] = computedStyle . getPropertyValue ( prop ) ;
106
115
} ) ;
107
116
108
- // No more inheritedFontFamily here; use resolved computedStyle above
109
-
110
117
styleMap [ 'overflow' ] = 'visible' ;
111
118
styleMap [ 'overflow-x' ] = 'visible' ;
112
119
styleMap [ 'overflow-y' ] = 'visible' ;
@@ -117,17 +124,15 @@ function applyAllComputedStylesDeep(clone, original, inheritedFontFamily) {
117
124
}
118
125
clone . setAttribute ( 'style' , styleString ) ;
119
126
120
- // Recursively walk
121
127
const cloneChildren = clone . children || [ ] ;
122
128
const originalChildren = original . children || [ ] ;
123
129
for ( let i = 0 ; i < cloneChildren . length ; i ++ ) {
124
130
if ( cloneChildren [ i ] . nodeType === 1 && originalChildren [ i ] ) {
125
- applyAllComputedStylesDeep ( cloneChildren [ i ] , originalChildren [ i ] , inheritedFontFamily ) ;
131
+ applyAllComputedStylesDeep ( cloneChildren [ i ] , originalChildren [ i ] , fontFamily ) ;
126
132
}
127
133
}
128
134
}
129
135
130
-
131
136
/**
132
137
* Ensures all <text> elements in the given SVG element tree have the given font family
133
138
* as both an attribute and a style property.
@@ -379,7 +384,6 @@ function walkAllAndApply(cloneNode, liveNode) {
379
384
}
380
385
}
381
386
382
-
383
387
/**
384
388
* Converts a DOM element (including HTML, SVG, and canvas) into a high-resolution PNG data URL.
385
389
*
0 commit comments