Text rendering options in the Figma plugin are now unusable

I have an existing plugin that I have created that has the functionality to render text. I have already loaded fonts before rendering the text on a shape. However, I got this error displayed

Cannot write to node with unloaded font \"Inter Regular\". Please call figma.loadFontAsync({ family: \"Inter\", style: \"Regular\" }) and await the returned promise first.

/**
 * load fonts that is selected
 * @param {FontName} fontStyle
 * @returns {Promise<void>}
 */
const loadFont = async (fontStyle: FontName): Promise<void> => {
    await figma.loadFontAsync(fontStyle);
};
/**
 * Renders text into their corresponding text box
 * @param {string} text - text to render.
 * @param {number} width
 * @param {number} height
 * @param {number} x
 * @param {number} y
 * @returns {Promise<TextNode>}
 */
const renderText = async (
    text: string,
    width: number,
    height: number,
    x: number,
    y: number
): Promise<TextNode> => {
    await loadFont({ family: "Roboto", style: "Regular" });
    const textBox = figma.createText();
    textBox.resize(width, height);
    textBox.textAutoResize = "HEIGHT";
    textBox.insertCharacters(0, text);
    textBox.fontSize = textSize;
    textBox.textAlignHorizontal = "LEFT";
    textBox.textAlignVertical = "TOP";
    textBox.x = x;
    textBox.y = y;
    return textBox;
};

Does anyone face the same issue as I did?

It doesn’t seem to have been announced, but it looks like Figma has changed the default font from Roboto to Inter. Therefore, to avoid such unpleasant surprises, when creating a TextNode, you need to explicitly specify the fontName.

textBox.fontName = { family: "Roboto", style: "Regular" };
1 Like

Hi @tank666, thanks for the help, works now :+1: