ZeeCoder
feat: Support React 19
Not without having dedicated tests for React 19 alongside React 18, I'm sorry
@ZeeCoder I've updated the dev dependency of React to 19 and tests seem to run.
The only thing I had to change was a usage of useRef within the library, to match the updated types of React (which require an argument to useRef), but for consumers it shouldn't make a difference.
Does that look good to you?
@ZeeCoder Any chance this can be merged & released now after https://github.com/ZeeCoder/use-resize-observer/pull/114/commits/7a266a2a004947cf4e270cf6b4477377c6d4ac9e?
@amannn this still only tests with v19. I can see from @ZeeCoder's comments on #108 he'll want you to update testing.yml with a matrix so 18 and 19 are tested again. I haven't tested these changes but you'll need something like the following (plus update package.json so that both versions are allowed in devDependencies)
name: Testing
on:
pull_request:
branches:
- master
- alpha
jobs:
testing:
runs-on: ubuntu-latest
strategy:
matrix:
react-version: [18, 19]
env:
BS_ACCESS_KEY: ${{ secrets.BS_ACCESS_KEY }}
BS_USERNAME: ${{ secrets.BS_USERNAME }}
steps:
- name: Checkout code
uses: actions/checkout@v3
- name: Set up Node
uses: actions/setup-node@v3
with:
always-auth: true
node-version: 14
- name: Installing Dependencies
run: yarn install --frozen-lockfile
- name: Install React ${{ matrix.react-version }}
run: yarn add react@${{ matrix.react-version }} react-dom@${{ matrix.react-version }} --dev
- name: Checking File Size
run: yarn check:size
- name: Checking Linting Rules
run: yarn check:lint
- name: Checking Types
run: yarn check:types
- name: Running Unit Tests
run: yarn test:unit
- name: Testing SSR
run: yarn test:create:ssr
- name: Testing in Modern Browsers (BrowserStack)
run: yarn test:bs:modern
- name: Testing in Legacy Browsers (BrowserStack)
run: yarn test:bs:legacy
@jamesmoss Thanks for the suggestion, I've updated the test file accordingly. I think package.json doesn't need to be changed though, as yarn add react@18 would update the file anyway—right?
@ZeeCoder Can you try executing the workflow to see if this works?
I might find some time this Sunday, but not until then unfortunately. Appreciate the effort 🙏
I'm sorry but I'm really struggling to find the time and give this the attention it deserves.
I managed to work about an hour on this yesterday, and bumped into a bunch of errors (the deps sorely need an upgrade!), like this one:
I finally managed to get things running with node v16, but then I got to this error:
Seems like the types are not quite right yet, although interestingly the CI would tell you otherwise. (Type checks passed for both react versions)
The main thing I wanted to check is to just ensure, that if I used the hook with v18, then the types would be compatible with v19 as well, otherwise this'd be a breaking change only supporting v19 and above.
The CI seems to break for reasons not related to the code that I'll need to fix, but in the meantime it's possible to run type checking, size checking and unit tests locally.
Hey, thanks for looking into this @ZeeCoder! I unfortunately don't have the time currently to dive deeper into this and have therefore decided to add a simple, custom implementation of useResizeObserver in my app instead of this dependency so that I can unblock the React 19 upgrade for me.
If someone else wants to finish this PR, feel free to fork away from the current state on this branch.
The only thing blocking this is that I don't think making the hook support types of both v18 and v19 is trivial. I might just deploy a new major for v19 exclusively when I get the time as that wouldn't require that much work and there's not as much uncertainty.
The only thing blocking this is that I don't think making the hook support types of both v18 and v19 is trivial. I might just deploy a new major for v19 exclusively when I get the time as that wouldn't require that much work and there's not as much uncertainty.
Hey @ZeeCoder, I just wanted to ask if there's any update on this? Also, after playing around a bit with this PR, it seems it could support react v18.3 & v19, but earlier versions than v18.3 resulted in some type errors. Or am I missing something?
@ZeeCoder Hey, are you still planning on releasing a new major version for React 19 exclusively? Thanks in advance.
Yeah sorry for not getting around this, I thought I'd be able to before May as that's when our twins were born, but unfortunately I didn't make it in time. Now I'm just way to busy with family stuff and I'm also working at a demanding early stage startup, so I just could not justify sacrificing any precious free time I've came across in the past weeks to work on any passion projects. :/
That being said: the plan is the same, if I get ~half a day to a day maybe one weekend, I'd just roll out a new version for V19 exclusively.
And for the record: I've been using the lib with React 19 at work as well and it seemed fine.
I'd be reluctant to just bump the version though because types do fail, and with this library I'm committed to ensure cross-browser functionality ensured by automated tests. Unfortunately tooling is way outdated as well and couldn't find an easy fix.
I'll probably have to replace some of it and upgrade others, but again I just could not find more than 1 or 2 hours at a time and it's just not enough.
@ZeeCoder Totally understandable. Congrats on the twins! 🎉
It'd be nice if you posted a comment here once you roll out the new version, just so we get a notification. Thanks!
@ZeeCoder Yes, that would be super-helpful if this PR could be finalized some time soon. Please, let us all know if we can help you push this over the line. Thank you for this amazing library!
