fillText is drawn in only one font out of many.

[tinywolf3]

Expected Behaviour

1. I want to output text in multiple fonts on a single image.

Actual Behaviour

1. I run registerFont multiple times, but it only outputs the first registered font.

Steps To Reproduce

1. You can test this with the code below.

Any Relevant Code Snippets

import { createWriteStream } from 'node:fs';
import { exec } from 'node:child_process';
import * as PImage from 'pureimage';

const fonts: PImage.Font[] = [];

async function test() {
	const font_list = [
		{ name: 'newbie', file: './fonts/SuperNormal.ttf' },
		{ name: 'easy', file: './fonts/SupplyCenter.ttf' },
		{ name: 'normal', file: './fonts/Dobidoo.ttf' },
		{ name: 'hard', file: './fonts/Youchat.ttf' },
		{ name: 'master', file: './fonts/Lazydog.ttf' },
	];
	for (const f of font_list) {
		const font = PImage.registerFont(f.file, f.name);
		await font.load();
		fonts.push(font);
	}

	const img = PImage.make(200, 200);
	const ctx = img.getContext('2d');
	ctx.fillStyle = '#ffffff';
	ctx.fillRect(0, 0, 200, 200);

	ctx.fillStyle = '#cccc00';
	ctx.font = "24pt 'newbie'";
	ctx.textAlign = 'center';
	ctx.fillText('newbie', 100, 40);

	ctx.fillStyle = '#00ff00';
	ctx.font = "24pt 'easy'";
	ctx.textAlign = 'center';
	ctx.fillText('easy', 100, 70);

	ctx.fillStyle = '#000000';
	ctx.font = "24pt 'normal'";
	ctx.textAlign = 'center';
	ctx.fillText('normal', 100, 100);

	ctx.fillStyle = '#ff0000';
	ctx.font = "24pt 'hard'";
	ctx.textAlign = 'center';
	ctx.fillText('hard', 100, 130);

	ctx.fillStyle = '#cc00cc';
	ctx.font = "24pt 'master'";
	ctx.textAlign = 'center';
	ctx.fillText('master', 100, 160);

	await PImage.encodePNGToStream(img, createWriteStream('./test.png'))
		.catch((e) => {
			console.error('there was an error image writing');
		});
	exec('open ./test.png');
}

test();

Platform

OS: macOS Sonoma 14.5 Node Version: v20.12.1 NPM Version: 10.8.1 PureImage Version: 0.4.13

Any Additional Info

result expect