Stringify <option> children #13465
Merged
Stringify <option> children #13465
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
gaearon
commented
Aug 22, 2018
| @@ -41,9 +42,10 @@ describe('ReactDOMOption', () => { | |||
| expect(() => { | |||
| node = ReactTestUtils.renderIntoDocument(el); | |||
| }).toWarnDev( | |||
| '<div> cannot appear as a child of <option>.\n' + ' in option (at **)', | |||
| 'Only strings and numbers are supported as <option> children.\n' + | |||
There was a problem hiding this comment.
I just reused the same warning message we have in SSR. Seems to make more sense than the DOM nesting warning I tried to use before.
gaearon
commented
Aug 22, 2018
| ); | ||
| expect(node.innerHTML).toBe('1 2'); | ||
| expect(node.innerHTML).toBe('1 [object Object] 2'); |
There was a problem hiding this comment.
That's the real change here. All cases where behavior changed were warnings.
gaearon
commented
Aug 22, 2018
| @@ -61,6 +63,76 @@ describe('ReactDOMOption', () => { | |||
| expect(node.innerHTML).toBe('1 2'); | |||
| }); | |||
|
|
|||
| it('should throw on object children', () => { | |||
There was a problem hiding this comment.
Just documenting existing behavior.
gaearon
commented
Aug 22, 2018
| @@ -439,7 +439,7 @@ describe('ReactDOMServerIntegration', () => { | |||
| ); | |||
| expect(e.getAttribute('value')).toBe(null); | |||
| expect(e.getAttribute('defaultValue')).toBe(null); | |||
| expect(e.firstChild.innerHTML).toBe('BarFooBaz'); | |||
| expect(e.firstChild.innerHTML).toBe('BarFoo[object Object]Baz'); | |||
There was a problem hiding this comment.
Already a warning.
| // is needlessly annoying. | ||
| const ancestorInfo = updatedAncestorInfo(null, 'option'); | ||
| validateDOMNesting(child.type, null, ancestorInfo); | ||
| if (typeof child.type !== 'string') { |
There was a problem hiding this comment.
This will avoid warnings for fbt.
sebmarkbage
approved these changes
Aug 22, 2018
|
ReactDOM: size: -0.0%, gzip: -0.1% Details of bundled changes.Comparing: 3661616...b97ac07 react-dom
Generated by 🚫 dangerJS |
Merged
This was referenced Sep 7, 2018
This was referenced Nov 1, 2018
This was referenced Sep 5, 2024
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Follow-up to #13261. We couldn't land this fix internally because we rely on element-like objects (our translation tooling) being stringified inside an
<option>. That works in other cases (e.g.textareavalues), and worked in the past foroptionbecause it used to take the non-shouldSetTextContentcodepath. But that created other issues which #13261 solved.This changes
<option>to actually stringify its children. Should be a tiny bit faster to avoid those checks too, and makes it consistent with<textarea>. Note that in practice it already errors on objects. So the only thing that would get stringified are other React elements (e.g. a<span />inside of an<option>). Or things pretending to be elements.This is not a breaking change because nesting other elements into
<option>is already unsupported, and we always showed a warning about that.