Skip to content
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

DevTools: Fix inspecting components with multiple reads of the same Context in React 17 #28974

Merged
merged 2 commits into from
May 2, 2024

Conversation

eps1lon
Copy link
Collaborator

@eps1lon eps1lon commented May 2, 2024

Stack:

  1. Devtools: Streamline getting extension from branch #28975
  2. Devtools: Fix build-for-devtools #28976
  3. DevTools: Fix inspecting components with multiple reads of the same Context in React 17 #28974 <--- You're here

Summary

Closes #28960

In #28467, we started reading context values by advancing a cursor in the context dependency list. However, in React 17, multiple reads of the same context are only tracked as a single dependency so we don't know if we should advance or not. Keep in mind that the passed context should be ignored in later versions of React where the real context object may not be available (e.g. in useFormStatus).

So for React 17 and below we just completely fallback to the old approach of reading the current value from the context object. In those versions useFormStatus doesn't exist.

How did you test this change?

@facebook-github-bot facebook-github-bot added CLA Signed React Core Team Opened by a member of the React Core Team labels May 2, 2024
@react-sizebot
Copy link

react-sizebot commented May 2, 2024

Comparing: 14f71db...b4d571c

Critical size changes

Includes critical production bundles, as well as any change greater than 2%:

Name +/- Base Current +/- gzip Base gzip Current gzip
oss-stable/react-dom/cjs/react-dom.production.js = 6.66 kB 6.66 kB = 1.82 kB 1.82 kB
oss-stable/react-dom/cjs/react-dom-client.production.js = 492.61 kB 492.61 kB = 87.88 kB 87.88 kB
oss-experimental/react-dom/cjs/react-dom.production.js = 6.67 kB 6.67 kB = 1.83 kB 1.83 kB
oss-experimental/react-dom/cjs/react-dom-client.production.js = 498.86 kB 498.86 kB = 88.93 kB 88.93 kB
facebook-www/ReactDOM-prod.classic.js = 591.22 kB 591.22 kB = 103.96 kB 103.96 kB
facebook-www/ReactDOM-prod.modern.js = 567.44 kB 567.44 kB = 100.36 kB 100.36 kB
test_utils/ReactAllWarnings.js Deleted 64.26 kB 0.00 kB Deleted 16.02 kB 0.00 kB

Significant size changes

Includes any change greater than 0.2%:

Expand to show
Name +/- Base Current +/- gzip Base gzip Current gzip
oss-experimental/react-debug-tools/cjs/react-debug-tools.development.js +0.34% 36.41 kB 36.54 kB +0.72% 8.66 kB 8.72 kB
oss-stable-semver/react-debug-tools/cjs/react-debug-tools.development.js +0.34% 36.41 kB 36.54 kB +0.72% 8.66 kB 8.72 kB
oss-stable/react-debug-tools/cjs/react-debug-tools.development.js +0.34% 36.41 kB 36.54 kB +0.72% 8.66 kB 8.72 kB
test_utils/ReactAllWarnings.js Deleted 64.26 kB 0.00 kB Deleted 16.02 kB 0.00 kB

Generated by 🚫 dangerJS against b4d571c

@@ -833,6 +833,44 @@ describe('ReactHooksInspectionIntegration', () => {
`);
});

it('should inspect the value of the current provider in useContext reading the same context multiple times', async () => {
Copy link
Contributor

@hoxyq hoxyq May 2, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In order to run this test against React >=17, you should include // @reactVersion >= 17.0 pragma above the test definition

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Opted for 16.8 since that's when hooks got introduced.

@eps1lon eps1lon force-pushed the context-multi-read branch from fea799d to b4d571c Compare May 2, 2024 19:59
@eps1lon eps1lon merged commit f5f2799 into facebook:main May 2, 2024
38 checks passed
@eps1lon eps1lon deleted the context-multi-read branch May 2, 2024 20:08
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CLA Signed React Core Team Opened by a member of the React Core Team
Projects
None yet
4 participants