Skip to content

Commit a5d4b75

Browse files
BoyYangzai洋zombieJ
authored
fix: Select label React Node warning some case (#946)
* 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]>
1 parent 4510b80 commit a5d4b75

File tree

2 files changed

+56
-13
lines changed

2 files changed

+56
-13
lines changed

src/Select.tsx

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -140,7 +140,7 @@ export interface SelectProps<ValueType = any, OptionType extends BaseOptionType
140140
options?: OptionType[];
141141
defaultActiveFirstOption?: boolean;
142142
virtual?: boolean;
143-
direction?: "ltr" | "rtl";
143+
direction?: 'ltr' | 'rtl';
144144
listHeight?: number;
145145
listItemHeight?: number;
146146

@@ -275,7 +275,12 @@ const Select = React.forwardRef(
275275
// Warning if label not same as provided
276276
if (process.env.NODE_ENV !== 'production' && !optionLabelProp) {
277277
const optionLabel = option?.[mergedFieldNames.label];
278-
if (optionLabel !== undefined && optionLabel !== rawLabel) {
278+
if (
279+
optionLabel !== undefined &&
280+
!React.isValidElement(optionLabel) &&
281+
!React.isValidElement(rawLabel) &&
282+
optionLabel !== rawLabel
283+
) {
279284
warning(false, '`label` of `value` is not same as `label` in Select options.');
280285
}
281286
}

tests/Select.test.tsx

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

1480-
it('warning if label not same as option', () => {
1481-
const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
1482-
mount(
1483-
<Select value={{ value: '2', label: 'One' }} labelInValue>
1484-
<Option value="2">Two</Option>
1485-
</Select>,
1486-
);
1487-
expect(errorSpy).toHaveBeenCalledWith(
1488-
'Warning: `label` of `value` is not same as `label` in Select options.',
1489-
);
1490-
errorSpy.mockRestore();
1480+
describe('warning if label not same as option', () => {
1481+
it('should work', () => {
1482+
resetWarned();
1483+
1484+
const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
1485+
mount(
1486+
<Select value={{ value: '2', label: 'One' }} labelInValue>
1487+
<Option value="2">Two</Option>
1488+
</Select>,
1489+
);
1490+
expect(errorSpy).toHaveBeenCalledWith(
1491+
'Warning: `label` of `value` is not same as `label` in Select options.',
1492+
);
1493+
errorSpy.mockRestore();
1494+
});
1495+
1496+
it('not warning for react node', () => {
1497+
resetWarned();
1498+
const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
1499+
1500+
const Demo = () => {
1501+
const [, setVal] = React.useState(0);
1502+
1503+
return (
1504+
<Select
1505+
onChange={setVal}
1506+
defaultValue={0}
1507+
options={[
1508+
{
1509+
value: 0,
1510+
label: <div />,
1511+
},
1512+
{
1513+
value: 1,
1514+
label: <div />,
1515+
},
1516+
]}
1517+
/>
1518+
);
1519+
};
1520+
1521+
const wrapper = mount(<Demo />);
1522+
1523+
toggleOpen(wrapper);
1524+
selectItem(wrapper, 1);
1525+
1526+
expect(errorSpy).not.toHaveBeenCalled();
1527+
errorSpy.mockRestore();
1528+
});
14911529
});
14921530

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

0 commit comments

Comments
 (0)