Skip to main content
Solved

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?

Best answer by Ryan_52

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.

View original
This topic has been closed for replies.

Irfan_Dahir

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?


Nataliya2

Have the same problem. Happened just today


Tiffany10

+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


Irfan_Dahir

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


Luongnd
  • New Participant
  • September 11, 2023

+1, I’m also having this problem.


Kelly_Ne
  • New Participant
  • September 11, 2023

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?


Kelly_Ne
  • New Participant
  • September 11, 2023

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.


Antoine
  • New Participant
  • September 11, 2023

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%.


Ryan_52
Figmate
  • Technical Quality Specialist
  • September 11, 2023

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


Ryan_52
Figmate
  • Technical Quality Specialist
  • September 12, 2023

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.


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


Irfan_Dahir

image
Looks good on my end now.

@Ryan_52 Thank you guys for the quick fix!


Kelly_Ne
  • New Participant
  • September 12, 2023

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.


Mel_Bosch
  • New Participant
  • September 12, 2023

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.


Ryan_52
Figmate
  • Technical Quality Specialist
  • September 13, 2023

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.


Ryan_52
Figmate
  • Technical Quality Specialist
  • September 13, 2023

Can you try and reload the file or Regenerate all instances (slow) to see if that helps? If you are still seeing an issue, mind reaching out to our support team directly via this form for help: https://help.figma.com/hc/en-us/requests/new


I did that and it seems to work, thanks @Ryan_52


Jason_Lockwood

I’ve updated to the latest version this morning (Oct 16, 2023) and am still seeing truncating issues on my end. I’ve spent loads of time troubleshooting to see if there is a problem with how my component is setup but I cannot reconcile.

Once I toggle a boolean prop (to display icon) the text box (set to ‘Fill’) changes width however, the text truncation doesn’t follow the adjusted text field width as expected.

To fix this, I have to click into the text box and backspace to the point where the text is being truncated, then I have to reformat the text. Only then will the text w/ellipsis appropriately fill the text box.


Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings