Text Truncated with advancedRenderer but Ellipsis Included in New Line

[soumyaloka]

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]

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:

Lightning/src/textures/TextTextureRendererAdvanced.mjs

Line 270 in 5c0e3c5

let lastLineText = text.filter((t) => t.lineNo == index)

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.