Skip to content

Commit 305b3dc

Browse files
Wxh16144BoyYangzai
andauthored
fix: Select label React Node warning some case (#946) (#961)
* fix: Select label React Node warning some case * test: test driven * fix: warning of label when update * chore: clean up * chore: back of raw --------- Co-authored-by: 洋 <[email protected]> Co-authored-by: 二货机器人 <[email protected]> (cherry picked from commit a5d4b75) # Conflicts: # src/Select.tsx Co-authored-by: 洋 <[email protected]>
1 parent 0235c7f commit 305b3dc

File tree

2 files changed

+55
-12
lines changed

2 files changed

+55
-12
lines changed

src/Select.tsx

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -272,7 +272,12 @@ const Select = React.forwardRef(
272272
// Warning if label not same as provided
273273
if (process.env.NODE_ENV !== 'production' && !optionLabelProp) {
274274
const optionLabel = option?.[mergedFieldNames.label];
275-
if (optionLabel !== undefined && optionLabel !== rawLabel) {
275+
if (
276+
optionLabel !== undefined &&
277+
!React.isValidElement(optionLabel) &&
278+
!React.isValidElement(rawLabel) &&
279+
optionLabel !== rawLabel
280+
) {
276281
warning(false, '`label` of `value` is not same as `label` in Select options.');
277282
}
278283
}

tests/Select.test.tsx

Lines changed: 49 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1417,17 +1417,55 @@ describe('Select.Basic', () => {
14171417
expect(onKeyUp).toHaveBeenCalled();
14181418
});
14191419

1420-
it('warning if label not same as option', () => {
1421-
const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
1422-
mount(
1423-
<Select value={{ value: '2', label: 'One' }} labelInValue>
1424-
<Option value="2">Two</Option>
1425-
</Select>,
1426-
);
1427-
expect(errorSpy).toHaveBeenCalledWith(
1428-
'Warning: `label` of `value` is not same as `label` in Select options.',
1429-
);
1430-
errorSpy.mockRestore();
1420+
describe('warning if label not same as option', () => {
1421+
it('should work', () => {
1422+
resetWarned();
1423+
1424+
const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
1425+
mount(
1426+
<Select value={{ value: '2', label: 'One' }} labelInValue>
1427+
<Option value="2">Two</Option>
1428+
</Select>,
1429+
);
1430+
expect(errorSpy).toHaveBeenCalledWith(
1431+
'Warning: `label` of `value` is not same as `label` in Select options.',
1432+
);
1433+
errorSpy.mockRestore();
1434+
});
1435+
1436+
it('not warning for react node', () => {
1437+
resetWarned();
1438+
const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
1439+
1440+
const Demo = () => {
1441+
const [, setVal] = React.useState(0);
1442+
1443+
return (
1444+
<Select
1445+
onChange={setVal}
1446+
defaultValue={0}
1447+
options={[
1448+
{
1449+
value: 0,
1450+
label: <div />,
1451+
},
1452+
{
1453+
value: 1,
1454+
label: <div />,
1455+
},
1456+
]}
1457+
/>
1458+
);
1459+
};
1460+
1461+
const wrapper = mount(<Demo />);
1462+
1463+
toggleOpen(wrapper);
1464+
selectItem(wrapper, 1);
1465+
1466+
expect(errorSpy).not.toHaveBeenCalled();
1467+
errorSpy.mockRestore();
1468+
});
14311469
});
14321470

14331471
describe('warning if use `props` to read data', () => {

0 commit comments

Comments
 (0)