From 7dd687aa25d7f740081b4db2408ae6e8a4f7ebe5 Mon Sep 17 00:00:00 2001
From: Lukas Hollaender <lukas.hollaender@yworks.com>
Date: Tue, 21 Jul 2020 17:17:36 +0200
Subject: [PATCH] replace HTMLElement with just Element

---
 src/applyparseattributes.ts |  4 ++--
 src/context/context.ts      |  2 +-
 src/context/stylesheets.ts  |  6 +++---
 src/nodes/circle.ts         |  2 +-
 src/nodes/ellipse.ts        |  2 +-
 src/nodes/ellipsebase.ts    |  2 +-
 src/nodes/geometrynode.ts   |  2 +-
 src/nodes/gradient.ts       |  2 +-
 src/nodes/image.ts          |  5 ++---
 src/nodes/line.ts           |  4 ++--
 src/nodes/lineargradient.ts |  2 +-
 src/nodes/path.ts           |  2 +-
 src/nodes/polygon.ts        |  2 +-
 src/nodes/polyline.ts       |  2 +-
 src/nodes/radialgradient.ts |  2 +-
 src/nodes/rect.ts           |  2 +-
 src/nodes/svgnode.ts        |  4 ++--
 src/nodes/text.ts           |  2 +-
 src/nodes/traverse.ts       |  4 ++--
 src/parse.ts                |  2 +-
 src/svg2pdf.ts              |  4 ++--
 src/textchunk.ts            |  4 ++--
 src/utils/bbox.ts           |  2 +-
 src/utils/node.ts           |  8 ++++----
 src/utils/text.ts           |  2 +-
 src/utils/transform.ts      |  2 +-
 types.d.ts                  | 10 +++-------
 27 files changed, 41 insertions(+), 46 deletions(-)

diff --git a/src/applyparseattributes.ts b/src/applyparseattributes.ts
index 0a171952..523a8127 100644
--- a/src/applyparseattributes.ts
+++ b/src/applyparseattributes.ts
@@ -9,7 +9,7 @@ import { parseFill } from './fill/parseFill'
 import { ColorFill } from './fill/ColorFill'
 import { GState } from 'jspdf'
 
-export function parseAttributes(context: Context, svgNode: SvgNode, node?: HTMLElement): void {
+export function parseAttributes(context: Context, svgNode: SvgNode, node?: Element): void {
   const domNode = node || svgNode.element
   const visibility = getAttribute(domNode, context.styleSheets, 'visibility')
   if (visibility) {
@@ -129,7 +129,7 @@ export function parseAttributes(context: Context, svgNode: SvgNode, node?: HTMLE
 export function applyAttributes(
   childContext: Context,
   parentContext: Context,
-  node: HTMLElement
+  node: Element
 ): void {
   let fillOpacity = 1.0,
     strokeOpacity = 1.0
diff --git a/src/context/context.ts b/src/context/context.ts
index 270e8cbb..fa69c252 100644
--- a/src/context/context.ts
+++ b/src/context/context.ts
@@ -76,7 +76,7 @@ export interface ContextOptions {
 }
 
 export interface Svg2pdfParameters {
-  element: HTMLElement
+  element: Element
   x?: number
   y?: number
   width?: number
diff --git a/src/context/stylesheets.ts b/src/context/stylesheets.ts
index c5cf1de2..96ac62d4 100644
--- a/src/context/stylesheets.ts
+++ b/src/context/stylesheets.ts
@@ -2,11 +2,11 @@ import { compare as compareSpecificity } from 'specificity'
 import { nodeIs } from '../utils/node'
 
 export class StyleSheets {
-  private rootSvg: HTMLElement
+  private rootSvg: Element
   private readonly loadExternalSheets: boolean
   private readonly styleSheets: CSSStyleSheet[]
 
-  constructor(rootSvg: HTMLElement, loadExtSheets: boolean) {
+  constructor(rootSvg: Element, loadExtSheets: boolean) {
     this.rootSvg = rootSvg
     this.loadExternalSheets = loadExtSheets
     this.styleSheets = []
@@ -159,7 +159,7 @@ export class StyleSheets {
     )
   }
 
-  getPropertyValue(node: HTMLElement, propertyCss: string): string | undefined {
+  getPropertyValue(node: Element, propertyCss: string): string | undefined {
     const matchingRules = []
     for (const sheet of this.styleSheets) {
       for (let i = 0; i < sheet.cssRules.length; i++) {
diff --git a/src/nodes/circle.ts b/src/nodes/circle.ts
index f55f2acd..a195817a 100644
--- a/src/nodes/circle.ts
+++ b/src/nodes/circle.ts
@@ -19,7 +19,7 @@ export class Circle extends EllipseBase {
     return this.getR(context)
   }
 
-  constructor(node: HTMLElement, children: SvgNode[]) {
+  constructor(node: Element, children: SvgNode[]) {
     super(node, children)
   }
 }
diff --git a/src/nodes/ellipse.ts b/src/nodes/ellipse.ts
index c950e32f..7b6c4926 100644
--- a/src/nodes/ellipse.ts
+++ b/src/nodes/ellipse.ts
@@ -4,7 +4,7 @@ import { SvgNode } from './svgnode'
 import { Context } from '../context/context'
 
 export class Ellipse extends EllipseBase {
-  constructor(element: HTMLElement, children: SvgNode[]) {
+  constructor(element: Element, children: SvgNode[]) {
     super(element, children)
   }
 
diff --git a/src/nodes/ellipsebase.ts b/src/nodes/ellipsebase.ts
index 8e740bf6..a1c016fd 100644
--- a/src/nodes/ellipsebase.ts
+++ b/src/nodes/ellipsebase.ts
@@ -9,7 +9,7 @@ export abstract class EllipseBase extends GeometryNode {
   abstract getRx(context: Context): number
   abstract getRy(context: Context): number
 
-  protected constructor(element: HTMLElement, children: SvgNode[]) {
+  protected constructor(element: Element, children: SvgNode[]) {
     super(false, element, children)
   }
 
diff --git a/src/nodes/geometrynode.ts b/src/nodes/geometrynode.ts
index 9ee39cf6..91fc5e67 100644
--- a/src/nodes/geometrynode.ts
+++ b/src/nodes/geometrynode.ts
@@ -12,7 +12,7 @@ export abstract class GeometryNode extends GraphicsNode {
   private readonly hasMarkers: boolean
   private cachedPath: Path | null = null
 
-  protected constructor(hasMarkers: boolean, element: HTMLElement, children: SvgNode[]) {
+  protected constructor(hasMarkers: boolean, element: Element, children: SvgNode[]) {
     super(element, children)
     this.hasMarkers = hasMarkers
   }
diff --git a/src/nodes/gradient.ts b/src/nodes/gradient.ts
index 1df62395..bf51119c 100644
--- a/src/nodes/gradient.ts
+++ b/src/nodes/gradient.ts
@@ -12,7 +12,7 @@ export abstract class Gradient extends NonRenderedNode {
 
   protected constructor(
     pdfGradientType: ShadingPatternType,
-    element: HTMLElement,
+    element: Element,
     children: SvgNode[]
   ) {
     super(element, children)
diff --git a/src/nodes/image.ts b/src/nodes/image.ts
index c3a4eaaf..0762e77e 100644
--- a/src/nodes/image.ts
+++ b/src/nodes/image.ts
@@ -16,7 +16,7 @@ export class ImageNode extends GraphicsNode {
   private readonly imageLoadingPromise: Promise<{ data: string; format: string }> | null = null
   private readonly imageUrl: string | null
 
-  constructor(element: HTMLElement, children: SvgNode[]) {
+  constructor(element: Element, children: SvgNode[]) {
     super(element, children)
     this.imageUrl = this.element.getAttribute('xlink:href') || this.element.getAttribute('href')
 
@@ -45,8 +45,7 @@ export class ImageNode extends GraphicsNode {
 
     if (format.indexOf('svg') === 0) {
       const parser = new DOMParser()
-      const svgElement = parser.parseFromString(data, 'image/svg+xml')
-        .firstElementChild as HTMLElement
+      const svgElement = parser.parseFromString(data, 'image/svg+xml').firstElementChild as Element
 
       // unless preserveAspectRatio starts with "defer", the preserveAspectRatio attribute of the svg is ignored
       const preserveAspectRatio = this.element.getAttribute('preserveAspectRatio')
diff --git a/src/nodes/line.ts b/src/nodes/line.ts
index 785a627c..a4a708b6 100644
--- a/src/nodes/line.ts
+++ b/src/nodes/line.ts
@@ -6,7 +6,7 @@ import { SvgNode } from './svgnode'
 import { Matrix } from 'jspdf'
 
 export class Line extends GeometryNode {
-  constructor(node: HTMLElement, children: SvgNode[]) {
+  constructor(node: Element, children: SvgNode[]) {
     super(true, node, children)
   }
 
@@ -31,7 +31,7 @@ export class Line extends GeometryNode {
     return context.pdf.unitMatrix
   }
 
-  isVisible(parentVisible: boolean, context:Context): boolean {
+  isVisible(parentVisible: boolean, context: Context): boolean {
     return svgNodeIsVisible(this, parentVisible, context)
   }
 
diff --git a/src/nodes/lineargradient.ts b/src/nodes/lineargradient.ts
index 7cff5426..e91e2897 100644
--- a/src/nodes/lineargradient.ts
+++ b/src/nodes/lineargradient.ts
@@ -2,7 +2,7 @@ import { Gradient } from './gradient'
 import { SvgNode } from './svgnode'
 
 export class LinearGradient extends Gradient {
-  constructor(element: HTMLElement, children: SvgNode[]) {
+  constructor(element: Element, children: SvgNode[]) {
     super('axial', element, children)
   }
 
diff --git a/src/nodes/path.ts b/src/nodes/path.ts
index d19347d5..60b9ba65 100644
--- a/src/nodes/path.ts
+++ b/src/nodes/path.ts
@@ -8,7 +8,7 @@ import { toCubic } from '../utils/geometry'
 import { Matrix } from 'jspdf'
 
 export class PathNode extends GeometryNode {
-  constructor(node: HTMLElement, children: SvgNode[]) {
+  constructor(node: Element, children: SvgNode[]) {
     super(true, node, children)
   }
 
diff --git a/src/nodes/polygon.ts b/src/nodes/polygon.ts
index bd538d50..3ed3d045 100644
--- a/src/nodes/polygon.ts
+++ b/src/nodes/polygon.ts
@@ -2,7 +2,7 @@ import { Traverse } from './traverse'
 import { SvgNode } from './svgnode'
 
 export class Polygon extends Traverse {
-  constructor(node: HTMLElement, children: SvgNode[]) {
+  constructor(node: Element, children: SvgNode[]) {
     super(true, node, children)
   }
 }
diff --git a/src/nodes/polyline.ts b/src/nodes/polyline.ts
index 8cc8792a..9b9001d4 100644
--- a/src/nodes/polyline.ts
+++ b/src/nodes/polyline.ts
@@ -2,7 +2,7 @@ import { Traverse } from './traverse'
 import { SvgNode } from './svgnode'
 
 export class Polyline extends Traverse {
-  constructor(node: HTMLElement, children: SvgNode[]) {
+  constructor(node: Element, children: SvgNode[]) {
     super(false, node, children)
   }
 }
diff --git a/src/nodes/radialgradient.ts b/src/nodes/radialgradient.ts
index 40132dc3..66dd8560 100644
--- a/src/nodes/radialgradient.ts
+++ b/src/nodes/radialgradient.ts
@@ -2,7 +2,7 @@ import { Gradient } from './gradient'
 import { SvgNode } from './svgnode'
 
 export class RadialGradient extends Gradient {
-  constructor(element: HTMLElement, children: SvgNode[]) {
+  constructor(element: Element, children: SvgNode[]) {
     super('radial', element, children)
   }
 
diff --git a/src/nodes/rect.ts b/src/nodes/rect.ts
index 1e91a28a..2918be8a 100644
--- a/src/nodes/rect.ts
+++ b/src/nodes/rect.ts
@@ -6,7 +6,7 @@ import { SvgNode } from './svgnode'
 import { Matrix } from 'jspdf'
 
 export class Rect extends GeometryNode {
-  constructor(element: HTMLElement, children: SvgNode[]) {
+  constructor(element: Element, children: SvgNode[]) {
     super(false, element, children)
   }
 
diff --git a/src/nodes/svgnode.ts b/src/nodes/svgnode.ts
index 7a2f0db1..3fcdab05 100644
--- a/src/nodes/svgnode.ts
+++ b/src/nodes/svgnode.ts
@@ -5,10 +5,10 @@ import { Rect } from '../utils/geometry'
 import { Matrix } from 'jspdf'
 
 export abstract class SvgNode {
-  readonly element: HTMLElement
+  readonly element: Element
   readonly children: SvgNode[]
 
-  constructor(element: HTMLElement, children: SvgNode[]) {
+  constructor(element: Element, children: SvgNode[]) {
     this.element = element
     this.children = children
   }
diff --git a/src/nodes/text.ts b/src/nodes/text.ts
index 717bbfea..da9eae6c 100644
--- a/src/nodes/text.ts
+++ b/src/nodes/text.ts
@@ -57,7 +57,7 @@ export class TextNode extends GraphicsNode {
       )
 
       for (let i = 0; i < this.element.childNodes.length; i++) {
-        const textNode = this.element.childNodes[i] as HTMLElement
+        const textNode = this.element.childNodes[i] as Element
         if (!textNode.textContent) {
           continue
         }
diff --git a/src/nodes/traverse.ts b/src/nodes/traverse.ts
index 15bd0504..2b53f28b 100644
--- a/src/nodes/traverse.ts
+++ b/src/nodes/traverse.ts
@@ -10,7 +10,7 @@ import { Matrix } from 'jspdf'
 export abstract class Traverse extends GeometryNode {
   private readonly closed: boolean
 
-  protected constructor(closed: boolean, node: HTMLElement, children: SvgNode[]) {
+  protected constructor(closed: boolean, node: Element, children: SvgNode[]) {
     super(true, node, children)
     this.closed = closed
   }
@@ -43,7 +43,7 @@ export abstract class Traverse extends GeometryNode {
     return path
   }
 
-  isVisible(parentVisible: boolean, context:Context): boolean {
+  isVisible(parentVisible: boolean, context: Context): boolean {
     return svgNodeIsVisible(this, parentVisible, context)
   }
 
diff --git a/src/parse.ts b/src/parse.ts
index 81e3ea8d..a9e3109d 100644
--- a/src/parse.ts
+++ b/src/parse.ts
@@ -21,7 +21,7 @@ import cssesc from 'cssesc'
 import { ClipPath } from './nodes/clippath'
 import { Symbol } from './nodes/symbol'
 
-export function parse(node: HTMLElement, idMap?: { [id: string]: SvgNode }): SvgNode {
+export function parse(node: Element, idMap?: { [id: string]: SvgNode }): SvgNode {
   let svgnode: SvgNode
   const children: SvgNode[] = []
 
diff --git a/src/svg2pdf.ts b/src/svg2pdf.ts
index bba843a4..fe34e41a 100644
--- a/src/svg2pdf.ts
+++ b/src/svg2pdf.ts
@@ -8,7 +8,7 @@ import { StyleSheets } from './context/stylesheets'
 import { Viewport } from './context/viewport'
 
 export async function svg2pdf(
-  element: HTMLElement,
+  element: Element,
   pdf: jsPDF,
   options: Svg2PdfOptions = {}
 ): Promise<jsPDF> {
@@ -56,7 +56,7 @@ export async function svg2pdf(
 }
 
 jsPDF.API.svg = function(
-  element: HTMLElement,
+  element: Element,
   options: Svg2PdfOptions = {}
 ): ReturnType<typeof svg2pdf> {
   return svg2pdf(element, this, options)
diff --git a/src/textchunk.ts b/src/textchunk.ts
index 8a20dbd8..1eeea38f 100644
--- a/src/textchunk.ts
+++ b/src/textchunk.ts
@@ -18,7 +18,7 @@ import { ColorFill } from './fill/ColorFill'
 export class TextChunk {
   private readonly textNode: TextNode
   private readonly texts: string[]
-  private readonly textNodes: HTMLElement[]
+  private readonly textNodes: Element[]
   private readonly textAnchor: string
   private readonly originX: number
   private readonly originY: number
@@ -32,7 +32,7 @@ export class TextChunk {
     this.originY = originY
   }
 
-  add(tSpan: HTMLElement, text: string): void {
+  add(tSpan: Element, text: string): void {
     this.texts.push(text)
     this.textNodes.push(tSpan)
   }
diff --git a/src/utils/bbox.ts b/src/utils/bbox.ts
index d2412c52..4101d484 100644
--- a/src/utils/bbox.ts
+++ b/src/utils/bbox.ts
@@ -22,7 +22,7 @@ export function getBoundingBoxByChildren(context: Context, svgnode: SvgNode): nu
   return boundingBox
 }
 
-export function defaultBoundingBox(element: HTMLElement, context: Context): Rect {
+export function defaultBoundingBox(element: Element, context: Context): Rect {
   const pf: any = parseFloat
   // TODO: check if there are other possible coordinate attributes
   const x1 =
diff --git a/src/utils/node.ts b/src/utils/node.ts
index 4347e9ac..1c83a03c 100644
--- a/src/utils/node.ts
+++ b/src/utils/node.ts
@@ -6,7 +6,7 @@ export function nodeIs(node: Element, tagsString: string): boolean {
   return tagsString.split(',').indexOf((node.nodeName || node.tagName).toLowerCase()) >= 0
 }
 
-export function forEachChild(node: HTMLElement, fn: (n: number, e: HTMLElement) => void): void {
+export function forEachChild(node: Element, fn: (n: number, e: Element) => void): void {
   // copy list of children, as the original might be modified
   const children = []
   for (let i = 0; i < node.childNodes.length; i++) {
@@ -14,18 +14,18 @@ export function forEachChild(node: HTMLElement, fn: (n: number, e: HTMLElement)
     if (childNode.nodeName.charAt(0) !== '#') children.push(childNode)
   }
   for (let i = 0; i < children.length; i++) {
-    fn(i, children[i] as HTMLElement)
+    fn(i, children[i] as Element)
   }
 }
 
 // returns an attribute of a node, either from the node directly or from css
 export function getAttribute(
-  node: HTMLElement,
+  node: Element,
   styleSheets: StyleSheets,
   propertyNode: string,
   propertyCss = propertyNode
 ): string | undefined {
-  const attribute = node.style.getPropertyValue(propertyCss)
+  const attribute = (node as SVGElement).style.getPropertyValue(propertyCss)
   if (attribute) {
     return attribute
   } else if (styleSheets.getPropertyValue(node, propertyCss)) {
diff --git a/src/utils/text.ts b/src/utils/text.ts
index f4ddda14..4e88b442 100644
--- a/src/utils/text.ts
+++ b/src/utils/text.ts
@@ -44,7 +44,7 @@ export function consolidateSpaces(str: string): string {
 }
 
 // applies text transformations to a text node
-export function transformText(node: HTMLElement, text: string, context: Context): string {
+export function transformText(node: Element, text: string, context: Context): string {
   const textTransform = getAttribute(node, context.styleSheets, 'text-transform')
   switch (textTransform) {
     case 'uppercase':
diff --git a/src/utils/transform.ts b/src/utils/transform.ts
index 38a8b188..5ec84d25 100644
--- a/src/utils/transform.ts
+++ b/src/utils/transform.ts
@@ -3,7 +3,7 @@ import { parseFloats } from './parsing'
 import { Matrix } from 'jspdf'
 
 export function computeViewBoxTransform(
-  node: HTMLElement,
+  node: Element,
   viewBox: number[],
   eX: number,
   eY: number,
diff --git a/types.d.ts b/types.d.ts
index a33f5c9c..e1e082da 100644
--- a/types.d.ts
+++ b/types.d.ts
@@ -8,11 +8,7 @@ declare module 'svg2pdf.js' {
    * @param pdf The jsPDF object.
    * @param options An object that may contain render options.
    */
-  export function svg2pdf(
-    element: HTMLElement,
-    pdf: jsPDF,
-    options?: Svg2PdfOptions
-  ): Promise<jsPDF>
+  export function svg2pdf(element: Element, pdf: jsPDF, options?: Svg2PdfOptions): Promise<jsPDF>
 }
 
 declare module 'jspdf' {
@@ -23,10 +19,10 @@ declare module 'jspdf' {
      * @param element The svg element, which will be cloned, so the original stays unchanged.
      * @param options An object that may contain render options.
      */
-    svg(element: HTMLElement, options?: Svg2PdfOptions): Promise<jsPDF>
+    svg(element: Element, options?: Svg2PdfOptions): Promise<jsPDF>
   }
   interface jsPDFAPI {
-    svg(this: jsPDF, element: HTMLElement, options?: Svg2PdfOptions): Promise<jsPDF>
+    svg(this: jsPDF, element: Element, options?: Svg2PdfOptions): Promise<jsPDF>
   }
 }