From 14e08558092984332bb37c111f4316b217d1b19b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Matija=20Marohni=C4=87?= Date: Tue, 5 May 2020 20:58:45 +0200 Subject: [PATCH 01/11] Fix ESLint errors --- stories/NestedTransition.js | 2 +- stories/TransitionGroup.js | 2 +- www/gatsby-node.js | 6 +++--- www/src/templates/component.js | 15 +++++++-------- 4 files changed, 12 insertions(+), 13 deletions(-) diff --git a/stories/NestedTransition.js b/stories/NestedTransition.js index 34e987ea..13427b91 100644 --- a/stories/NestedTransition.js +++ b/stories/NestedTransition.js @@ -1,4 +1,4 @@ -import React, { useRef, useState } from 'react' +import React, { useState } from 'react' import StoryFixture from './StoryFixture'; import Fade from './transitions/Fade'; diff --git a/stories/TransitionGroup.js b/stories/TransitionGroup.js index d7447597..b56c4dd4 100644 --- a/stories/TransitionGroup.js +++ b/stories/TransitionGroup.js @@ -1,4 +1,4 @@ -import React, { useEffect, useRef, useState } from 'react' +import React, { useEffect, useState } from 'react' import { storiesOf } from '@storybook/react'; import TransitionGroup from '../src/TransitionGroup'; diff --git a/www/gatsby-node.js b/www/gatsby-node.js index 7abed0a6..28b70c5a 100644 --- a/www/gatsby-node.js +++ b/www/gatsby-node.js @@ -21,19 +21,19 @@ exports.createPages = ({ actions, graphql }) => { } } } - `).then(result => { + `).then((result) => { if (result.errors) { reject(result.errors); } const { componentPages } = config.siteMetadata; result.data.allComponentMetadata.edges .filter(({ node: { displayName } }) => - componentPages.some(page => page.displayName === displayName) + componentPages.some((page) => page.displayName === displayName) ) .forEach(({ node: { displayName } }) => { createPage({ path: componentPages.find( - page => page.displayName === displayName + (page) => page.displayName === displayName ).path, component: componentTemplate, context: { diff --git a/www/src/templates/component.js b/www/src/templates/component.js index 7f98a60a..7a760792 100644 --- a/www/src/templates/component.js +++ b/www/src/templates/component.js @@ -11,11 +11,8 @@ function displayObj(obj) { return JSON.stringify(obj, null, 2).replace(/"|'/g, ''); } -let cleanDocletValue = str => - str - .trim() - .replace(/^\{/, '') - .replace(/\}$/, ''); +let cleanDocletValue = (str) => + str.trim().replace(/^\{/, '').replace(/\}$/, ''); const extractMarkdown = ({ description }) => description && @@ -51,7 +48,7 @@ class ComponentTemplate extends React.Component { const { metadata } = data; const { componentPages } = data.site.siteMetadata; const { codeSandboxId } = componentPages.find( - page => page.displayName === metadata.displayName + (page) => page.displayName === metadata.displayName ); return ( @@ -79,7 +76,7 @@ class ComponentTemplate extends React.Component { Accepts all props from{' '} {metadata.composes - .map(p => ( + .map((p) => ( {`<${p.replace('./', '')}>`} )) .reduce((acc, el, i) => { @@ -94,7 +91,9 @@ class ComponentTemplate extends React.Component { )} - {metadata.props.map(p => this.renderProp(p, metadata.displayName))} + {metadata.props.map((p) => + this.renderProp(p, metadata.displayName) + )} From 476cb63a2877b38bb9348686602c2b9382a7fb85 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Matija=20Marohni=C4=87?= Date: Tue, 5 May 2020 20:58:54 +0200 Subject: [PATCH 02/11] Change lint script to run across entire project --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 9568d170..11841a5b 100644 --- a/package.json +++ b/package.json @@ -15,7 +15,7 @@ "build:pick": "cherry-pick --cwd=lib --input-dir=../src --cjs-dir=cjs --esm-dir=esm", "build:dist": "cross-env BABEL_ENV=esm rollup -c", "bootstrap": "yarn && yarn --cwd www", - "lint": "eslint src test", + "lint": "eslint .", "release": "release", "release:next": "release --preid beta --tag next", "deploy-docs": "yarn --cwd www run deploy", From 205c5ceb8af5d23c30e3e1c5e5cd65686a700e4b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Matija=20Marohni=C4=87?= Date: Tue, 5 May 2020 21:01:32 +0200 Subject: [PATCH 03/11] Update Yarn lockfile I'm not sure how this happened, but it's consistent, so I'm committing it. --- yarn.lock | 79 ++++++++----------------------------------------------- 1 file changed, 11 insertions(+), 68 deletions(-) diff --git a/yarn.lock b/yarn.lock index 7bcc27b6..4a9ed647 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5345,14 +5345,14 @@ debug@4, debug@^4.0.0, debug@^4.0.1, debug@^4.1.0, debug@^4.1.1: dependencies: ms "^2.1.1" -debug@^3.0.0, debug@^3.1.0, debug@^3.2.5, debug@^3.2.6: +debug@^3.0.0, debug@^3.1.0, debug@^3.2.5: version "3.2.6" resolved "https://registry.yarnpkg.com/debug/-/debug-3.2.6.tgz#e83d17de16d8a7efb7717edbe5fb10135eee629b" integrity sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ== dependencies: ms "^2.1.1" -debuglog@*, debuglog@^1.0.1: +debuglog@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/debuglog/-/debuglog-1.0.1.tgz#aa24ffb9ac3df9a2351837cfb2d279360cd78492" integrity sha1-qiT/uaw9+aI1GDfPstJ5NgzXhJI= @@ -5493,7 +5493,7 @@ detect-indent@~5.0.0: resolved "https://registry.yarnpkg.com/detect-indent/-/detect-indent-5.0.0.tgz#3871cc0a6a002e8c3e5b3cf7f336264675f06b9d" integrity sha1-OHHMCmoALow+Wzz38zYmRnXwa50= -detect-libc@^1.0.2, detect-libc@^1.0.3: +detect-libc@^1.0.3: version "1.0.3" resolved "https://registry.yarnpkg.com/detect-libc/-/detect-libc-1.0.3.tgz#fa137c4bd698edf55cd5cd02ac559f91a4c4ba9b" integrity sha1-+hN8S9aY7fVc1c0CrFWfkaTEups= @@ -7769,7 +7769,7 @@ husky@^4.2.5: slash "^3.0.0" which-pm-runs "^1.0.0" -iconv-lite@0.4.24, iconv-lite@^0.4.24, iconv-lite@^0.4.4, iconv-lite@~0.4.13: +iconv-lite@0.4.24, iconv-lite@^0.4.24, iconv-lite@~0.4.13: version "0.4.24" resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.24.tgz#2022b4b25fbddc21d2f524974a474aafe733908b" integrity sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA== @@ -7898,7 +7898,7 @@ imports-loader@^0.8.0: loader-utils "^1.0.2" source-map "^0.6.1" -imurmurhash@*, imurmurhash@^0.1.4: +imurmurhash@^0.1.4: version "0.1.4" resolved "https://registry.yarnpkg.com/imurmurhash/-/imurmurhash-0.1.4.tgz#9218b9b2b928a238b13dc4fb6b6d576f231453ea" integrity sha1-khi5srkoojixPcT7a21XbyMUU+o= @@ -9601,11 +9601,6 @@ lodash-es@^4.17.15: resolved "https://registry.yarnpkg.com/lodash-es/-/lodash-es-4.17.15.tgz#21bd96839354412f23d7a10340e5eac6ee455d78" integrity sha512-rlrc3yU3+JNOpZ9zj5pQtxnx2THmvRykwL4Xlxoa8I9lHBlVbbyPhgyPMioxVZ4NqyxaVVtaJnzsyOidQIhyyQ== -lodash._baseindexof@*: - version "3.1.0" - resolved "https://registry.yarnpkg.com/lodash._baseindexof/-/lodash._baseindexof-3.1.0.tgz#fe52b53a1c6761e42618d654e4a25789ed61822c" - integrity sha1-/lK1OhxnYeQmGNZU5KJXie1hgiw= - lodash._baseuniq@~4.6.0: version "4.6.0" resolved "https://registry.yarnpkg.com/lodash._baseuniq/-/lodash._baseuniq-4.6.0.tgz#0ebb44e456814af7905c6212fa2c9b2d51b841e8" @@ -9614,33 +9609,11 @@ lodash._baseuniq@~4.6.0: lodash._createset "~4.0.0" lodash._root "~3.0.0" -lodash._bindcallback@*: - version "3.0.1" - resolved "https://registry.yarnpkg.com/lodash._bindcallback/-/lodash._bindcallback-3.0.1.tgz#e531c27644cf8b57a99e17ed95b35c748789392e" - integrity sha1-5THCdkTPi1epnhftlbNcdIeJOS4= - -lodash._cacheindexof@*: - version "3.0.2" - resolved "https://registry.yarnpkg.com/lodash._cacheindexof/-/lodash._cacheindexof-3.0.2.tgz#3dc69ac82498d2ee5e3ce56091bafd2adc7bde92" - integrity sha1-PcaayCSY0u5ePOVgkbr9Ktx73pI= - -lodash._createcache@*: - version "3.1.2" - resolved "https://registry.yarnpkg.com/lodash._createcache/-/lodash._createcache-3.1.2.tgz#56d6a064017625e79ebca6b8018e17440bdcf093" - integrity sha1-VtagZAF2JeeevKa4AY4XRAvc8JM= - dependencies: - lodash._getnative "^3.0.0" - lodash._createset@~4.0.0: version "4.0.3" resolved "https://registry.yarnpkg.com/lodash._createset/-/lodash._createset-4.0.3.tgz#0f4659fbb09d75194fa9e2b88a6644d363c9fe26" integrity sha1-D0ZZ+7CddRlPqeK4imZE02PJ/iY= -lodash._getnative@*, lodash._getnative@^3.0.0: - version "3.9.1" - resolved "https://registry.yarnpkg.com/lodash._getnative/-/lodash._getnative-3.9.1.tgz#570bc7dede46d61cdcde687d65d3eecbaa3aaff5" - integrity sha1-VwvH3t5G1hzc3mh9ZdPuy6o6r/U= - lodash._root@~3.0.0: version "3.0.1" resolved "https://registry.yarnpkg.com/lodash._root/-/lodash._root-3.0.1.tgz#fba1c4524c19ee9a5f8136b4609f017cf4ded692" @@ -9706,11 +9679,6 @@ lodash.memoize@^4.1.2: resolved "https://registry.yarnpkg.com/lodash.memoize/-/lodash.memoize-4.1.2.tgz#bcc6c49a42a2840ed997f323eada5ecd182e0bfe" integrity sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4= -lodash.restparam@*: - version "3.6.1" - resolved "https://registry.yarnpkg.com/lodash.restparam/-/lodash.restparam-3.6.1.tgz#936a4e309ef330a7645ed4145986c85ae5b20805" - integrity sha1-k2pOMJ7zMKdkXtQUWYbIWuWyCAU= - lodash.sortby@^4.7.0: version "4.7.0" resolved "https://registry.yarnpkg.com/lodash.sortby/-/lodash.sortby-4.7.0.tgz#edd14c824e2cc9c1e0b0a1b42bb5210516a42438" @@ -10370,15 +10338,6 @@ nearley@^2.7.10: randexp "0.4.6" semver "^5.4.1" -needle@^2.2.1: - version "2.4.1" - resolved "https://registry.yarnpkg.com/needle/-/needle-2.4.1.tgz#14af48732463d7475696f937626b1b993247a56a" - integrity sha512-x/gi6ijr4B7fwl6WYL9FwlCvRQKGlUNvnceho8wxkwXqN8jvVmmmATTmZPRRG7b/yC1eode26C2HO9jl78Du9g== - dependencies: - debug "^3.2.6" - iconv-lite "^0.4.4" - sax "^1.2.4" - negotiator@0.6.2: version "0.6.2" resolved "https://registry.yarnpkg.com/negotiator/-/negotiator-0.6.2.tgz#feacf7ccf525a77ae9634436a64883ffeca346fb" @@ -10521,22 +10480,6 @@ node-notifier@^6.0.0: shellwords "^0.1.1" which "^1.3.1" -node-pre-gyp@*: - version "0.14.0" - resolved "https://registry.yarnpkg.com/node-pre-gyp/-/node-pre-gyp-0.14.0.tgz#9a0596533b877289bcad4e143982ca3d904ddc83" - integrity sha512-+CvDC7ZttU/sSt9rFjix/P05iS43qHCOOGzcr3Ry99bXG7VX953+vFyEuph/tfqoYu8dttBkE86JSKBO2OzcxA== - dependencies: - detect-libc "^1.0.2" - mkdirp "^0.5.1" - needle "^2.2.1" - nopt "^4.0.1" - npm-packlist "^1.1.6" - npmlog "^4.0.2" - rc "^1.2.7" - rimraf "^2.6.1" - semver "^5.3.0" - tar "^4.4.2" - node-releases@^1.1.29, node-releases@^1.1.53: version "1.1.53" resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-1.1.53.tgz#2d821bfa499ed7c5dffc5e2f28c88e78a08ee3f4" @@ -10663,7 +10606,7 @@ npm-normalize-package-bin@^1.0.0, npm-normalize-package-bin@^1.0.1: semver "^5.6.0" validate-npm-package-name "^3.0.0" -npm-packlist@^1.1.12, npm-packlist@^1.1.6, npm-packlist@^1.4.8: +npm-packlist@^1.1.12, npm-packlist@^1.4.8: version "1.4.8" resolved "https://registry.yarnpkg.com/npm-packlist/-/npm-packlist-1.4.8.tgz#56ee6cc135b9f98ad3d51c1c95da22bbb9b2ef3e" integrity sha512-5+AZgwru5IevF5ZdnFglB5wNlHG1AOOuw28WhUq8/8emhBmLv6jX5by4WJCh7lW0uSYZYS6DXqIsyZVIXRZU9A== @@ -10843,7 +10786,7 @@ npm@^6.10.3: worker-farm "^1.7.0" write-file-atomic "^2.4.3" -npmlog@^4.0.1, npmlog@^4.0.2, npmlog@^4.1.2, npmlog@~4.1.2: +npmlog@^4.0.1, npmlog@^4.1.2, npmlog@~4.1.2: version "4.1.2" resolved "https://registry.yarnpkg.com/npmlog/-/npmlog-4.1.2.tgz#08a7f2a8bf734604779a9efa4ad5cc717abb954b" integrity sha512-2uUqazuKlTaSI/dC8AzicUck7+IrEaOnN/e0jd3Xtt1KcGpwx30v50mL7oPyr/h9bL3E4aZccVwpwP+5W9Vjkg== @@ -13154,7 +13097,7 @@ rimraf@2.6.3: dependencies: glob "^7.1.3" -rimraf@^2.2.8, rimraf@^2.5.2, rimraf@^2.5.4, rimraf@^2.6.1, rimraf@^2.6.2, rimraf@^2.6.3, rimraf@^2.7.1: +rimraf@^2.2.8, rimraf@^2.5.2, rimraf@^2.5.4, rimraf@^2.6.2, rimraf@^2.6.3, rimraf@^2.7.1: version "2.7.1" resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-2.7.1.tgz#35797f13a7fdadc566142c29d4f07ccad483e3ec" integrity sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w== @@ -13346,7 +13289,7 @@ sass-loader@^8.0.0: schema-utils "^2.6.1" semver "^6.3.0" -sax@>=0.6.0, sax@^1.2.4, sax@~1.2.4: +sax@>=0.6.0, sax@~1.2.4: version "1.2.4" resolved "https://registry.yarnpkg.com/sax/-/sax-1.2.4.tgz#2816234e2378bddc4e5354fab5caa895df7100d9" integrity sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw== @@ -13455,7 +13398,7 @@ semver-regex@^2.0.0: resolved "https://registry.yarnpkg.com/semver-regex/-/semver-regex-2.0.0.tgz#a93c2c5844539a770233379107b38c7b4ac9d338" integrity sha512-mUdIBBvdn0PLOeP3TEkMH7HHeUP3GjsXCwKarjv/kGmUFOYg1VqEemKhoQpWMu6X2I8kHeuVdGibLGkVK+/5Qw== -"semver@2 || 3 || 4 || 5", "semver@2.x || 3.x || 4 || 5", "semver@^2.3.0 || 3.x || 4 || 5", semver@^5.0.0, semver@^5.0.3, semver@^5.1.0, semver@^5.3.0, semver@^5.4.1, semver@^5.5.0, semver@^5.5.1, semver@^5.6.0, semver@^5.7.0, semver@^5.7.1: +"semver@2 || 3 || 4 || 5", "semver@2.x || 3.x || 4 || 5", "semver@^2.3.0 || 3.x || 4 || 5", semver@^5.0.0, semver@^5.0.3, semver@^5.1.0, semver@^5.4.1, semver@^5.5.0, semver@^5.5.1, semver@^5.6.0, semver@^5.7.0, semver@^5.7.1: version "5.7.1" resolved "https://registry.yarnpkg.com/semver/-/semver-5.7.1.tgz#a954f931aeba508d307bbf069eff0c01c96116f7" integrity sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ== @@ -14436,7 +14379,7 @@ tar-stream@^2.0.0: inherits "^2.0.3" readable-stream "^3.1.1" -tar@^4.4.10, tar@^4.4.12, tar@^4.4.13, tar@^4.4.2, tar@^4.4.8: +tar@^4.4.10, tar@^4.4.12, tar@^4.4.13, tar@^4.4.8: version "4.4.13" resolved "https://registry.yarnpkg.com/tar/-/tar-4.4.13.tgz#43b364bc52888d555298637b10d60790254ab525" integrity sha512-w2VwSrBoHa5BsSyH+KxEqeQBAllHhccyMFVHtGtdMpF4W7IRWfZjFiQceJPChOeTsSDVUpER2T8FA93pr0L+QA== From 80b663eebfc620bd9cf49f79865cb29235e4c07b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Matija=20Marohni=C4=87?= Date: Tue, 5 May 2020 21:13:59 +0200 Subject: [PATCH 04/11] Add scroll margin to account for fixed header --- www/src/css/bootstrap.scss | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/www/src/css/bootstrap.scss b/www/src/css/bootstrap.scss index 024aae15..564c077b 100644 --- a/www/src/css/bootstrap.scss +++ b/www/src/css/bootstrap.scss @@ -37,3 +37,9 @@ h1, h2, h3, h4, h5 { color: inherit; } } + +// https://twitter.com/hakimel/status/1257252729128435712?s=20 +// https://twitter.com/bramus/status/1257255545897132032?s=20 +:target { + scroll-margin-top: 4rem; +} From c8631587f9e1d18f5161f5490e6f5c225f06c6ae Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Matija=20Marohni=C4=87?= Date: Tue, 5 May 2020 21:58:19 +0200 Subject: [PATCH 05/11] Expand notes for v4.4.0 and add missing fix --- CHANGELOG.md | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 082a9ad4..6e7c8b07 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -4,6 +4,24 @@ ### Features * add `nodeRef` alternative instead of internal `findDOMNode` ([#559](https://github.com/reactjs/react-transition-group/issues/559)) ([85016bf](https://github.com/reactjs/react-transition-group/commit/85016bfddd3831e6d7bb27926f9f178d25502913)) + - react-transition-group internally uses `findDOMNode`, which is deprecated and produces warnings in [Strict Mode](https://reactjs.org/docs/strict-mode.html), so now you can optionally pass `nodeRef` to `Transition` and `CSSTransition`, it's a ref object that should point to the transitioning child: + + ```jsx + import React from "react" + import { CSSTransition } from "react-transition-group" + + const MyComponent = () => { + const nodeRef = React.useRef(null) + return ( + +
Fade
+ + ) + } + ``` +### Bug Fixes + +* set the values of constants attached to `Transition` to match the exported ones ([#554](https://github.com/reactjs/react-transition-group/pull/554)) # [4.3.0](https://github.com/reactjs/react-transition-group/compare/v4.2.2...v4.3.0) (2019-09-05) From fbbcc1d22bf7787025cfd4add50901dc37644d83 Mon Sep 17 00:00:00 2001 From: Andrew Luca Date: Tue, 5 May 2020 23:53:31 +0300 Subject: [PATCH 06/11] test: enable `React.StrictMode` (#593) https://reactjs.org/docs/strict-mode.html Introduced in `react@16.3` which is minimal version that is supported https://reactjs.org/blog/2018/03/29/react-v-16-3.html --- test/CSSTransitionGroup-test.js | 45 +++++++++++++++++++-------------- test/TransitionGroup-test.js | 16 ++++++++---- 2 files changed, 37 insertions(+), 24 deletions(-) diff --git a/test/CSSTransitionGroup-test.js b/test/CSSTransitionGroup-test.js index 2776a8e0..371981d9 100644 --- a/test/CSSTransitionGroup-test.js +++ b/test/CSSTransitionGroup-test.js @@ -10,6 +10,7 @@ let TransitionGroup; describe('CSSTransitionGroup', () => { let container; let consoleErrorSpy; + let render; function YoloTransition({ id, ...props }) { const nodeRef = React.useRef() @@ -27,6 +28,12 @@ describe('CSSTransitionGroup', () => { React = require('react'); ReactDOM = require('react-dom'); + render = (element, container, callback) => ReactDOM.render( + {element}, + container, + callback + ) + TransitionGroup = require('../src/TransitionGroup'); container = document.createElement('div'); @@ -39,7 +46,7 @@ describe('CSSTransitionGroup', () => { it('should clean-up silently after the timeout elapses', () => { - ReactDOM.render( + render( , @@ -50,7 +57,7 @@ describe('CSSTransitionGroup', () => { expect(transitionGroupDiv.childNodes.length).toBe(1); - ReactDOM.render( + render( , @@ -72,7 +79,7 @@ describe('CSSTransitionGroup', () => { }); it('should keep both sets of DOM nodes around', () => { - ReactDOM.render( + render( , @@ -83,7 +90,7 @@ describe('CSSTransitionGroup', () => { expect(transitionGroupDiv.childNodes.length).toBe(1); - ReactDOM.render( + render( , @@ -96,7 +103,7 @@ describe('CSSTransitionGroup', () => { }); it('should switch transitionLeave from false to true', () => { - ReactDOM.render( + render( , @@ -107,7 +114,7 @@ describe('CSSTransitionGroup', () => { expect(transitionGroupDiv.childNodes.length).toBe(1); - ReactDOM.render( + render( , @@ -118,7 +125,7 @@ describe('CSSTransitionGroup', () => { expect(transitionGroupDiv.childNodes.length).toBe(1); - ReactDOM.render( + render( , @@ -132,7 +139,7 @@ describe('CSSTransitionGroup', () => { it('should work with a null child', () => { - ReactDOM.render( + render( {[null]} , @@ -144,11 +151,11 @@ describe('CSSTransitionGroup', () => { const NullComponent = () => null; // Testing the whole lifecycle of entering and exiting, // because those lifecycle methods used to fail when the DOM node was null. - ReactDOM.render( + render( , container, ); - ReactDOM.render( + render( @@ -156,14 +163,14 @@ describe('CSSTransitionGroup', () => { , container, ); - ReactDOM.render( + render( , container, ); }); it('should transition from one to null', () => { - ReactDOM.render( + render( , @@ -174,7 +181,7 @@ describe('CSSTransitionGroup', () => { expect(transitionGroupDiv.childNodes.length).toBe(1); - ReactDOM.render( + render( {null} , @@ -188,7 +195,7 @@ describe('CSSTransitionGroup', () => { }); it('should transition from false to one', () => { - ReactDOM.render( + render( {false} , @@ -199,7 +206,7 @@ describe('CSSTransitionGroup', () => { expect(transitionGroupDiv.childNodes.length).toBe(0); - ReactDOM.render( + render( , @@ -221,8 +228,8 @@ describe('CSSTransitionGroup', () => { } } - ReactDOM.render(, container); - ReactDOM.render( + render(, container); + render( , @@ -259,7 +266,7 @@ describe('CSSTransitionGroup', () => { } } - ReactDOM.render(, container); + render(, container); // Testing that no exception is thrown here, as the timeout has been cleared. jest.runAllTimers(); @@ -298,7 +305,7 @@ describe('CSSTransitionGroup', () => { } } - ReactDOM.render(, container); + render(, container); const transitionGroupDiv = container.childNodes[0] transitionGroupDiv.childNodes.forEach(child => { expect(hasClass(child, extraClassNameProp)).toBe(true); diff --git a/test/TransitionGroup-test.js b/test/TransitionGroup-test.js index f921ae40..8920e8c2 100644 --- a/test/TransitionGroup-test.js +++ b/test/TransitionGroup-test.js @@ -8,7 +8,7 @@ let Transition // Most of the real functionality is covered in other unit tests, this just // makes sure we're wired up correctly. describe('TransitionGroup', () => { - let container, log, Child + let container, log, Child, render; beforeEach(() => { React = require('react') @@ -16,6 +16,12 @@ describe('TransitionGroup', () => { Transition = require('../src/Transition').default TransitionGroup = require('../src/TransitionGroup') + render = (element, container, callback) => ReactDOM.render( + {element}, + container, + callback + ) + container = document.createElement('div') log = [] @@ -70,7 +76,7 @@ describe('TransitionGroup', () => { }) it('should work with no children', () => { - ReactDOM.render(, container) + render(, container) }) it('should handle transitioning correctly', () => { @@ -85,18 +91,18 @@ describe('TransitionGroup', () => { } jest.useFakeTimers() - ReactDOM.render(, container) + render(, container) jest.runAllTimers() expect(log).toEqual(['appear', 'appearing', 'appeared']) log = [] - ReactDOM.render(, container) + render(, container) jest.runAllTimers() expect(log).toEqual(['enter', 'entering', 'entered']) log = [] - ReactDOM.render(, container) + render(, container) jest.runAllTimers() expect(log).toEqual(['exit', 'exiting', 'exited']) }) From ce9412841cc0f3c6e0bbb8953917e3a63d7bdea2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Matija=20Marohni=C4=87?= Date: Wed, 6 May 2020 01:13:36 +0200 Subject: [PATCH 07/11] chore: Fix ESLint errors in www on CI (#620) --- .travis.yml | 2 ++ 1 file changed, 2 insertions(+) diff --git a/.travis.yml b/.travis.yml index b101baa1..878675d0 100644 --- a/.travis.yml +++ b/.travis.yml @@ -3,6 +3,8 @@ language: node_js node_js: - "11.10" cache: yarn +install: + - yarn install --cwd www script: - yarn test From 6ab44733ec64422184c2ebc967a3f107158bfa48 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Matija=20Marohni=C4=87?= Date: Wed, 6 May 2020 10:01:29 +0200 Subject: [PATCH 08/11] chore: install dependencies in both dirs on CI https://github.com/reactjs/react-transition-group/pull/620#discussion_r420473368 --- .travis.yml | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/.travis.yml b/.travis.yml index 878675d0..284b2b9e 100644 --- a/.travis.yml +++ b/.travis.yml @@ -4,7 +4,8 @@ node_js: - "11.10" cache: yarn install: - - yarn install --cwd www + - yarn + - yarn --cwd www script: - yarn test From 46bdb6e94889d67e3fe179debb6b7803095235e6 Mon Sep 17 00:00:00 2001 From: Andrew Luca Date: Wed, 6 May 2020 17:26:44 +0300 Subject: [PATCH 09/11] refactor(Transition): simplify render function (#621) --- src/Transition.js | 52 ++++++++++++++++++++++------------------------- 1 file changed, 24 insertions(+), 28 deletions(-) diff --git a/src/Transition.js b/src/Transition.js index 116852e3..b4964bd9 100644 --- a/src/Transition.js +++ b/src/Transition.js @@ -341,42 +341,38 @@ class Transition extends React.Component { render() { const status = this.state.status + if (status === UNMOUNTED) { return null } - const { children, ...childProps } = this.props - // filter props for Transtition - delete childProps.in - delete childProps.mountOnEnter - delete childProps.unmountOnExit - delete childProps.appear - delete childProps.enter - delete childProps.exit - delete childProps.timeout - delete childProps.addEndListener - delete childProps.onEnter - delete childProps.onEntering - delete childProps.onEntered - delete childProps.onExit - delete childProps.onExiting - delete childProps.onExited - delete childProps.nodeRef - - if (typeof children === 'function') { - // allows for nested Transitions - return ( - - {children(status, childProps)} - - ) - } + const { + children, + // filter props for `Transition` + in: _in, + mountOnEnter: _mountOnEnter, + unmountOnExit: _unmountOnExit, + appear: _appear, + enter: _enter, + exit: _exit, + timeout: _timeout, + addEndListener: _addEndListener, + onEnter: _onEnter, + onEntering: _onEntering, + onEntered: _onEntered, + onExit: _onExit, + onExiting: _onExiting, + onExited: _onExited, + nodeRef: _nodeRef, + ...childProps + } = this.props - const child = React.Children.only(children) return ( // allows for nested Transitions - {React.cloneElement(child, childProps)} + {typeof children === 'function' + ? children(status, childProps) + : React.cloneElement(React.Children.only(children), childProps)} ) } From 2722bb6b755943b8292f0f2bc2fdca55df5c28f0 Mon Sep 17 00:00:00 2001 From: Julian Grinblat Date: Wed, 6 May 2020 23:48:17 +0900 Subject: [PATCH 10/11] fix: transition SSR (#619) * Support SSR * Update src/Transition.js * rm whitespace Co-authored-by: Jason Quense --- src/Transition.js | 6 +++++- test/SSR-test.js | 10 ++++++++++ 2 files changed, 15 insertions(+), 1 deletion(-) create mode 100644 test/SSR-test.js diff --git a/src/Transition.js b/src/Transition.js index b4964bd9..981acc26 100644 --- a/src/Transition.js +++ b/src/Transition.js @@ -390,7 +390,11 @@ Transition.propTypes = { * (see * [test/CSSTransition-test.js](https://github.com/reactjs/react-transition-group/blob/13435f897b3ab71f6e19d724f145596f5910581c/test/CSSTransition-test.js#L362-L437)). */ - nodeRef: PropTypes.shape({ current: PropTypes.instanceOf(Element) }), + nodeRef: PropTypes.shape({ + current: typeof Element === 'undefined' + ? PropTypes.any + : PropTypes.instanceOf(Element) + }), /** * A `function` child can be used instead of a React element. This function is diff --git a/test/SSR-test.js b/test/SSR-test.js new file mode 100644 index 00000000..629acacd --- /dev/null +++ b/test/SSR-test.js @@ -0,0 +1,10 @@ +/** + * @jest-environment node + */ + +// test that import does not crash +import * as ReactTransitionGroup from '../src'; // eslint-disable-line no-unused-vars + +describe('SSR', () => { + it('should import react-transition-group in node env', () => {}); +}); From 1fd4a65ac45edd2aea3dec18eeb8b9c07c7eb93f Mon Sep 17 00:00:00 2001 From: semantic-release-bot Date: Wed, 6 May 2020 14:50:34 +0000 Subject: [PATCH 11/11] chore(release): 4.4.1 [skip ci] ## [4.4.1](https://github.com/reactjs/react-transition-group/compare/v4.4.0...v4.4.1) (2020-05-06) ### Bug Fixes * transition SSR ([#619](https://github.com/reactjs/react-transition-group/issues/619)) ([2722bb6](https://github.com/reactjs/react-transition-group/commit/2722bb6b755943b8292f0f2bc2fdca55df5c28f0)) --- CHANGELOG.md | 7 +++++++ package.json | 2 +- 2 files changed, 8 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 6e7c8b07..2719d38f 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,10 @@ +## [4.4.1](https://github.com/reactjs/react-transition-group/compare/v4.4.0...v4.4.1) (2020-05-06) + + +### Bug Fixes + +* transition SSR ([#619](https://github.com/reactjs/react-transition-group/issues/619)) ([2722bb6](https://github.com/reactjs/react-transition-group/commit/2722bb6b755943b8292f0f2bc2fdca55df5c28f0)) + # [4.4.0](https://github.com/reactjs/react-transition-group/compare/v4.3.0...v4.4.0) (2020-05-05) diff --git a/package.json b/package.json index 11841a5b..eabf11b7 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-transition-group", - "version": "4.4.0", + "version": "4.4.1", "description": "A react component toolset for managing animations", "main": "lib/cjs/index.js", "module": "lib/esm/index.js",