Height calculation is not accurate when using word-break #325
Description
Currently, if word-break:all is set, the hidden textarea isn't inheriting this style which causes the height calculation of the hidden textarea to be inaccurate.
Example:
CSS:
.some-class {
font-family: NotoSansKR,sans-serif;
font-size: 16px;
line-height: 1.6;
word-break: keep-all;
}JSX:
..
render() {
<div className={"some-class"}>
<TextareaAutosize />
</div>;
}
..Rendered HTML:
<body>
<div class="some-class">
<textarea style="height: 1104px;"></textarea>
</div>
<!-- Hidden textarea is rendered here but does not have the style word-break:all set -->
<textarea tab-index="-1" aria-hidden="true" style="min-height: 0px !important; max-height: none !important; height: 0px !important; visibility: hidden !important; overflow: hidden !important; position: absolute !important; z-index: -1000 !important; top: 0px !important; right: 0px !important; letter-spacing: normal; line-height: 23.299760818481445px; font-family: NotoSansKR, sans-serif; font-weight: normal; font-size: 16.06879997253418px; font-style: normal; tab-size: 8; text-rendering: auto; text-transform: none; width: 229px; text-indent: 0px; padding: 0px; border-width: 0px; box-sizing: border-box;"></textarea>
</body>I'll create a PR for it :)