The "width" of the property does not exist on the type 'HTMLElement'

advertisements

The following TypeScript fails to compile:

let svg = document.createElement("svg");
svg.width = 300;

Due to the error Property 'width' does not exist on type 'HTMLElement'. But if I change svg to canvas, for example, then it does compile, so it's something about SVGs specifically it seems...

Any ideas?


let svg = document.createElement("svg"); doesn't create svg element, but custom html element.

Proper way to create svg element:

let svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");

const customSvg = document.createElement("svg")
const properSvg = document.createElementNS("http://www.w3.org/2000/svg", "svg")

console.log(customSvg instanceof SVGSVGElement) // false
console.log(properSvg instanceof SVGSVGElement) // true

console.log(customSvg.width) // undefined
console.log(properSvg.width) // SVGAnimatedLength {}