Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Use of getComputedStyle Results in maximumHeight Being NaN #9

Open
waylandwoodruff opened this issue Feb 25, 2019 · 0 comments
Open

Comments

@waylandwoodruff
Copy link

For app frameworks like Angular, HTML elements can be generated and apply effects (like line-clamping) before those HTML elements are actually rendered into the DOM. This means that virtually all values from window.getComputedStyles are empty strings which makes this line of code produce NaN as a value.

In truncateTextNode, the comparison of the text node's scroll height to the maximum height now compares a number (zero) to NaN, which is always false. This never breaks out of the loop and every word in the text node gets deleted. This means that text node content that gets initialized before an HTML element is inserted into the DOM will be deleted completely.

Can lineHeight be added as an option to the exported function so that frameworks can inject expected line heights before components are added to the DOM? Some other alternative could be acceptable, so long as the case of a zero-height element with no computed line-height value can be handled.

module.exports = function (rootElement, lineCount, options) {
  ...
  var maximumHeight =
    (lineCount || 1) * parseInt(window.getComputedStyle(rootElement).lineHeight || options.lineHeight, 10);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants