loading an invalid SVG causes an uncatchable error

[kyranet]

I noticed this while working with a library that generated a SVG, but due to misconfiguration, it added another root element to the SVG, and noticed it'd always crash the process.

Given this code:

import { Image } from '@napi-rs/canvas';

const svg = '<svg></svg>';
try {
	const image = new Image();
	image.onload = () => console.log('onload');
	image.onerror = (error) => console.error('onerror', error);

	image.src = Buffer.from(svg, 'utf-8');
	console.log('Set image source');
} catch (error) {
	console.error(error);
}

This gets a valid SVG, and works as intended:

$ node sample.mjs
onload
Set image source

$ $LastExitCode
0

However, if svg has an extra root element, for example '<svg></svg><p></p>', it'll then produce an uncatchable error (panic?) without a message and doesn't call the onerror callback:

$ node sample.mjs

$ $LastExitCode
-1073741819

---

Expanding with what Chromium (Vivaldi 6.7.3329.31, V8 12.4.254.17) does (in case the bugfix wants feature parity), this code is extended a little to do:

const blob = new Blob([svg], { type: 'image/svg+xml' });
image.src = URL.createObjectURL(blob);

Then ran 4 test cases:

• <svg></svg>: onerror Event (invalid SVG: missing xmlns)
• <svg xmlns="http://www.w3.org/2000/svg"></svg>: onload
• <svg xmlns="http://www.w3.org/2000/svg"></svg><p></p>: onerror Event (two root elements)
• <svg xmlns="http://www.w3.org/2000/svg"></svg><svg xmlns="http://www.w3.org/2000/svg"></svg>: onerror Event (two valid SVGs, but 2 root elements)

Firefox Developer 127.0b3 (64-bit) has the exact same behaviour in all 4 cases.

As a side note, I also just realised that the library doesn't care about missing xmlns, should that be fixed too to behave the same as browsers?

---

• OS: Windows 11 Pro 23H2 22631.3527
• Node.js: v20.11.1
• Library: @napi-rs/canvas 0.1.52