Does not take letter-spacing or word-spacing into account
arasmussen opened this issue · 2 comments
If there's any letter-spacing / word-spacing set on the text, react-truncate will not calculate properly, and it'll render more than this.props.lines
lines.
Looks like you can set letter-spacing
/ word-spacing
on the canvas itself https://stackoverflow.com/questions/8952909/letter-spacing-in-canvas-element
Note that the canvas MUST be added to the DOM in order for Chrome to take into account word/letter spacing in its calculations. Probably fine to just add a hidden element somewhere and use it repeatedly.
Here's a working demo: https://jsfiddle.net/zpxh647v/1/
Duplicate of #59.
Further context: #30 (comment).
If you want to support that in your codebase, I suggest monkey-patching Truncate.prototype.measureWidth