Skip to content

Commit 4cf7703

Browse files
committed
Address feedback
1 parent 8baff7e commit 4cf7703

File tree

5 files changed

+46
-42
lines changed

5 files changed

+46
-42
lines changed

packages/react-reconciler/src/ReactStrictModeWarnings.js

Lines changed: 27 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -287,6 +287,7 @@ if (__DEV__) {
287287

288288
// Tracks components we have already warned about.
289289
const didWarnAboutLegacyContext = new Set();
290+
290291
ReactStrictModeWarnings.recordLegacyContextWarning = (
291292
fiber: Fiber,
292293
instance: any,
@@ -304,6 +305,7 @@ if (__DEV__) {
304305
if (didWarnAboutLegacyContext.has(fiber.type)) {
305306
return;
306307
}
308+
307309
let warningsForRoot = pendingLegacyContextWarning.get(strictRoot);
308310

309311
if (
@@ -335,34 +337,36 @@ if (__DEV__) {
335337
componentStacks.set(componentStack, {
336338
count: count + 1,
337339
name: componentName,
340+
stack: componentStack,
338341
});
339342
didWarnAboutLegacyContext.add(fiber.type);
340343
});
341344

342-
const stacks = Array.from(componentStacks.keys());
343-
// Find the most frequently found component stack and use that
344-
let currentCount = 0;
345-
let mostFrequentStack = null;
346-
347-
for (let i = 0; i < stacks.length; i++) {
348-
const stack = stacks[i];
349-
let {count} = (componentStacks.get(stack): any);
350-
if (count > currentCount || mostFrequentStack === null) {
351-
currentCount = count;
352-
mostFrequentStack = stack;
353-
}
345+
// Get the stacks from our componentStacks Map
346+
const stacks = Array.from(componentStacks.values());
347+
348+
// Sort the stacks by their counts
349+
stacks.sort((a, b) => b.count - a.count);
350+
351+
const mostFrequentStack = stacks[0];
352+
353+
if (mostFrequentStack) {
354+
// We map to a Set to remove duplicate component names
355+
const componentNames = Array.from(
356+
new Set(stacks.map(stack => stack.name)),
357+
).join(', ');
358+
359+
console.error(
360+
'Legacy context API has been detected within a strict-mode tree.' +
361+
'\n\nThe old API will be supported in all 16.x releases, but applications ' +
362+
'using it should migrate to the new version.' +
363+
'\n\nPlease update the following components: %s' +
364+
'\n\nLearn more about this warning here: https://fb.me/react-legacy-context' +
365+
'%s',
366+
componentNames,
367+
mostFrequentStack.stack,
368+
);
354369
}
355-
356-
console.error(
357-
'Legacy context API has been detected within a strict-mode tree.' +
358-
'\n\nThe old API will be supported in all 16.x releases, but applications ' +
359-
'using it should migrate to the new version.' +
360-
'\n\nPlease update the following component: %s' +
361-
'\n\nLearn more about this warning here: https://fb.me/react-legacy-context' +
362-
'%s',
363-
(componentStacks.get(mostFrequentStack): any).name,
364-
mostFrequentStack,
365-
);
366370
},
367371
);
368372
};

packages/react-reconciler/src/__tests__/ReactIncremental-test.internal.js

Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1916,7 +1916,7 @@ describe('ReactIncremental', () => {
19161916
'Legacy context API has been detected within a strict-mode tree.\n\n' +
19171917
'The old API will be supported in all 16.x releases, but applications ' +
19181918
'using it should migrate to the new version.\n\n' +
1919-
'Please update the following component: Intl',
1919+
'Please update the following components: Intl, ShowLocale, ShowBoth',
19201920
);
19211921

19221922
ReactNoop.render(
@@ -1972,7 +1972,7 @@ describe('ReactIncremental', () => {
19721972
'Legacy context API has been detected within a strict-mode tree.\n\n' +
19731973
'The old API will be supported in all 16.x releases, but applications ' +
19741974
'using it should migrate to the new version.\n\n' +
1975-
'Please update the following component: Router',
1975+
'Please update the following components: Router, ShowRoute',
19761976
);
19771977
});
19781978

@@ -2002,7 +2002,7 @@ describe('ReactIncremental', () => {
20022002
'Legacy context API has been detected within a strict-mode tree.\n\n' +
20032003
'The old API will be supported in all 16.x releases, but applications ' +
20042004
'using it should migrate to the new version.\n\n' +
2005-
'Please update the following component: Recurse',
2005+
'Please update the following components: Recurse',
20062006
);
20072007
expect(ops).toEqual([
20082008
'Recurse {}',
@@ -2046,7 +2046,7 @@ describe('ReactIncremental', () => {
20462046
'Legacy context API has been detected within a strict-mode tree.\n\n' +
20472047
'The old API will be supported in all 16.x releases, but applications ' +
20482048
'using it should migrate to the new version.\n\n' +
2049-
'Please update the following component: Recurse',
2049+
'Please update the following components: Recurse',
20502050
],
20512051
{withoutStack: 0},
20522052
);
@@ -2114,7 +2114,7 @@ describe('ReactIncremental', () => {
21142114
'Legacy context API has been detected within a strict-mode tree.\n\n' +
21152115
'The old API will be supported in all 16.x releases, but applications ' +
21162116
'using it should migrate to the new version.\n\n' +
2117-
'Please update the following component: Intl',
2117+
'Please update the following components: Intl, ShowLocale',
21182118
);
21192119
});
21202120

@@ -2194,7 +2194,7 @@ describe('ReactIncremental', () => {
21942194
'Legacy context API has been detected within a strict-mode tree.\n\n' +
21952195
'The old API will be supported in all 16.x releases, but applications ' +
21962196
'using it should migrate to the new version.\n\n' +
2197-
'Please update the following component: Intl',
2197+
'Please update the following components: Intl, ShowLocaleClass, ShowLocaleFn',
21982198
);
21992199
expect(ops).toEqual([
22002200
'Intl:read {}',
@@ -2287,7 +2287,7 @@ describe('ReactIncremental', () => {
22872287
'Legacy context API has been detected within a strict-mode tree.\n\n' +
22882288
'The old API will be supported in all 16.x releases, but applications ' +
22892289
'using it should migrate to the new version.\n\n' +
2290-
'Please update the following component: Intl',
2290+
'Please update the following components: Intl, ShowLocaleClass, ShowLocaleFn',
22912291
);
22922292
expect(ops).toEqual([
22932293
'Intl:read {}',
@@ -2357,7 +2357,7 @@ describe('ReactIncremental', () => {
23572357
'Legacy context API has been detected within a strict-mode tree.\n\n' +
23582358
'The old API will be supported in all 16.x releases, but applications ' +
23592359
'using it should migrate to the new version.\n\n' +
2360-
'Please update the following component: Child',
2360+
'Please update the following components: Child',
23612361
);
23622362

23632363
// Trigger an update in the middle of the tree
@@ -2408,7 +2408,7 @@ describe('ReactIncremental', () => {
24082408
'Legacy context API has been detected within a strict-mode tree.\n\n' +
24092409
'The old API will be supported in all 16.x releases, but applications ' +
24102410
'using it should migrate to the new version.\n\n' +
2411-
'Please update the following component: ContextProvider',
2411+
'Please update the following components: ContextProvider',
24122412
);
24132413

24142414
// Trigger an update in the middle of the tree
@@ -2459,7 +2459,7 @@ describe('ReactIncremental', () => {
24592459
'Legacy context API has been detected within a strict-mode tree.\n\n' +
24602460
'The old API will be supported in all 16.x releases, but applications ' +
24612461
'using it should migrate to the new version.\n\n' +
2462-
'Please update the following component: MyComponent',
2462+
'Please update the following components: MyComponent',
24632463
],
24642464
{withoutStack: 1},
24652465
);
@@ -2608,7 +2608,7 @@ describe('ReactIncremental', () => {
26082608
'Legacy context API has been detected within a strict-mode tree.\n\n' +
26092609
'The old API will be supported in all 16.x releases, but applications ' +
26102610
'using it should migrate to the new version.\n\n' +
2611-
'Please update the following component: TopContextProvider',
2611+
'Please update the following components: TopContextProvider, Child',
26122612
);
26132613
expect(rendered).toEqual(['count:0']);
26142614
instance.updateCount();
@@ -2671,7 +2671,7 @@ describe('ReactIncremental', () => {
26712671
'Legacy context API has been detected within a strict-mode tree.\n\n' +
26722672
'The old API will be supported in all 16.x releases, but applications ' +
26732673
'using it should migrate to the new version.\n\n' +
2674-
'Please update the following component: TopContextProvider',
2674+
'Please update the following components: TopContextProvider, MiddleContextProvider, Child',
26752675
);
26762676
expect(rendered).toEqual(['count:0']);
26772677
instance.updateCount();
@@ -2743,7 +2743,7 @@ describe('ReactIncremental', () => {
27432743
'Legacy context API has been detected within a strict-mode tree.\n\n' +
27442744
'The old API will be supported in all 16.x releases, but applications ' +
27452745
'using it should migrate to the new version.\n\n' +
2746-
'Please update the following component: TopContextProvider',
2746+
'Please update the following components: TopContextProvider, MiddleContextProvider, Child',
27472747
);
27482748
expect(rendered).toEqual(['count:0']);
27492749
instance.updateCount();
@@ -2825,7 +2825,7 @@ describe('ReactIncremental', () => {
28252825
'Legacy context API has been detected within a strict-mode tree.\n\n' +
28262826
'The old API will be supported in all 16.x releases, but applications ' +
28272827
'using it should migrate to the new version.\n\n' +
2828-
'Please update the following component: TopContextProvider',
2828+
'Please update the following components: TopContextProvider, MiddleContextProvider, Child',
28292829
);
28302830
expect(rendered).toEqual(['count:0, name:brian']);
28312831
topInstance.updateCount();

packages/react-reconciler/src/__tests__/ReactIncrementalErrorHandling-test.internal.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1152,7 +1152,7 @@ describe('ReactIncrementalErrorHandling', () => {
11521152
'Legacy context API has been detected within a strict-mode tree.\n\n' +
11531153
'The old API will be supported in all 16.x releases, but ' +
11541154
'applications using it should migrate to the new version.\n\n' +
1155-
'Please update the following component: Provider',
1155+
'Please update the following components: Provider, Connector',
11561156
);
11571157

11581158
// If the context stack does not unwind, span will get 'abcde'
@@ -1655,7 +1655,7 @@ describe('ReactIncrementalErrorHandling', () => {
16551655
'Legacy context API has been detected within a strict-mode tree.\n\n' +
16561656
'The old API will be supported in all 16.x releases, but ' +
16571657
'applications using it should migrate to the new version.\n\n' +
1658-
'Please update the following component: Provider',
1658+
'Please update the following components: Provider',
16591659
]);
16601660
});
16611661
});

packages/react-reconciler/src/__tests__/ReactNewContext-test.internal.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1197,7 +1197,7 @@ describe('ReactNewContext', () => {
11971197
'Legacy context API has been detected within a strict-mode tree.\n\n' +
11981198
'The old API will be supported in all 16.x releases, but applications ' +
11991199
'using it should migrate to the new version.\n\n' +
1200-
'Please update the following component: LegacyProvider',
1200+
'Please update the following components: LegacyProvider',
12011201
);
12021202
expect(ReactNoop.getChildren()).toEqual([span('Child')]);
12031203

packages/react/src/__tests__/ReactStrictMode-test.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -874,8 +874,8 @@ describe('context legacy', () => {
874874
'Warning: Legacy context API has been detected within a strict-mode tree.' +
875875
'\n\nThe old API will be supported in all 16.x releases, but applications ' +
876876
'using it should migrate to the new version.' +
877-
'\n\nPlease update the following component: ' +
878-
'LegacyContextProvider' +
877+
'\n\nPlease update the following components: ' +
878+
'LegacyContextProvider, LegacyContextConsumer, FunctionalLegacyContextConsumer' +
879879
'\n\nLearn more about this warning here: ' +
880880
'https://fb.me/react-legacy-context' +
881881
'\n in LegacyContextProvider (at **)' +

0 commit comments

Comments
 (0)