Simplify wording of key warning (#14503)

I don't think "array or iterator" is adding anything, and it may well be confusing, especially since this is one of the first and most common warnings that devs see.
This commit is contained in:
Sophie Alpert 2019-01-07 08:30:23 -08:00 committed by GitHub
parent 3494ee57e6
commit 547e059f0b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
9 changed files with 23 additions and 31 deletions

View File

@ -354,7 +354,7 @@ describe('ReactFunctionComponent', () => {
} }
expect(() => ReactTestUtils.renderIntoDocument(<Child />)).toWarnDev( expect(() => ReactTestUtils.renderIntoDocument(<Child />)).toWarnDev(
'Each child in an array or iterator should have a unique "key" prop.\n\n' + 'Each child in a list should have a unique "key" prop.\n\n' +
'Check the render method of `Child`.', 'Check the render method of `Child`.',
); );
}); });

View File

@ -162,8 +162,8 @@ describe('ReactMultiChildText', () => {
['', 'foo', <div>{true}{<div />}{1.2}{''}</div>, 'foo'], ['', 'foo', <div />, 'foo'], ['', 'foo', <div>{true}{<div />}{1.2}{''}</div>, 'foo'], ['', 'foo', <div />, 'foo'],
]); ]);
}).toWarnDev([ }).toWarnDev([
'Warning: Each child in an array or iterator should have a unique "key" prop.', 'Warning: Each child in a list should have a unique "key" prop.',
'Warning: Each child in an array or iterator should have a unique "key" prop.', 'Warning: Each child in a list should have a unique "key" prop.',
]); ]);
}); });

View File

@ -80,7 +80,7 @@ if (__DEV__) {
child._store.validated = true; child._store.validated = true;
const currentComponentErrorInfo = const currentComponentErrorInfo =
'Each child in an array or iterator should have a unique ' + 'Each child in a list should have a unique ' +
'"key" prop. See https://fb.me/react-warning-keys for ' + '"key" prop. See https://fb.me/react-warning-keys for ' +
'more information.' + 'more information.' +
getCurrentFiberStackInDev(); getCurrentFiberStackInDev();
@ -91,7 +91,7 @@ if (__DEV__) {
warning( warning(
false, false,
'Each child in an array or iterator should have a unique ' + 'Each child in a list should have a unique ' +
'"key" prop. See https://fb.me/react-warning-keys for ' + '"key" prop. See https://fb.me/react-warning-keys for ' +
'more information.', 'more information.',
); );

View File

@ -709,7 +709,7 @@ describe('ReactFragment', () => {
ReactNoop.render(<Foo condition={false} />); ReactNoop.render(<Foo condition={false} />);
expect(ReactNoop.flush).toWarnDev( expect(ReactNoop.flush).toWarnDev(
'Each child in an array or iterator should have a unique "key" prop.', 'Each child in a list should have a unique "key" prop.',
); );
expect(ops).toEqual([]); expect(ops).toEqual([]);
@ -753,12 +753,12 @@ describe('ReactFragment', () => {
ReactNoop.render(<Foo condition={true} />); ReactNoop.render(<Foo condition={true} />);
expect(ReactNoop.flush).toWarnDev( expect(ReactNoop.flush).toWarnDev(
'Each child in an array or iterator should have a unique "key" prop.', 'Each child in a list should have a unique "key" prop.',
); );
ReactNoop.render(<Foo condition={false} />); ReactNoop.render(<Foo condition={false} />);
expect(ReactNoop.flush).toWarnDev( expect(ReactNoop.flush).toWarnDev(
'Each child in an array or iterator should have a unique "key" prop.', 'Each child in a list should have a unique "key" prop.',
); );
expect(ops).toEqual(['Update Stateful']); expect(ops).toEqual(['Update Stateful']);
@ -766,7 +766,7 @@ describe('ReactFragment', () => {
ReactNoop.render(<Foo condition={true} />); ReactNoop.render(<Foo condition={true} />);
expect(ReactNoop.flush).toWarnDev( expect(ReactNoop.flush).toWarnDev(
'Each child in an array or iterator should have a unique "key" prop.', 'Each child in a list should have a unique "key" prop.',
); );
expect(ops).toEqual(['Update Stateful', 'Update Stateful']); expect(ops).toEqual(['Update Stateful', 'Update Stateful']);

View File

@ -126,7 +126,7 @@ function validateExplicitKey(element, parentType) {
if (__DEV__) { if (__DEV__) {
warning( warning(
false, false,
'Each child in an array or iterator should have a unique "key" prop.' + 'Each child in a list should have a unique "key" prop.' +
'%s%s See https://fb.me/react-warning-keys for more information.', '%s%s See https://fb.me/react-warning-keys for more information.',
currentComponentErrorInfo, currentComponentErrorInfo,
childOwner, childOwner,

View File

@ -320,7 +320,7 @@ describe('ReactChildren', () => {
let instance; let instance;
expect(() => (instance = <div>{threeDivIterable}</div>)).toWarnDev( expect(() => (instance = <div>{threeDivIterable}</div>)).toWarnDev(
'Warning: Each child in an array or iterator should have a unique "key" prop.', 'Warning: Each child in a list should have a unique "key" prop.',
); );
function assertCalls() { function assertCalls() {
@ -905,7 +905,7 @@ describe('ReactChildren', () => {
ReactTestUtils.renderIntoDocument(<ComponentReturningArray />), ReactTestUtils.renderIntoDocument(<ComponentReturningArray />),
).toWarnDev( ).toWarnDev(
'Warning: ' + 'Warning: ' +
'Each child in an array or iterator should have a unique "key" prop.' + 'Each child in a list should have a unique "key" prop.' +
' See https://fb.me/react-warning-keys for more information.' + ' See https://fb.me/react-warning-keys for more information.' +
'\n in ComponentReturningArray (at **)', '\n in ComponentReturningArray (at **)',
); );
@ -926,7 +926,7 @@ describe('ReactChildren', () => {
ReactTestUtils.renderIntoDocument([<div />, <div />]), ReactTestUtils.renderIntoDocument([<div />, <div />]),
).toWarnDev( ).toWarnDev(
'Warning: ' + 'Warning: ' +
'Each child in an array or iterator should have a unique "key" prop.' + 'Each child in a list should have a unique "key" prop.' +
' See https://fb.me/react-warning-keys for more information.', ' See https://fb.me/react-warning-keys for more information.',
{withoutStack: true}, // There's nothing on the stack {withoutStack: true}, // There's nothing on the stack
); );

View File

@ -259,9 +259,7 @@ describe('ReactElementClone', () => {
it('warns for keys for arrays of elements in rest args', () => { it('warns for keys for arrays of elements in rest args', () => {
expect(() => expect(() =>
React.cloneElement(<div />, null, [<div />, <div />]), React.cloneElement(<div />, null, [<div />, <div />]),
).toWarnDev( ).toWarnDev('Each child in a list should have a unique "key" prop.');
'Each child in an array or iterator should have a unique "key" prop.',
);
}); });
it('does not warns for arrays of elements with keys', () => { it('does not warns for arrays of elements with keys', () => {

View File

@ -42,9 +42,7 @@ describe('ReactElementValidator', () => {
expect(() => { expect(() => {
Component(null, [Component(), Component()]); Component(null, [Component(), Component()]);
}).toWarnDev( }).toWarnDev('Each child in a list should have a unique "key" prop.');
'Each child in an array or iterator should have a unique "key" prop.',
);
}); });
it('warns for keys for arrays of elements with owner info', () => { it('warns for keys for arrays of elements with owner info', () => {
@ -67,7 +65,7 @@ describe('ReactElementValidator', () => {
expect(() => { expect(() => {
ReactTestUtils.renderIntoDocument(React.createElement(ComponentWrapper)); ReactTestUtils.renderIntoDocument(React.createElement(ComponentWrapper));
}).toWarnDev( }).toWarnDev(
'Each child in an array or iterator should have a unique "key" prop.' + 'Each child in a list should have a unique "key" prop.' +
'\n\nCheck the render method of `InnerClass`. ' + '\n\nCheck the render method of `InnerClass`. ' +
'It was passed a child from ComponentWrapper. ', 'It was passed a child from ComponentWrapper. ',
); );
@ -84,7 +82,7 @@ describe('ReactElementValidator', () => {
expect(() => { expect(() => {
ReactTestUtils.renderIntoDocument(<Anonymous>{divs}</Anonymous>); ReactTestUtils.renderIntoDocument(<Anonymous>{divs}</Anonymous>);
}).toWarnDev( }).toWarnDev(
'Warning: Each child in an array or iterator should have a unique ' + 'Warning: Each child in a list should have a unique ' +
'"key" prop. See https://fb.me/react-warning-keys for more information.\n' + '"key" prop. See https://fb.me/react-warning-keys for more information.\n' +
' in div (at **)', ' in div (at **)',
); );
@ -96,7 +94,7 @@ describe('ReactElementValidator', () => {
expect(() => { expect(() => {
ReactTestUtils.renderIntoDocument(<div>{divs}</div>); ReactTestUtils.renderIntoDocument(<div>{divs}</div>);
}).toWarnDev( }).toWarnDev(
'Warning: Each child in an array or iterator should have a unique ' + 'Warning: Each child in a list should have a unique ' +
'"key" prop.\n\nCheck the top-level render call using <div>. See ' + '"key" prop.\n\nCheck the top-level render call using <div>. See ' +
'https://fb.me/react-warning-keys for more information.\n' + 'https://fb.me/react-warning-keys for more information.\n' +
' in div (at **)', ' in div (at **)',
@ -117,7 +115,7 @@ describe('ReactElementValidator', () => {
} }
expect(() => ReactTestUtils.renderIntoDocument(<GrandParent />)).toWarnDev( expect(() => ReactTestUtils.renderIntoDocument(<GrandParent />)).toWarnDev(
'Warning: Each child in an array or iterator should have a unique ' + 'Warning: Each child in a list should have a unique ' +
'"key" prop.\n\nCheck the render method of `Component`. See ' + '"key" prop.\n\nCheck the render method of `Component`. See ' +
'https://fb.me/react-warning-keys for more information.\n' + 'https://fb.me/react-warning-keys for more information.\n' +
' in div (at **)\n' + ' in div (at **)\n' +
@ -161,7 +159,7 @@ describe('ReactElementValidator', () => {
}; };
expect(() => Component(null, iterable)).toWarnDev( expect(() => Component(null, iterable)).toWarnDev(
'Each child in an array or iterator should have a unique "key" prop.', 'Each child in a list should have a unique "key" prop.',
); );
}); });

View File

@ -48,9 +48,7 @@ describe('ReactJSXElementValidator', () => {
ReactTestUtils.renderIntoDocument( ReactTestUtils.renderIntoDocument(
<Component>{[<Component />, <Component />]}</Component>, <Component>{[<Component />, <Component />]}</Component>,
), ),
).toWarnDev( ).toWarnDev('Each child in a list should have a unique "key" prop.');
'Each child in an array or iterator should have a unique "key" prop.',
);
}); });
it('warns for keys for arrays of elements with owner info', () => { it('warns for keys for arrays of elements with owner info', () => {
@ -69,7 +67,7 @@ describe('ReactJSXElementValidator', () => {
expect(() => expect(() =>
ReactTestUtils.renderIntoDocument(<ComponentWrapper />), ReactTestUtils.renderIntoDocument(<ComponentWrapper />),
).toWarnDev( ).toWarnDev(
'Each child in an array or iterator should have a unique "key" prop.' + 'Each child in a list should have a unique "key" prop.' +
'\n\nCheck the render method of `InnerComponent`. ' + '\n\nCheck the render method of `InnerComponent`. ' +
'It was passed a child from ComponentWrapper. ', 'It was passed a child from ComponentWrapper. ',
); );
@ -90,9 +88,7 @@ describe('ReactJSXElementValidator', () => {
expect(() => expect(() =>
ReactTestUtils.renderIntoDocument(<Component>{iterable}</Component>), ReactTestUtils.renderIntoDocument(<Component>{iterable}</Component>),
).toWarnDev( ).toWarnDev('Each child in a list should have a unique "key" prop.');
'Each child in an array or iterator should have a unique "key" prop.',
);
}); });
it('does not warn for arrays of elements with keys', () => { it('does not warn for arrays of elements with keys', () => {