-
Notifications
You must be signed in to change notification settings - Fork 47.2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[FIX] - ReactDOM Add back version property to client #15780
[FIX] - ReactDOM Add back version property to client #15780
Conversation
No significant bundle size changes to report. Generated by 🚫 dangerJS |
Ping: |
Any updates on this? |
Is this going to be added? |
0d010e4
to
a4f9d91
Compare
This pull request is automatically built and testable in CodeSandbox. To see build info of the built libraries, click here or the icon next to each commit SHA. Latest deployment of this branch, based on commit a4f9d91:
|
Why is this necessary? Just do |
@milesj, First, this is the browser interface, in the browser I don't have direct access to package.json. You can expose it, of course, but when debugging production applications this is not something you want to do. Second, as I noted in the description of this pr All other interfaces (react, react-dom/server) still have it, and this is the only one where it doesn't exist. @typed also assumes it is there. All these lead me to believe that the version key got deleted by mistake when moving from react 15 to 16. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I'm not sure if the decision to remove it was intentional or not.
React DOM reports its version to DevTools (which necessarily needs some forking, since it supports many versions) but I think we might be cautious about having application code check this number. Usually it's better to feature detect specific APIs instead.
I'm a little reluctant to add it back because I'm not sure how you're wanting to use it 😄 Tell me more?
cc @gaearon and @sebmarkbage
TBH I had no idea you could detect ReactDOM's version from devtools. When I created the PR we were debugging a production site with multiple versions of React present on the same page - some with legacy React15 code and some with React16. We experienced a React/ReactDOM version mismatch which resulted in hooks errors. When trying to debug it on the server both react and react-dom exposed their version, but in the client only react did so we couldn't really tell which version of React our code was using. The errors were not present in development. Working on this issue I assumed it got deleted by mistake since all other APIs still maintained the version property. If that's something that we don't plan on adding back then maybe I should create an opposite PR to fix |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Seems legit to bring the client into parity with the others. I ran this change by the team and there were no objections.
Note that the version reported for experimental releases will be a little different, e.g. NPM version 0.0.0-experimental-241c4467e
will be reported as "16.12.0-experimental-241c4467e"
.
Out in 16.13 |
![snyk-top-banner](https://redirect.github.com/andygongea/OWASP-Benchmark/assets/818805/c518c423-16fe-447e-b67f-ad5a49b5d123) <h3>Snyk has created this PR to upgrade react-dom from 16.8.4 to 16.14.0.</h3> :information_source: Keep your dependencies up-to-date. This makes it easier to fix existing vulnerabilities and to more quickly identify and fix newly disclosed vulnerabilities when they affect your project. <hr/> - The recommended version is **13 versions** ahead of your current version. - The recommended version was released on **4 years ago**. <details> <summary><b>Release notes</b></summary> <br/> <details> <summary>Package name: <b>react-dom</b></summary> <ul> <li> <b>16.14.0</b> - <a href="https://redirect.github.com/facebook/react/releases/tag/v16.14.0">2020-10-14</a></br><h3>React</h3> <ul> <li>Add support for the <a href="https://reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html" rel="nofollow">new JSX transform</a>. (<a href="https://redirect.github.com/lunaruan">@ lunaruan</a> in <a href="https://redirect.github.com/facebook/react/pull/18299" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18299/hovercard">#18299</a>)</li> </ul> </li> <li> <b>16.13.1</b> - <a href="https://redirect.github.com/facebook/react/releases/tag/v16.13.1">2020-03-19</a></br><h3>React DOM</h3> <ul> <li>Fix bug in legacy mode Suspense where effect clean-up functions are not fired. This only affects users who use Suspense for data fetching in legacy mode, which is not technically supported. (<a href="https://redirect.github.com/acdlite">@ acdlite</a> in <a href="https://redirect.github.com/facebook/react/pull/18238" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18238/hovercard">#18238</a>)</li> <li>Revert warning for cross-component updates that happen inside class render lifecycles (<code>componentWillReceiveProps</code>, <code>shouldComponentUpdate</code>, and so on). (<a href="https://redirect.github.com/gaearon">@ gaearon</a> in <a href="https://redirect.github.com/facebook/react/pull/18330" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18330/hovercard">#18330</a>)</li> </ul> <h2>Artifacts</h2> <ul> <li>react: <a href="https://unpkg.com/[email protected]/umd/" rel="nofollow">https://unpkg.com/[email protected]/umd/</a></li> <li>react-art: <a href="https://unpkg.com/[email protected]/umd/" rel="nofollow">https://unpkg.com/[email protected]/umd/</a></li> <li>react-dom: <a href="https://unpkg.com/[email protected]/umd/" rel="nofollow">https://unpkg.com/[email protected]/umd/</a></li> <li>react-is: <a href="https://unpkg.com/[email protected]/umd/" rel="nofollow">https://unpkg.com/[email protected]/umd/</a></li> <li>react-test-renderer: <a href="https://unpkg.com/[email protected]/umd/" rel="nofollow">https://unpkg.com/[email protected]/umd/</a></li> <li>scheduler: <a href="https://unpkg.com/[email protected]/umd/" rel="nofollow">https://unpkg.com/[email protected]/umd/</a></li> </ul> </li> <li> <b>16.13.0</b> - <a href="https://redirect.github.com/facebook/react/releases/tag/v16.13.0">2020-02-26</a></br><h3>React</h3> <ul> <li>Warn when a string ref is used in a manner that's not amenable to a future codemod (<a href="https://redirect.github.com/lunaruan">@ lunaruan</a> in <a href="https://redirect.github.com/facebook/react/pull/17864" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/17864/hovercard">#17864</a>)</li> <li>Deprecate <code>React.createFactory()</code> (<a href="https://redirect.github.com/trueadm">@ trueadm</a> in <a href="https://redirect.github.com/facebook/react/pull/17878" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/17878/hovercard">#17878</a>)</li> </ul> <h3>React DOM</h3> <ul> <li>Warn when changes in <code>style</code> may cause an unexpected collision (<a href="https://redirect.github.com/sophiebits">@ sophiebits</a> in <a href="https://redirect.github.com/facebook/react/pull/14181" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/14181/hovercard">#14181</a>, <a href="https://redirect.github.com/facebook/react/pull/18002" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18002/hovercard">#18002</a>)</li> <li>Warn when a function component is updated during another component's render phase (<a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/acdlite/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://redirect.github.com/acdlite">@ acdlite</a> in <a href="https://redirect.github.com/facebook/react/pull/17099" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/17099/hovercard">#17099</a>)</li> <li>Deprecate <code>unstable_createPortal</code> (<a href="https://redirect.github.com/trueadm">@ trueadm</a> in <a href="https://redirect.github.com/facebook/react/pull/17880" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/17880/hovercard">#17880</a>)</li> <li>Fix <code>onMouseEnter</code> being fired on disabled buttons (<a href="https://redirect.github.com/AlfredoGJ">@ AlfredoGJ</a> in <a href="https://redirect.github.com/facebook/react/pull/17675" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/17675/hovercard">#17675</a>)</li> <li>Call <code>shouldComponentUpdate</code> twice when developing in <code>StrictMode</code> (<a href="https://redirect.github.com/bvaughn">@ bvaughn</a> in <a href="https://redirect.github.com/facebook/react/pull/17942" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/17942/hovercard">#17942</a>)</li> <li>Add <code>version</code> property to ReactDOM (<a href="https://redirect.github.com/ealush">@ ealush</a> in <a href="https://redirect.github.com/facebook/react/pull/15780" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/15780/hovercard">#15780</a>)</li> <li>Don't call <code>toString()</code> of <code>dangerouslySetInnerHTML</code> (<a href="https://redirect.github.com/sebmarkbage">@ sebmarkbage</a> in <a href="https://redirect.github.com/facebook/react/pull/17773" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/17773/hovercard">#17773</a>)</li> <li>Show component stacks in more warnings (<a href="https://redirect.github.com/gaearon">@ gaearon</a> in <a href="https://redirect.github.com/facebook/react/pull/17922" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/17922/hovercard">#17922</a>, <a href="https://redirect.github.com/facebook/react/pull/17586" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/17586/hovercard">#17586</a>)</li> </ul> <h3>Concurrent Mode (Experimental)</h3> <ul> <li>Warn for problematic usages of <code>ReactDOM.createRoot()</code> (<a href="https://redirect.github.com/trueadm">@ trueadm</a> in <a href="https://redirect.github.com/facebook/react/pull/17937" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/17937/hovercard">#17937</a>)</li> <li>Remove <code>ReactDOM.createRoot()</code> callback params and added warnings on usage (<a href="https://redirect.github.com/bvaughn">@ bvaughn</a> in <a href="https://redirect.github.com/facebook/react/pull/17916" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/17916/hovercard">#17916</a>)</li> <li>Don't group Idle/Offscreen work with other work (<a href="https://redirect.github.com/sebmarkbage">@ sebmarkbage</a> in <a href="https://redirect.github.com/facebook/react/pull/17456" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/17456/hovercard">#17456</a>)</li> <li>Adjust <code>SuspenseList</code> CPU bound heuristic (<a href="https://redirect.github.com/sebmarkbage">@ sebmarkbage</a> in <a href="https://redirect.github.com/facebook/react/pull/17455" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/17455/hovercard">#17455</a>)</li> <li>Add missing event plugin priorities (<a href="https://redirect.github.com/trueadm">@ trueadm</a> in <a href="https://redirect.github.com/facebook/react/pull/17914" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/17914/hovercard">#17914</a>)</li> <li>Fix <code>isPending</code> only being true when transitioning from inside an input event (<a href="https://redirect.github.com/acdlite">@ acdlite</a> in <a href="https://redirect.github.com/facebook/react/pull/17382" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/17382/hovercard">#17382</a>)</li> <li>Fix <code>React.memo</code> components dropping updates when interrupted by a higher priority update (<a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/acdlite/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://redirect.github.com/acdlite">@ acdlite</a> in <a href="https://redirect.github.com/facebook/react/pull/18091" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/18091/hovercard">#18091</a>)</li> <li>Don't warn when suspending at the wrong priority (<a href="https://redirect.github.com/gaearon">@ gaearon</a> in <a href="https://redirect.github.com/facebook/react/pull/17971" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/17971/hovercard">#17971</a>)</li> <li>Fix a bug with rebasing updates (<a href="https://redirect.github.com/acdlite">@ acdlite</a> and <a href="https://redirect.github.com/sebmarkbage">@ sebmarkbage</a> in <a href="https://redirect.github.com/facebook/react/pull/17560" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/17560/hovercard">#17560</a>, <a href="https://redirect.github.com/facebook/react/pull/17510" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/17510/hovercard">#17510</a>, <a href="https://redirect.github.com/facebook/react/pull/17483" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/17483/hovercard">#17483</a>, <a href="https://redirect.github.com/facebook/react/pull/17480" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/17480/hovercard">#17480</a>)</li> </ul> <h2>Artifacts</h2> <ul> <li>react: <a href="https://unpkg.com/[email protected]/umd/" rel="nofollow">https://unpkg.com/[email protected]/umd/</a></li> <li>react-art: <a href="https://unpkg.com/[email protected]/umd/" rel="nofollow">https://unpkg.com/[email protected]/umd/</a></li> <li>react-dom: <a href="https://unpkg.com/[email protected]/umd/" rel="nofollow">https://unpkg.com/[email protected]/umd/</a></li> <li>react-is: <a href="https://unpkg.com/[email protected]/umd/" rel="nofollow">https://unpkg.com/[email protected]/umd/</a></li> <li>react-test-renderer: <a href="https://unpkg.com/[email protected]/umd/" rel="nofollow">https://unpkg.com/[email protected]/umd/</a></li> <li>scheduler: <a href="https://unpkg.com/[email protected]/umd/" rel="nofollow">https://unpkg.com/[email protected]/umd/</a></li> </ul> </li> <li> <b>16.12.0</b> - <a href="https://redirect.github.com/facebook/react/releases/tag/v16.12.0">2019-11-14</a></br><h3>React DOM</h3> <ul> <li>Fix passive effects (<code>useEffect</code>) not being fired in a multi-root app. (<a href="https://redirect.github.com/acdlite">@ acdlite</a> in <a href="https://redirect.github.com/facebook/react/pull/17347" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/17347/hovercard">#17347</a>)</li> </ul> <h3>React Is</h3> <ul> <li>Fix <code>lazy</code> and <code>memo</code> types considered elements instead of components (<a href="https://redirect.github.com/bvaughn">@ bvaughn</a> in <a href="https://redirect.github.com/facebook/react/pull/17278" data-hovercard-type="pull_request" data-hovercard-url="/facebook/react/pull/17278/hovercard">#17278</a>)</li> </ul> <h2>Artifacts</h2> <p>• react: <a href="https://unpkg.com/[email protected]/umd/" rel="nofollow">https://unpkg.com/[email protected]/umd/</a><br> • react-art: <a href="https://unpkg.com/[email protected]/umd/" rel="nofollow">https://unpkg.com/[email protected]/umd/</a><br> • react-dom: <a href="https://unpkg.com/[email protected]/umd/" rel="nofollow">https://unpkg.com/[email protected]/umd/</a><br> • react-is: <a href="https://unpkg.com/[email protected]/umd/" rel="nofollow">https://unpkg.com/[email protected]/umd/</a><br> • react-test-renderer: <a href="https://unpkg.com/[email protected]/umd/" rel="nofollow">https://unpkg.com/[email protected]/umd/</a><br> • scheduler: <a href="https://unpkg.com/[email protected]/umd/" rel="nofollow">https://unpkg.com/[email protected]/umd/</a></p> </li> <li> <b>16.11.0</b> - 2019-10-22 </li> <li> <b>16.10.2</b> - 2019-10-03 </li> <li> <b>16.10.1</b> - 2019-09-28 </li> <li> <b>16.10.0</b> - 2019-09-27 </li> <li> <b>16.9.0</b> - 2019-08-08 </li> <li> <b>16.9.0-rc.0</b> - 2019-08-05 </li> <li> <b>16.9.0-alpha.0</b> - 2019-04-03 </li> <li> <b>16.8.6</b> - 2019-03-28 </li> <li> <b>16.8.5</b> - 2019-03-22 </li> <li> <b>16.8.4</b> - 2019-03-05 </li> </ul> from <a href="https://redirect.github.com/facebook/react/releases">react-dom GitHub release notes</a> </details> </details> --- > [!IMPORTANT] > > - Check the changes in this PR to ensure they won't cause issues with your project. > - This PR was automatically created by Snyk using the credentials of a real user. --- **Note:** _You are seeing this because you or someone else with access to this repository has authorized Snyk to open upgrade PRs._ **For more information:** <img src="https://api.segment.io/v1/pixel/track?data=eyJ3cml0ZUtleSI6InJyWmxZcEdHY2RyTHZsb0lYd0dUcVg4WkFRTnNCOUEwIiwiYW5vbnltb3VzSWQiOiI4NTdmYmVkYy1hZTE3LTQ3ZGYtODhkYy03MTcyMWYxNThjZTkiLCJldmVudCI6IlBSIHZpZXdlZCIsInByb3BlcnRpZXMiOnsicHJJZCI6Ijg1N2ZiZWRjLWFlMTctNDdkZi04OGRjLTcxNzIxZjE1OGNlOSJ9fQ==" width="0" height="0"/> > - 🧐 [View latest project report](https://app.snyk.io/org/newkdr/project/12a8a5f5-3e19-438c-8280-eb8f4ee06d17?utm_source=github&utm_medium=referral&page=upgrade-pr) > - 📜 [Customise PR templates](https://docs.snyk.io/scan-using-snyk/pull-requests/snyk-fix-pull-or-merge-requests/customize-pr-templates) > - 🛠 [Adjust upgrade PR settings](https://app.snyk.io/org/newkdr/project/12a8a5f5-3e19-438c-8280-eb8f4ee06d17/settings/integration?utm_source=github&utm_medium=referral&page=upgrade-pr) > - 🔕 [Ignore this dependency or unsubscribe from future upgrade PRs](https://app.snyk.io/org/newkdr/project/12a8a5f5-3e19-438c-8280-eb8f4ee06d17/settings/integration?pkg=react-dom&utm_source=github&utm_medium=referral&page=upgrade-pr#auto-dep-upgrades) [//]: # 'snyk:metadata:{"customTemplate":{"variablesUsed":[],"fieldsUsed":[]},"dependencies":[{"name":"react-dom","from":"16.8.4","to":"16.14.0"}],"env":"prod","hasFixes":false,"isBreakingChange":false,"isMajorUpgrade":false,"issuesToFix":[],"prId":"857fbedc-ae17-47df-88dc-71721f158ce9","prPublicId":"857fbedc-ae17-47df-88dc-71721f158ce9","packageManager":"npm","priorityScoreList":[],"projectPublicId":"12a8a5f5-3e19-438c-8280-eb8f4ee06d17","projectUrl":"https://app.snyk.io/org/newkdr/project/12a8a5f5-3e19-438c-8280-eb8f4ee06d17?utm_source=github&utm_medium=referral&page=upgrade-pr","prType":"upgrade","templateFieldSources":{"branchName":"default","commitMessage":"default","description":"default","title":"default"},"templateVariants":[],"type":"auto","upgrade":[],"upgradeInfo":{"versionsDiff":13,"publishedDate":"2020-10-14T19:38:26.085Z"},"vulns":[]}'
Change details
Adding back
.version
property to ReactDOM. It used to exist in React15 and got deleted. It still exists in ReactDOM/server, and it appears to be typed in @typed/react-dom so I am assuming it got deleted by mistake.