Match select value against primitives to string but not undefined (#24077)
Sebastian Markbåge committed
Mar 12, 2022 at 13:34 UTC
796724086a8a64100abf8bbc848a07daeb37777d
2 files changed
+38
-3
packages/react-dom/src/__tests__/ReactDOMServerIntegrationSelect-test.js
+30
@@ -246,4 +246,34 @@ describe('ReactDOMServerIntegrationSelect', () => {
246
expect(option.selected).toBe(true);
247
},
248
);
249
+
250
+ itRenders(
251
+ 'a boolean true select value match the string "true"',
252
+ async render => {
253
+ const e = await render(
254
+ <select value={true} readOnly={true}>
255
+ <option value="first">First</option>
256
+ <option value="true">True</option>
257
+ </select>,
258
+ 1,
259
+ );
260
+ expect(e.firstChild.selected).toBe(false);
261
+ expect(e.lastChild.selected).toBe(true);
262
+ },
263
+ );
264
+
265
+ itRenders(
266
+ 'a missing select value does not match the string "undefined"',
267
+ async render => {
268
+ const e = await render(
269
+ <select readOnly={true}>
270
+ <option value="first">First</option>
271
+ <option value="undefined">Undefined</option>
272
+ </select>,
273
+ 1,
274
+ );
275
+ expect(e.firstChild.selected).toBe(true);
276
+ expect(e.lastChild.selected).toBe(false);
277
+ },
278
+ );
279
});
packages/react-dom/src/server/ReactDOMServerFormatConfig.js
+8
-3
@@ -749,7 +749,7 @@ function pushStartOption(
749
}
750
}
751
752
- if (selectedValue !== null) {
752
+ if (selectedValue != null) {
753
let stringValue;
754
if (value !== null) {
755
if (__DEV__) {
@@ -782,8 +782,13 @@ function pushStartOption(
782
break;
783
}
784
}
785
- } else if (selectedValue === stringValue) {
786
- target.push(selectedMarkerAttribute);
785
+ } else {
786
+ if (__DEV__) {
787
+ checkAttributeStringCoercion(selectedValue, 'select.value');
788
+ }
789
+ if ('' + selectedValue === stringValue) {
790
+ target.push(selectedMarkerAttribute);
791
+ }
792
}
793
} else if (selected) {
794
target.push(selectedMarkerAttribute);