Always warn about legacy context within StrictMode tree (#13760)
Brian Vaughn committed
Oct 3, 2018 at 08:40 UTC
36c5d69caa3e9270b1b175b33cd8c53cc6c0e690
16 files changed
+101
-45
packages/react-reconciler/src/ReactFiberScheduler.js
+1
-5
@@ -49,7 +49,6 @@ import {
49
enableUserTimingAPI,
50
replayFailedUnitOfWorkWithInvokeGuardedCallback,
51
warnAboutDeprecatedLifecycles,
52
- warnAboutLegacyContextAPI,
52
enableSuspense,
53
} from 'shared/ReactFeatureFlags';
54
import getComponentName from 'shared/getComponentName';
@@ -479,14 +478,11 @@ function commitAllLifeCycles(
478
) {
479
if (__DEV__) {
480
ReactStrictModeWarnings.flushPendingUnsafeLifecycleWarnings();
481
+ ReactStrictModeWarnings.flushLegacyContextWarning();
482
483
if (warnAboutDeprecatedLifecycles) {
484
ReactStrictModeWarnings.flushPendingDeprecationWarnings();
485
}
486
-
487
- if (warnAboutLegacyContextAPI) {
488
- ReactStrictModeWarnings.flushLegacyContextWarning();
489
- }
486
}
487
while (nextEffect !== null) {
488
const effectTag = nextEffect.effectTag;
packages/react-reconciler/src/__tests__/ReactIncremental-test.internal.js
+71
-15
@@ -1936,7 +1936,11 @@ describe('ReactIncremental', () => {
1936
</div>
1937
</Intl>,
1938
);
1939
- ReactNoop.flush();
1939
+ expect(ReactNoop.flush).toWarnDev(
1940
+ 'Legacy context API has been detected within a strict-mode tree: \n\n' +
1941
+ 'Please update the following components: Intl, ShowBoth, ShowLocale',
1942
+ {withoutStack: true},
1943
+ );
1944
expect(ops).toEqual([
1945
'Intl {}',
1946
'ShowLocale {"locale":"fr"}',
@@ -1981,7 +1985,11 @@ describe('ReactIncremental', () => {
1985
<ShowBoth />
1986
</Intl>,
1987
);
1984
- ReactNoop.flush();
1988
+ expect(ReactNoop.flush).toWarnDev(
1989
+ 'Legacy context API has been detected within a strict-mode tree: \n\n' +
1990
+ 'Please update the following components: Router, ShowRoute',
1991
+ {withoutStack: true},
1992
+ );
1993
expect(ops).toEqual([
1994
'ShowLocale {"locale":"sv"}',
1995
'ShowBoth {"locale":"sv"}',
@@ -2021,7 +2029,11 @@ describe('ReactIncremental', () => {
2029
}
2030
2031
ReactNoop.render(<Recurse />);
2024
- ReactNoop.flush();
2032
+ expect(ReactNoop.flush).toWarnDev(
2033
+ 'Legacy context API has been detected within a strict-mode tree: \n\n' +
2034
+ 'Please update the following components: Recurse',
2035
+ {withoutStack: true},
2036
+ );
2037
expect(ops).toEqual([
2038
'Recurse {}',
2039
'Recurse {"n":2}',
@@ -2054,7 +2066,11 @@ describe('ReactIncremental', () => {
2066
};
2067
2068
ReactNoop.render(<Recurse />);
2057
- ReactNoop.flush();
2069
+ expect(ReactNoop.flush).toWarnDev(
2070
+ 'Legacy context API has been detected within a strict-mode tree: \n\n' +
2071
+ 'Please update the following components: Recurse',
2072
+ {withoutStack: true},
2073
+ );
2074
expect(ops).toEqual([
2075
'Recurse {}',
2076
'Recurse {"n":2}',
@@ -2112,7 +2128,11 @@ describe('ReactIncremental', () => {
2128
]);
2129
2130
ops.length = 0;
2115
- ReactNoop.flush();
2131
+ expect(ReactNoop.flush).toWarnDev(
2132
+ 'Legacy context API has been detected within a strict-mode tree: \n\n' +
2133
+ 'Please update the following components: Intl, ShowLocale',
2134
+ {withoutStack: true},
2135
+ );
2136
expect(ops).toEqual([
2137
'ShowLocale {"locale":"fr"}',
2138
'Intl {}',
@@ -2192,7 +2212,11 @@ describe('ReactIncremental', () => {
2212
</IndirectionFn>
2213
</Intl>,
2214
);
2195
- ReactNoop.flush();
2215
+ expect(ReactNoop.flush).toWarnDev(
2216
+ 'Legacy context API has been detected within a strict-mode tree: \n\n' +
2217
+ 'Please update the following components: Intl, ShowLocaleClass, ShowLocaleFn',
2218
+ {withoutStack: true},
2219
+ );
2220
expect(ops).toEqual([
2221
'Intl:read {}',
2222
'Intl:provide {"locale":"fr"}',
@@ -2280,7 +2304,11 @@ describe('ReactIncremental', () => {
2304
</IndirectionFn>
2305
</Stateful>,
2306
);
2283
- ReactNoop.flush();
2307
+ expect(ReactNoop.flush).toWarnDev(
2308
+ 'Legacy context API has been detected within a strict-mode tree: \n\n' +
2309
+ 'Please update the following components: Intl, ShowLocaleClass, ShowLocaleFn',
2310
+ {withoutStack: true},
2311
+ );
2312
expect(ops).toEqual([
2313
'Intl:read {}',
2314
'Intl:provide {"locale":"fr"}',
@@ -2345,7 +2373,11 @@ describe('ReactIncremental', () => {
2373
2374
// Init
2375
ReactNoop.render(<Root />);
2348
- ReactNoop.flush();
2376
+ expect(ReactNoop.flush).toWarnDev(
2377
+ 'Legacy context API has been detected within a strict-mode tree: \n\n' +
2378
+ 'Please update the following components: Child',
2379
+ {withoutStack: true},
2380
+ );
2381
2382
// Trigger an update in the middle of the tree
2383
instance.setState({});
@@ -2391,7 +2423,11 @@ describe('ReactIncremental', () => {
2423
2424
// Init
2425
ReactNoop.render(<Root />);
2394
- ReactNoop.flush();
2426
+ expect(ReactNoop.flush).toWarnDev(
2427
+ 'Legacy context API has been detected within a strict-mode tree: \n\n' +
2428
+ 'Please update the following components: ContextProvider',
2429
+ {withoutStack: true},
2430
+ );
2431
2432
// Trigger an update in the middle of the tree
2433
// This is necessary to reproduce the error as it curently exists.
@@ -2437,8 +2473,12 @@ describe('ReactIncremental', () => {
2473
2474
ReactNoop.render(<MyComponent />);
2475
expect(ReactNoop.flush).toWarnDev(
2440
- 'componentWillReceiveProps: Please update the following components ' +
2441
- 'to use static getDerivedStateFromProps instead: MyComponent',
2476
+ [
2477
+ 'componentWillReceiveProps: Please update the following components ' +
2478
+ 'to use static getDerivedStateFromProps instead: MyComponent',
2479
+ 'Legacy context API has been detected within a strict-mode tree: \n\n' +
2480
+ 'Please update the following components: MyComponent',
2481
+ ],
2482
{withoutStack: true},
2483
);
2484
@@ -2582,7 +2622,11 @@ describe('ReactIncremental', () => {
2622
</TopContextProvider>,
2623
);
2624
2585
- ReactNoop.flush();
2625
+ expect(ReactNoop.flush).toWarnDev(
2626
+ 'Legacy context API has been detected within a strict-mode tree: \n\n' +
2627
+ 'Please update the following components: Child, TopContextProvider',
2628
+ {withoutStack: true},
2629
+ );
2630
expect(rendered).toEqual(['count:0']);
2631
instance.updateCount();
2632
ReactNoop.flush();
@@ -2640,7 +2684,11 @@ describe('ReactIncremental', () => {
2684
</TopContextProvider>,
2685
);
2686
2643
- ReactNoop.flush();
2687
+ expect(ReactNoop.flush).toWarnDev(
2688
+ 'Legacy context API has been detected within a strict-mode tree: \n\n' +
2689
+ 'Please update the following components: Child, MiddleContextProvider, TopContextProvider',
2690
+ {withoutStack: true},
2691
+ );
2692
expect(rendered).toEqual(['count:0']);
2693
instance.updateCount();
2694
ReactNoop.flush();
@@ -2707,7 +2755,11 @@ describe('ReactIncremental', () => {
2755
</TopContextProvider>,
2756
);
2757
2710
- ReactNoop.flush();
2758
+ expect(ReactNoop.flush).toWarnDev(
2759
+ 'Legacy context API has been detected within a strict-mode tree: \n\n' +
2760
+ 'Please update the following components: Child, MiddleContextProvider, TopContextProvider',
2761
+ {withoutStack: true},
2762
+ );
2763
expect(rendered).toEqual(['count:0']);
2764
instance.updateCount();
2765
ReactNoop.flush();
@@ -2784,7 +2836,11 @@ describe('ReactIncremental', () => {
2836
</TopContextProvider>,
2837
);
2838
2787
- ReactNoop.flush();
2839
+ expect(ReactNoop.flush).toWarnDev(
2840
+ 'Legacy context API has been detected within a strict-mode tree: \n\n' +
2841
+ 'Please update the following components: Child, MiddleContextProvider, TopContextProvider',
2842
+ {withoutStack: true},
2843
+ );
2844
expect(rendered).toEqual(['count:0, name:brian']);
2845
topInstance.updateCount();
2846
ReactNoop.flush();
packages/react-reconciler/src/__tests__/ReactIncrementalErrorHandling-test.internal.js
+12
-2
@@ -1092,7 +1092,11 @@ describe('ReactIncrementalErrorHandling', () => {
1092
<Connector />
1093
</Provider>,
1094
);
1095
- ReactNoop.flush();
1095
+ expect(ReactNoop.flush).toWarnDev(
1096
+ 'Legacy context API has been detected within a strict-mode tree: \n\n' +
1097
+ 'Please update the following components: Connector, Provider',
1098
+ {withoutStack: true},
1099
+ );
1100
1101
// If the context stack does not unwind, span will get 'abcde'
1102
expect(ReactNoop.getChildren()).toEqual([span('a')]);
@@ -1581,6 +1585,12 @@ describe('ReactIncrementalErrorHandling', () => {
1585
};
1586
1587
ReactNoop.render(<Provider />);
1584
- expect(() => ReactNoop.flush()).toThrow('Oops!');
1588
+ expect(() => {
1589
+ expect(() => ReactNoop.flush()).toThrow('Oops!');
1590
+ }).toWarnDev(
1591
+ 'Legacy context API has been detected within a strict-mode tree: \n\n' +
1592
+ 'Please update the following components: Provider',
1593
+ {withoutStack: true},
1594
+ );
1595
});
1596
});
packages/react-reconciler/src/__tests__/ReactIncrementalPerf-test.internal.js
+10
-6
@@ -357,12 +357,16 @@ describe('ReactDebugFiberPerf', () => {
357
ReactNoop.render(<AllLifecycles />);
358
addComment('Mount');
359
expect(ReactNoop.flush).toWarnDev(
360
- 'componentWillMount: Please update the following components ' +
361
- 'to use componentDidMount instead: AllLifecycles' +
362
- '\n\ncomponentWillReceiveProps: Please update the following components ' +
363
- 'to use static getDerivedStateFromProps instead: AllLifecycles' +
364
- '\n\ncomponentWillUpdate: Please update the following components ' +
365
- 'to use componentDidUpdate instead: AllLifecycles',
360
+ [
361
+ 'componentWillMount: Please update the following components ' +
362
+ 'to use componentDidMount instead: AllLifecycles' +
363
+ '\n\ncomponentWillReceiveProps: Please update the following components ' +
364
+ 'to use static getDerivedStateFromProps instead: AllLifecycles' +
365
+ '\n\ncomponentWillUpdate: Please update the following components ' +
366
+ 'to use componentDidUpdate instead: AllLifecycles',
367
+ 'Legacy context API has been detected within a strict-mode tree: \n\n' +
368
+ 'Please update the following components: AllLifecycles',
369
+ ],
370
{withoutStack: true},
371
);
372
ReactNoop.render(<AllLifecycles />);
packages/react-reconciler/src/__tests__/ReactNewContext-test.internal.js
+7
-1
@@ -1144,7 +1144,13 @@ describe('ReactNewContext', () => {
1144
</App>
1145
</LegacyProvider>,
1146
);
1147
- expect(ReactNoop.flush()).toEqual(['LegacyProvider', 'App', 'Child']);
1147
+ expect(() => {
1148
+ expect(ReactNoop.flush()).toEqual(['LegacyProvider', 'App', 'Child']);
1149
+ }).toWarnDev(
1150
+ 'Legacy context API has been detected within a strict-mode tree: \n\n' +
1151
+ 'Please update the following components: LegacyProvider',
1152
+ {withoutStack: true},
1153
+ );
1154
expect(ReactNoop.getChildren()).toEqual([span('Child')]);
1155
1156
// Update App with same value (should bail out)
packages/react/src/__tests__/ReactStrictMode-test.internal.js
-2
@@ -822,8 +822,6 @@ describe('ReactStrictMode', () => {
822
React = require('react');
823
ReactTestRenderer = require('react-test-renderer');
824
PropTypes = require('prop-types');
825
- ReactFeatureFlags = require('shared/ReactFeatureFlags');
826
- ReactFeatureFlags.warnAboutLegacyContextAPI = true;
825
});
826
827
it('should warn if the legacy context API have been used in strict mode', () => {
packages/shared/ReactFeatureFlags.js
-3
@@ -28,9 +28,6 @@ export const replayFailedUnitOfWorkWithInvokeGuardedCallback = __DEV__;
28
// Warn about deprecated, async-unsafe lifecycles; relates to RFC #6:
29
export const warnAboutDeprecatedLifecycles = false;
30
31
-// Warn about legacy context API
32
-export const warnAboutLegacyContextAPI = false;
33
-
31
// Gather advanced timing metrics for Profiler subtrees.
32
export const enableProfilerTimer = __PROFILE__;
33
packages/shared/forks/ReactFeatureFlags.native-fabric-fb.js
-1
@@ -17,7 +17,6 @@ export const debugRenderPhaseSideEffectsForStrictMode = false;
17
export const enableUserTimingAPI = __DEV__;
18
export const enableSuspense = false;
19
export const warnAboutDeprecatedLifecycles = false;
20
-export const warnAboutLegacyContextAPI = __DEV__;
20
export const replayFailedUnitOfWorkWithInvokeGuardedCallback = __DEV__;
21
export const enableProfilerTimer = __PROFILE__;
22
export const enableSchedulerTracing = __PROFILE__;
packages/shared/forks/ReactFeatureFlags.native-fabric-oss.js
-1
@@ -17,7 +17,6 @@ export const debugRenderPhaseSideEffectsForStrictMode = false;
17
export const enableUserTimingAPI = __DEV__;
18
export const enableSuspense = false;
19
export const warnAboutDeprecatedLifecycles = false;
20
-export const warnAboutLegacyContextAPI = false;
20
export const replayFailedUnitOfWorkWithInvokeGuardedCallback = __DEV__;
21
export const enableProfilerTimer = __PROFILE__;
22
export const enableSchedulerTracing = __PROFILE__;
packages/shared/forks/ReactFeatureFlags.native-fb.js
-1
@@ -24,7 +24,6 @@ export const {
24
25
// The rest of the flags are static for better dead code elimination.
26
export const enableUserTimingAPI = __DEV__;
27
-export const warnAboutLegacyContextAPI = __DEV__;
27
export const enableProfilerTimer = __PROFILE__;
28
export const enableSchedulerTracing = __PROFILE__;
29
export const enableSuspenseServerRenderer = false;
packages/shared/forks/ReactFeatureFlags.native-oss.js
-1
@@ -18,7 +18,6 @@ export const enableSuspense = false;
18
export const enableUserTimingAPI = __DEV__;
19
export const replayFailedUnitOfWorkWithInvokeGuardedCallback = __DEV__;
20
export const warnAboutDeprecatedLifecycles = false;
21
-export const warnAboutLegacyContextAPI = false;
21
export const enableProfilerTimer = __PROFILE__;
22
export const enableSchedulerTracing = __PROFILE__;
23
export const enableSuspenseServerRenderer = false;
packages/shared/forks/ReactFeatureFlags.persistent.js
-1
@@ -17,7 +17,6 @@ export const debugRenderPhaseSideEffectsForStrictMode = false;
17
export const enableUserTimingAPI = __DEV__;
18
export const enableSuspense = false;
19
export const warnAboutDeprecatedLifecycles = false;
20
-export const warnAboutLegacyContextAPI = false;
20
export const replayFailedUnitOfWorkWithInvokeGuardedCallback = __DEV__;
21
export const enableProfilerTimer = __PROFILE__;
22
export const enableSchedulerTracing = __PROFILE__;
packages/shared/forks/ReactFeatureFlags.test-renderer.js
-1
@@ -17,7 +17,6 @@ export const debugRenderPhaseSideEffectsForStrictMode = false;
17
export const enableUserTimingAPI = __DEV__;
18
export const enableSuspense = false;
19
export const warnAboutDeprecatedLifecycles = false;
20
-export const warnAboutLegacyContextAPI = false;
20
export const replayFailedUnitOfWorkWithInvokeGuardedCallback = false;
21
export const enableProfilerTimer = false;
22
export const enableSchedulerTracing = false;
packages/shared/forks/ReactFeatureFlags.test-renderer.www.js
-1
@@ -17,7 +17,6 @@ export const debugRenderPhaseSideEffectsForStrictMode = false;
17
export const enableUserTimingAPI = __DEV__;
18
export const enableSuspense = true;
19
export const warnAboutDeprecatedLifecycles = false;
20
-export const warnAboutLegacyContextAPI = false;
20
export const replayFailedUnitOfWorkWithInvokeGuardedCallback = false;
21
export const enableProfilerTimer = false;
22
export const enableSchedulerTracing = false;
packages/shared/forks/ReactFeatureFlags.www.js
-3
@@ -21,9 +21,6 @@ export const {
21
disableInputAttributeSyncing,
22
} = require('ReactFeatureFlags');
23
24
-// The rest of the flags are static for better dead code elimination.
25
-export const warnAboutLegacyContextAPI = __DEV__;
26
-
24
// In www, we have experimental support for gathering data
25
// from User Timing API calls in production. By default, we
26
// only emit performance.mark/measure calls in __DEV__. But if
scripts/rollup/shims/react-native-fb/ReactFeatureFlags.js
-1
@@ -14,7 +14,6 @@ const ReactFeatureFlags = {
14
debugRenderPhaseSideEffects: false,
15
debugRenderPhaseSideEffectsForStrictMode: false,
16
warnAboutDeprecatedLifecycles: true,
17
- warnAboutLegacyContextAPI: true,
17
};
18
19
module.exports = ReactFeatureFlags;