Problem while sending a canvas image of text

[BEAST2802]

Issue or Feature

• [x] If this is an issue with installation, I have read the troubleshooting guide.

Code

const Canvas = require("canvas");
        let desc;
        let foot;
        let body = await client.axios.get("https://api.quotable.io/random");
        body = body?.data;
        if(body[0]?.content) {
            desc = body[0]?.content;
            foot = body[0]?.author;
        } else {
            body = await client.axios.get("https://zenquotes.io/api/random");
            body = body?.data;
            desc = body[0]?.q;
            foot = body[0]?.a;
        }
        if(!desc || !foot) return client.functions.senderr(message, `${client.ename.error} | There was an error while fetching quotes from our database. Please Try Again.`);
        let msg = desc;
        let randomCol = '#'+((1<<24)*(Math.random()+1)|0xc0c0c0).toString(16).substr(1);
        msg = await client.functions.splitstr(msg, "35",  " ");
        let sent = msg.join(" ");
        if(msg.length > 10) return
        let width = msg.length * 100;
        msg = msg.join("\n");
        const canvas = Canvas.createCanvas(1500, width);
        const ctx = canvas.getContext('2d');
        const background = await Canvas.loadImage('https://media.discordapp.net/attachments/950035664223735848/950229476204220426/fast.png');
        ctx.drawImage(background, 0, 0, canvas.width, canvas.height);
        ctx.strokeStyle = randomCol;
        ctx.strokeRect(0, 0, canvas.width, canvas.height);
        ctx.font = '70px Impact';
        ctx.textAlign = "start";
        ctx.fillStyle = randomCol;
        ctx.fillText(msg, 80, 80);
        ctx.clip();
let att = new client.discord.MessageAttachment(canvas.toBuffer(), "test.png");
message.channel.send({files: [att]});

Issue

I have made the above code and it was working till day before yesterday but from yesterday it's returning the the below image which is a problem.

I tried returning only the text and the text was correct but after it passes through my canvas code it returns those wierd symbols image which is surprising because it was working perfectly before but recently it's behaving like that even if i didn't changed anything in the code.

Any help regarding this would be appreciated. I tried to find the support server of canvas but was unable.

Your Environment

• Version of node-canvas 2.9.1
• Environment node 16.4.2 on linux

[BEAST2802]

Ok nvm i fixed it by changing Font. But the font i was using in this was given in example and was even working. But don't know why this font no longer works.

[zbjornson]

v2.9.1 changed how fonts are selected on Linux, but I didn't know it would affect system fonts. @chearon might know more.

registerFont might/should make Impact usable again.

[chearon]

Those changes won't run if the font-family passed to ctx.font doesn't match any registerFont fonts. Looks more like @BeastBoyADI's system fonts changed. If there aren't many fonts installed and/or if FontConfig is not configured well, the cascade list for "Impact" could easily have wingdings at the front.