context.drawImage() does not respect sy parameter when scaled

[jejebecarte]

Issue or Feature

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

When using context.drawImage() with a slice of an image as the source, and then scaling the result up occasionally results in areas outside the slice being included in the final output. Changing the scaling factor can change the position of or remove these issues. (Try a scaling factor of 24 or 30 in the example below and see how the issue goes away).

In this example, the expected output vs. actual output (notice the 1px line at the top, which is from the character above in the supplied sprite sheet):

While I'm not able to verify this, I think the entire imaged might be shifted by 1px when this artifact is included.

Also note that many, but not all characters experience this issue. Some include lines on the bottom and others on the top.

Steps to Reproduce

Place the nonlatin_european.png in the directory and run the following code:

const fs = require('fs');
const path = require('path');
const { createCanvas, Image } = require('canvas');

const SCALING = 27;
const SIDE_LENGTH = 8;

const image = new Image();
image.onload = () => {
    const canvas = createCanvas(250, 250);
    const ctx = canvas.getContext('2d');

    ctx.imageSmoothingEnabled = false;
    ctx.drawImage(
        image,
        15 * SIDE_LENGTH, // This is \udf36
        61 * SIDE_LENGTH, // This is \udf36
        SIDE_LENGTH,
        SIDE_LENGTH,
        0,
        0,
        SIDE_LENGTH * SCALING,
        SIDE_LENGTH * SCALING
    );

    canvas.createPNGStream().pipe(fs.createWriteStream(path.join(__dirname, 'df36.png')));
};

image.src = path.resolve(__dirname, 'nonlatin_european.png');

Your Environment

• Version of node-canvas: 2.10.2
• Environment: node v20.12.0 on Windows 10

[jejebecarte]

Without changing anything, this issue has randomly resolved itself.