Andarist / react-textarea-autosize

<textarea /> component for React which grows with content
http://andarist.github.io/react-textarea-autosize/
MIT License
2.18k stars 244 forks source link

Handle custom fonts loading #362

Closed ArnaudRinquin closed 1 year ago

ArnaudRinquin commented 1 year ago

We had an issue using this library with a custom font for the textarea. It turns out the initial resizing could be done before the font is loaded.

This PR brings both the fix for it and adds such a case in the examples.

The fix is rather simple: listen for fonts being loaded, the same way we listen for the window being resized, and resize when it is done.

changeset-bot[bot] commented 1 year ago

🦋 Changeset detected

Latest commit: 93acf2ef7307e9845a06052dc88652f904cbaa50

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package | Name | Type | | ----------------------- | ----- | | react-textarea-autosize | Patch |

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

ArnaudRinquin commented 1 year ago

Thanks @Andarist for the review. I tried using the code you provided but it isn't valid in the project's TS version (^3.9.3).

Switching TS version in the TS playground link you provided reveals it:

Screenshot 2023-02-06 at 15 36 31

It works if you select TS 4.4+ and forward.

Should we bump needed TS version or change the code somehow?

The latest commit I pushed should break CI as I commited with disabled hooks.

Andarist commented 1 year ago

I think that it's fine to bump the TS version used by the repository. It won't actually have any effect on public consumers as those particular types are only relevant internally.

ArnaudRinquin commented 1 year ago

@Andarist I upgraded the dev dependencies, eslint, babel and prettier along TS to make the whole setup work.

Andarist commented 1 year ago

It seems that Babel is not happy about this syntax (CI failed) - I think that it should handle this by now though. Could you recheck what is happening?

ArnaudRinquin commented 1 year ago

Damn, I will.

ArnaudRinquin commented 1 year ago

@Andarist I'm not to happy with the shenanigans I had to go through to get the tests pass: adding JSDom + mocking the listeners. It doesn't really hurt but it's not crazy elegant either.

ArnaudRinquin commented 1 year ago

Hey @Andarist do you see any blockers for this PR? Happy to adjust