rdkcentral / Lightning

Lightning - The WPE UI Framework for developing Apps and UX
Apache License 2.0
188 stars 109 forks source link

Text Truncated with advancedRenderer but Ellipsis Included in New Line #533

Open soumyaloka opened 5 months ago

soumyaloka commented 5 months ago

When using the advanceRenderer and wordBreak feature in the Lightning framework, we have observed an issue where text is truncated, but instead of adding an ellipsis (...) at the end of the truncated text, the ellipsis is included in a new line, causing unexpected layout behavior.

ImCoolNowRight commented 1 week ago

I've done some digging and have some more context to help with resolving this issue.

Using this playground, I'd expect that the fifth line to display "wordThatShouldNotOverlfow:(", but truncated, with a suffix appended, and still fitting within the assigned wordWrapWidth. I recreated this playground locally so I could dig into this, and I think I've narrowed down at least an initial problem to this line: https://github.com/rdkcentral/Lightning/blob/5c0e3c58d3f0bedf87ee539184a9268b64458571/src/textures/TextTextureRendererAdvanced.mjs#L270

If I place console.log(lastLineText, text.filter((t) => t.lineNo == index)) on a new line after that one, the two values printed out are not the same. lastLineText equals "..", while running the filter again gives me "wordThatShouldNot", which is expected based on the lineNo that is being filtered. It would seem that the filter is producing the wrong text, and that is what is leading to the ".." to exist on its own line instead of being appended to the correct text that should show on that line.