Figma Plugin - help programmatically creating text style - promise

Question

I am trying to create Figma Text styles via a plugin that reads from my design tokens. The problem I am having is when setting the custom font, the promise to load it does not resolve, so it seems to stall the function.
Am I missing something here?
async function createNewTextStyle(token) {
// Style does not yet exist, so create it
const newStyle = figma.createTextStyle();
// the new text style is preloaded with Roboto, so we need to load that
await figma.loadFontAsync(newStyle.fontName);
// This is the font i want to set my text style to.
// it seems that this promise never resolves (or errors).
await figma.loadFontAsync({
family: 'SF Pro Text',
style: 'Regular',
});
// Set the properties of the text style
newStyle.fontName = {
family: 'SF Pro Text',
style: 'Regular',
};
newStyle.name = designToken.name;
newStyle.fontSize = designToken.value;
newStyle.lineHeight = { value: designToken.lineHeight, unit: 'PIXELS' };
}

Answer 1

Hmmm... it looks like you're missing the .then callback that's usually used to handle a promise resolution.
Also, your variable name designToken is not defined in your code, but you're using token (from your function parameters).
Try this in your plugin:
async function createNewTextStyle(token) {
// Style does not yet exist, so create it
const newStyle = figma.createTextStyle();
// the new text style is preloaded with Roboto, so we need to load that
await figma.loadFontAsync(newStyle.fontName);
// This is the font i want to set my text style to.
figma.loadFontAsync({
family: 'SF Pro Text',
style: 'Regular',
}).then(() => {
// Set the properties of the text style
newStyle.fontName = {
family: 'SF Pro Text',
style: 'Regular',
};
newStyle.name = token.name;
newStyle.fontSize = token.value;
newStyle.lineHeight = { value: token.lineHeight, unit: 'PIXELS' };
});
}