Truncating text glitch/problem

I have text in a component set to truncate, however when I create an instance of the component and add text through the properties panel I only get an eclipse at the start of the text box (no text).

However when I change the width of the instance the truncation works as expected. (see attached).

Additionally, if I input text directly into the instance (by clicking into the text box), the truncating is works properly.

Can anyone help and is this a glitch or am I doing something wrong?

5 Likes

I’m having this issue as well.

My existing component which was working fine stopped working and resulted to only the first 2-3 characters showing then a truncation “…”

I think this is after a latest auto-update?

4 Likes

Have the same problem. Happened just today

1 Like

+1, also been experiencing this since yesterday.

+1
It started a day ago or so, first I thought something with my component was destroyed, but I cannot make it work any longer, the three dots sometimes is outside the component as well, sometimes the three dots are cut/truncated as well
image

I just reported it as a bug, maybe more people should do it?

Plus 1. Following for possible Solutions

A temporary solution that worked for me was to detach the component. It resolves this glitch.

+1, I’m also having this problem.

We’re having the same bug! Will try reporting it.

I’m having the same problem, and the weirdest part is that instances of the component with the issue…don’t have the issue. Same exact settings on the text, but even when I paste a new instance of the component, that instance has properly truncated text. But the main component does not. It truncates about 20% of the way into the line, instead of 100%.

1 Like

Hi everyone, thank you for reporting this. Our engineering team is actively investigating the matter and working to a resolution.

1 Like

I’m using text truncating in a container not wide enough to show everything (meaning, there’s extra text after the three dots), but text gets cut off before the end of the container. It gets cut off in the middle of it. It looks just fine while I’m editing the field. See the screenshots.


The cutoff point remains the same no matter how much I stretch the field, until there is enough space for the whole text to appear.

Has anyone had similar issues? Any idea why this happens?

1 Like

So, I think I might have found out what the issue is.

The text container is in an instance. Container horizontal resizing is set to Fill. When I return it to Fixed, the container actually ends at the same place where the truncating starts in a Fill setup. When I detach instance, the truncating starts working as intended.

So this clearly has something to do with the fact that the text container is in a component. As to why it behaves like this, I have no idea. Probably some deeply buried system issue.

Hope Figma devs see this. Or anyone who encounters the same issue. Hope I’ve explained it well enough.

1 Like

Hi everyone, thank you for your patience. Our engineering team has successfully released a fix! Please refresh Figma to ensure that you are using the fixed version.

4 Likes

Seems to work for me, but it looks like I have to “resize” all places, is there a way to “refresh” all my work?

1 Like

image
Looks good on my end now.

@Ryan_52 Thank you guys for the quick fix!

1 Like

Cool, thanks for a quick update, @Ryan_52!

I agree with @Lars_Dahlen though, I also have to see to every single section and click on it to actually update it. I don’t have to resize it to nudge the truncate to start working properly, but I do have to simply select the text container to update the truncate. Refreshing the file does do the trick.

2 Likes

Thanks for the update but i still think it isn’t working perfectly. The truncation ist still ending to soon. The truncation is ending in the middle of a button and when i am clicking inside the textfield, the truncation is running out of the textframe.

You may need to select a problem instance and click the ‘Regenerate all instances (slow)’ command (found in the Main Menu in the top left, and then click “Quick Actions” and type the command and click this), for these to now display correctly.