Skip to content

Commit

Permalink
feat!: support React19 & drop React 16,17 support
Browse files Browse the repository at this point in the history
  • Loading branch information
@koba04
koba04 committed Dec 24, 2024
1 parent 2989b5b commit 853be7e
Show file tree
Hide file tree
Showing 7 changed files with 59 additions and 100 deletions.
4 changes: 1 addition & 3 deletions .github/workflows/ci.yml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ jobs:
# Otherwise how would we know if a specific React version caused the failure?
fail-fast: false
matrix:
REACT_DIST: [16, 17, 18]
REACT_DIST: [18, 19]
steps:
- uses: actions/checkout@v2
- name: Use Node.js 14
Expand All @@ -24,8 +24,6 @@ jobs:
cache: 'npm'
- run: yarn
- run: yarn add react@${{ matrix.REACT_DIST }} react-dom@${{ matrix.REACT_DIST }}
- run: yarn add @testing-library/react@12
if: matrix.REACT_DIST == '17' || matrix.REACT_DIST == '16'
- run: yarn --cwd www
# Test whether the web page can be built successfully or not
- run: yarn --cwd www build
Expand Down
7 changes: 4 additions & 3 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -80,7 +80,8 @@
"@semantic-release/npm": "^7.0.5",
"@storybook/addon-actions": "^6.3.4",
"@storybook/react": "^6.3.4",
"@testing-library/react": "alpha",
"@testing-library/dom": "^10.4.0",
"@testing-library/react": "^16.1.0",
"@typescript-eslint/eslint-plugin": "^4.26.1",
"astroturf": "^0.10.4",
"babel-eslint": "^10.1.0",
Expand All @@ -99,8 +100,8 @@
"jest": "^25.3.0",
"npm-run-all": "^4.1.5",
"prettier": "^2.3.1",
"react": "^18.0.0",
"react-dom": "^18.0.0",
"react": "^19.0.0",
"react-dom": "^19.0.0",
"release-script": "^1.0.2",
"rimraf": "^3.0.2",
"rollup": "^2.6.1",
Expand Down
11 changes: 4 additions & 7 deletions test/CSSTransitionGroup-test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@ import hasClass from 'dom-helpers/hasClass';
import CSSTransition from '../src/CSSTransition';

let React;
let ReactDOM;
let TransitionGroup;
let act;
let render;
Expand All @@ -25,9 +24,7 @@ describe('CSSTransitionGroup', () => {
beforeEach(() => {
jest.resetModuleRegistry();
jest.useFakeTimers();

React = require('react');
ReactDOM = require('react-dom');
const testUtils = require('./utils');
act = testUtils.act;
const baseRender = testUtils.render;
Expand Down Expand Up @@ -147,13 +144,14 @@ describe('CSSTransitionGroup', () => {
});

it('should work with a child which renders as null', () => {
const nodeRef = React.createRef();
const NullComponent = () => null;
// Testing the whole lifecycle of entering and exiting,
// because those lifecycle methods used to fail when the DOM node was null.
render(<TransitionGroup />, container);
render(
<TransitionGroup>
<CSSTransition classNames="yolo" timeout={0}>
<CSSTransition classNames="yolo" timeout={0} nodeRef={nodeRef}>
<NullComponent />
</CSSTransition>
</TransitionGroup>,
Expand Down Expand Up @@ -208,14 +206,13 @@ describe('CSSTransitionGroup', () => {
}

render(<Component />, container);
render(
const { unmount } = render(
<Component>
<YoloTransition key="yolo" id="yolo" />
</Component>,
container
);

ReactDOM.unmountComponentAtNode(container);
unmount();

// Testing that no exception is thrown here, as the timeout has been cleared.
act(() => {
Expand Down
30 changes: 0 additions & 30 deletions test/Transition-test.js
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
import React from 'react';
import ReactDOM from 'react-dom';

import { render, waitFor } from './utils';

Expand Down Expand Up @@ -197,35 +196,6 @@ describe('Transition', () => {
});
});

it('should use `React.findDOMNode` when `nodeRef` is not provided', () => {
const consoleSpy = jest.spyOn(console, 'error').mockImplementation();
const findDOMNodeSpy = jest.spyOn(ReactDOM, 'findDOMNode');

render(
<Transition in appear timeout={0}>
<div />
</Transition>
);

expect(findDOMNodeSpy).toHaveBeenCalled();
findDOMNodeSpy.mockRestore();
consoleSpy.mockRestore();
});

it('should not use `React.findDOMNode` when `nodeRef` is provided', () => {
const findDOMNodeSpy = jest.spyOn(ReactDOM, 'findDOMNode');

const nodeRef = React.createRef();
render(
<Transition nodeRef={nodeRef} in appear timeout={0}>
<div ref={nodeRef} />
</Transition>
);

expect(findDOMNodeSpy).not.toHaveBeenCalled();
findDOMNodeSpy.mockRestore();
});

describe('appearing timeout', () => {
it('should use enter timeout if appear not set', async () => {
let calledBeforeEntered = false;
Expand Down
2 changes: 1 addition & 1 deletion test/setupAfterEnv.js
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { cleanup } from '@testing-library/react/pure';
import { cleanup } from '@testing-library/react';

afterEach(() => {
cleanup();
Expand Down
2 changes: 1 addition & 1 deletion test/utils.js
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { render as baseRender } from '@testing-library/react/pure';
import { render as baseRender } from '@testing-library/react';
import React from 'react';

export * from '@testing-library/react';
Expand Down
103 changes: 48 additions & 55 deletions yarn.lock
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3492,28 +3492,26 @@
resolve-from "^5.0.0"
store2 "^2.12.0"

"@testing-library/dom@^8.5.0":
version "8.12.0"
resolved "https://registry.yarnpkg.com/@testing-library/dom/-/dom-8.12.0.tgz#fef5e545533fb084175dda6509ee71d7d2f72e23"
integrity sha512-rBrJk5WjI02X1edtiUcZhgyhgBhiut96r5Jp8J5qktKdcvLcZpKDW8i2hkGMMItxrghjXuQ5AM6aE0imnFawaw==
"@testing-library/dom@^10.4.0":
version "10.4.0"
resolved "https://registry.yarnpkg.com/@testing-library/dom/-/dom-10.4.0.tgz#82a9d9462f11d240ecadbf406607c6ceeeff43a8"
integrity sha512-pemlzrSESWbdAloYml3bAJMEfNh1Z7EduzqPKprCH5S341frlpYnUEW0H72dLxa6IsYr+mPno20GiSm+h9dEdQ==
dependencies:
"@babel/code-frame" "^7.10.4"
"@babel/runtime" "^7.12.5"
"@types/aria-query" "^4.2.0"
aria-query "^5.0.0"
"@types/aria-query" "^5.0.1"
aria-query "5.3.0"
chalk "^4.1.0"
dom-accessibility-api "^0.5.9"
lz-string "^1.4.4"
lz-string "^1.5.0"
pretty-format "^27.0.2"

"@testing-library/react@alpha":
version "13.0.0-alpha.7"
resolved "https://registry.yarnpkg.com/@testing-library/react/-/react-13.0.0-alpha.7.tgz#0537af3a8d45edd925fd0275aee7d409285ef1fe"
integrity sha512-8Y1PvFczthSeow1WZ0Cq6WbOzpVGLGyEQTr+lL6BwXqAf2IykVY8ZN8V21Ch1cTlbZuZJI5UV3gOyrOHrw9YZQ==
"@testing-library/react@^16.1.0":
version "16.1.0"
resolved "https://registry.yarnpkg.com/@testing-library/react/-/react-16.1.0.tgz#aa0c61398bac82eaf89776967e97de41ac742d71"
integrity sha512-Q2ToPvg0KsVL0ohND9A3zLJWcOXXcO8IDu3fj11KhNt0UlCWyFyvnCIBkd12tidB2lkiVRG8VFqdhcqhqnAQtg==
dependencies:
"@babel/runtime" "^7.12.5"
"@testing-library/dom" "^8.5.0"
"@types/react-dom" "*"

"@tootallnate/once@1":
version "1.0.0"
Expand All @@ -3525,10 +3523,10 @@
resolved "https://registry.yarnpkg.com/@types/anymatch/-/anymatch-1.3.1.tgz#336badc1beecb9dacc38bea2cf32adf627a8421a"
integrity sha512-/+CRPXpBDpo2RK9C68N3b2cOvO0Cf5B9aPijHsoDQTHivnGSObdOF2BRQOYjojWTDy6nQvMjmqRXIxH55VjxxA==

"@types/aria-query@^4.2.0":
version "4.2.2"
resolved "https://registry.yarnpkg.com/@types/aria-query/-/aria-query-4.2.2.tgz#ed4e0ad92306a704f9fb132a0cfcf77486dbe2bc"
integrity sha512-HnYpAE1Y6kRyKM/XkEuiRQhTHvkzMBurTHnpFLYLBGPIylZNPs9jJcuOOYWxPLJCSEtmZT0Y8rHDokKN7rRTig==
"@types/aria-query@^5.0.1":
version "5.0.4"
resolved "https://registry.yarnpkg.com/@types/aria-query/-/aria-query-5.0.4.tgz#1a31c3d378850d2778dabb6374d036dcba4ba708"
integrity sha512-rfT93uj5s0PRL7EzccGMs3brplhcrghnDoV26NqKhCAS1hVo+WdNsPvE/yb6ilfr5hi2MEk6d5EWJTKdxg8jVw==

"@types/babel__core@^7.1.7":
version "7.1.7"
Expand Down Expand Up @@ -3767,13 +3765,6 @@
dependencies:
"@types/react" "*"

"@types/react-dom@*":
version "17.0.14"
resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-17.0.14.tgz#c8f917156b652ddf807711f5becbd2ab018dea9f"
integrity sha512-H03xwEP1oXmSfl3iobtmQ/2dHF5aBHr8aUMwyGZya6OW45G+xtdzmq6HkncefiBt5JU8DVyaWl/nWZbjZCnzAQ==
dependencies:
"@types/react" "*"

"@types/[email protected]":
version "11.0.5"
resolved "https://registry.yarnpkg.com/@types/react-syntax-highlighter/-/react-syntax-highlighter-11.0.5.tgz#0d546261b4021e1f9d85b50401c0a42acb106087"
Expand Down Expand Up @@ -4453,6 +4444,13 @@ argv-formatter@~1.0.0:
resolved "https://registry.yarnpkg.com/argv-formatter/-/argv-formatter-1.0.0.tgz#a0ca0cbc29a5b73e836eebe1cbf6c5e0e4eb82f9"
integrity sha1-oMoMvCmltz6Dbuvhy/bF4OTrgvk=

[email protected]:
version "5.3.0"
resolved "https://registry.yarnpkg.com/aria-query/-/aria-query-5.3.0.tgz#650c569e41ad90b51b3d7df5e5eed1c7549c103e"
integrity sha512-b0P0sZPKtyu8HkeRAfCq0IfURZK+SuwMjY1UXGBU27wpAiTwQAIlq56IbIO+ytk/JjS1fMR14ee5WBBfKi5J6A==
dependencies:
dequal "^2.0.3"

aria-query@^4.2.2:
version "4.2.2"
resolved "https://registry.yarnpkg.com/aria-query/-/aria-query-4.2.2.tgz#0d2ca6c9aceb56b8977e9fed6aed7e15bbd2f83b"
Expand All @@ -4461,11 +4459,6 @@ aria-query@^4.2.2:
"@babel/runtime" "^7.10.2"
"@babel/runtime-corejs3" "^7.10.2"

aria-query@^5.0.0:
version "5.0.0"
resolved "https://registry.yarnpkg.com/aria-query/-/aria-query-5.0.0.tgz#210c21aaf469613ee8c9a62c7f86525e058db52c"
integrity sha512-V+SM7AbUwJ+EBnB8+DXs0hPZHO0W6pqBcc0dW90OwtVG02PswOu/teuARoLQjdDOH+t9pJgGnW5/Qmouf3gPJg==

arr-diff@^4.0.0:
version "4.0.0"
resolved "https://registry.yarnpkg.com/arr-diff/-/arr-diff-4.0.0.tgz#d6461074febfec71e7e15235761a329a5dc7c520"
Expand Down Expand Up @@ -6967,6 +6960,11 @@ deprecation@^2.0.0, deprecation@^2.3.1:
resolved "https://registry.yarnpkg.com/deprecation/-/deprecation-2.3.1.tgz#6368cbdb40abf3373b525ac87e4a260c3a700919"
integrity sha512-xmHIy4F3scKVwMsQ4WnVaS8bHOx0DmVwRywosKhaILI0ywMDWPtBSku2HNxRvF7jtwDRsoEwYQSfbxj8b7RlJQ==

dequal@^2.0.3:
version "2.0.3"
resolved "https://registry.yarnpkg.com/dequal/-/dequal-2.0.3.tgz#2644214f1997d39ed0ee0ece72335490a7ac67be"
integrity sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA==

des.js@^1.0.0:
version "1.0.1"
resolved "https://registry.yarnpkg.com/des.js/-/des.js-1.0.1.tgz#5382142e1bdc53f85d86d53e5f4aa7deb91e0843"
Expand Down Expand Up @@ -7074,9 +7072,9 @@ doctrine@^3.0.0:
esutils "^2.0.2"

dom-accessibility-api@^0.5.9:
version "0.5.13"
resolved "https://registry.yarnpkg.com/dom-accessibility-api/-/dom-accessibility-api-0.5.13.tgz#102ee5f25eacce09bdf1cfa5a298f86da473be4b"
integrity sha512-R305kwb5CcMDIpSHUnLyIAp7SrSPBx6F0VfQFB3M75xVMHhXJJIdePYgbPPh1o57vCHNu5QztokWUPsLjWzFqw==
version "0.5.16"
resolved "https://registry.yarnpkg.com/dom-accessibility-api/-/dom-accessibility-api-0.5.16.tgz#5a7429e6066eb3664d911e33fb0e45de8eb08453"
integrity sha512-X7BJ2yElsnOJ30pZF4uIIDfBEVgF4XEBxL9Bxhy6dnrm5hkzqmsWHGTiHqRiITNhMyFLyAiWndIJP7Z1NTteDg==

dom-converter@^0.2:
version "0.2.0"
Expand Down Expand Up @@ -11449,7 +11447,7 @@ lolex@^5.0.0:
dependencies:
"@sinonjs/commons" "^1.7.0"

loose-envify@^1.0.0, loose-envify@^1.1.0, loose-envify@^1.4.0:
loose-envify@^1.0.0, loose-envify@^1.4.0:
version "1.4.0"
resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf"
integrity sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==
Expand Down Expand Up @@ -11506,10 +11504,10 @@ lru-cache@^6.0.0:
dependencies:
yallist "^4.0.0"

lz-string@^1.4.4:
version "1.4.4"
resolved "https://registry.yarnpkg.com/lz-string/-/lz-string-1.4.4.tgz#c0d8eaf36059f705796e1e344811cf4c498d3a26"
integrity sha1-wNjq82BZ9wV5bh40SBHPTEmNOiY=
lz-string@^1.5.0:
version "1.5.0"
resolved "https://registry.yarnpkg.com/lz-string/-/lz-string-1.5.0.tgz#c1ab50f77887b712621201ba9fd4e3a6ed099941"
integrity sha512-h5bgJWpxJNswbU7qCrV0tIKQCaS3blPDrqKWx+QxzuzL1zGUzij9XCWLrSLsJPu5t+eWA/ycetzYAO5IOMcWAQ==

macos-release@^2.2.0:
version "2.3.0"
Expand Down Expand Up @@ -14354,13 +14352,12 @@ react-docgen@^5.0.0:
node-dir "^0.1.10"
strip-indent "^3.0.0"

react-dom@^18.0.0:
version "18.0.0"
resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-18.0.0.tgz#26b88534f8f1dbb80853e1eabe752f24100d8023"
integrity sha512-XqX7uzmFo0pUceWFCt7Gff6IyIMzFUn7QMZrbrQfGxtaxXZIcGQzoNpRLE3fQLnS4XzLLPMZX2T9TRcSrasicw==
react-dom@^19.0.0:
version "19.0.0"
resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-19.0.0.tgz#43446f1f01c65a4cd7f7588083e686a6726cfb57"
integrity sha512-4GV5sHFG0e/0AD4X+ySy6UJd3jVl1iNsNHdpad0qhABJ11twS3TTBnseqsKurKcsNqCEFeGL3uLpVChpIO3QfQ==
dependencies:
loose-envify "^1.1.0"
scheduler "^0.21.0"
scheduler "^0.25.0"

react-draggable@^4.4.3:
version "4.4.3"
Expand Down Expand Up @@ -14472,12 +14469,10 @@ react-textarea-autosize@^8.3.0:
use-composed-ref "^1.0.0"
use-latest "^1.0.0"

react@^18.0.0:
version "18.0.0"
resolved "https://registry.yarnpkg.com/react/-/react-18.0.0.tgz#b468736d1f4a5891f38585ba8e8fb29f91c3cb96"
integrity sha512-x+VL6wbT4JRVPm7EGxXhZ8w8LTROaxPXOqhlGyVSrv0sB1jkyFGgXxJ8LVoPRLvPR6/CIZGFmfzqUa2NYeMr2A==
dependencies:
loose-envify "^1.1.0"
react@^19.0.0:
version "19.0.0"
resolved "https://registry.yarnpkg.com/react/-/react-19.0.0.tgz#6e1969251b9f108870aa4bff37a0ce9ddfaaabdd"
integrity sha512-V8AVnmPIICiWpGfm6GLzCR/W5FXLchHop40W4nXBmdlEceh16rCN8O8LNWm5bh5XUX91fh7KpA+W0TgMKmgTpQ==

read-chunk@^1.0.1:
version "1.0.1"
Expand Down Expand Up @@ -15250,12 +15245,10 @@ saxes@^3.1.9:
dependencies:
xmlchars "^2.1.1"

scheduler@^0.21.0:
version "0.21.0"
resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.21.0.tgz#6fd2532ff5a6d877b6edb12f00d8ab7e8f308820"
integrity sha512-1r87x5fz9MXqswA2ERLo0EbOAU74DpIUO090gIasYTqlVoJeMcl+Z1Rg7WHz+qtPujhS/hGIt9kxZOYBV3faRQ==
dependencies:
loose-envify "^1.1.0"
scheduler@^0.25.0:
version "0.25.0"
resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.25.0.tgz#336cd9768e8cceebf52d3c80e3dcf5de23e7e015"
integrity sha512-xFVuu11jh+xcO7JOAGJNOXld8/TcEHK/4CituBUeUb5hqxJLj9YuemAEuvm9gQ/+pgXYfbQuqAkiYu+u7YEsNA==

[email protected]:
version "2.7.0"
Expand Down

0 comments on commit 853be7e

Please sign in to comment.