Font issues on Alpine

[2fd]

I'm trying to create an image inside a node container on alpine, but the prop front doesn't update if I assign a new value.

As a Proof of Concept I setup this repo https://github.com/2fd/poc-skia-canvas-context to show the error.

It runs the following test:

    // Create canvas  and context
    const canvas = new Canvas(100, 100)
    const context = canvas.getContext('2d')

    // Check default value
    expect(context.font).toBe('10px sans-serif')

    // Check update
    context.font = 'normal 600 20px/24px Times'
    expect(context.font).toBe('normal 600 20px/24px Times')

and run it on node 14, 16, 18, and 20 using slim and alpine and it fails on every version of alpine

the value of font never was updated

[arthurbdev]

Did you find a workaround?

[2fd]

no, I didn't

[2fd]

Hi @arthurbdev, after digging a little bit a found the root cause here. If you try to update the context with a font that is not present on your distro it will ignore any other change. In which case the solution will be to install the font you will use.

I have tested it and it worked just fine:

[samizdatco]

By default, many Alpine-based docker images don't have any fonts installed, so it's important to either add something to the system or dynamically via FontLibrary.use() if you want to be able to render text.