{"action":"created","issue":{"url":"https://api.github.com/repos/facebook/react/issues/11911","repository_url":"https://api.github.com/repos/facebook/react","labels_url":"https://api.github.com/repos/facebook/react/issues/11911/labels{/name}","comments_url":"https://api.github.com/repos/facebook/react/issues/11911/comments","events_url":"https://api.github.com/repos/facebook/react/issues/11911/events","html_url":"https://github.com/facebook/react/issues/11911","id":284148385,"node_id":"MDU6SXNzdWUyODQxNDgzODU=","number":11911,"title":" React DOM crashes when <option> contains three interpolated value if one is a conditional. ","user":{"login":"ZhangYiJiang","id":445650,"node_id":"MDQ6VXNlcjQ0NTY1MA==","avatar_url":"https://avatars0.githubusercontent.com/u/445650?v=4","gravatar_id":"","url":"https://api.github.com/users/ZhangYiJiang","html_url":"https://github.com/ZhangYiJiang","followers_url":"https://api.github.com/users/ZhangYiJiang/followers","following_url":"https://api.github.com/users/ZhangYiJiang/following{/other_user}","gists_url":"https://api.github.com/users/ZhangYiJiang/gists{/gist_id}","starred_url":"https://api.github.com/users/ZhangYiJiang/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/ZhangYiJiang/subscriptions","organizations_url":"https://api.github.com/users/ZhangYiJiang/orgs","repos_url":"https://api.github.com/users/ZhangYiJiang/repos","events_url":"https://api.github.com/users/ZhangYiJiang/events{/privacy}","received_events_url":"https://api.github.com/users/ZhangYiJiang/received_events","type":"User","site_admin":false},"labels":[{"id":127893911,"node_id":"MDU6TGFiZWwxMjc4OTM5MTE=","url":"https://api.github.com/repos/facebook/react/labels/Component:%20DOM","name":"Component: DOM","color":"fef2c0","default":false},{"id":588833528,"node_id":"MDU6TGFiZWw1ODg4MzM1Mjg=","url":"https://api.github.com/repos/facebook/react/labels/Difficulty:%20medium","name":"Difficulty: medium","color":"fbca04","default":false},{"id":40929151,"node_id":"MDU6TGFiZWw0MDkyOTE1MQ==","url":"https://api.github.com/repos/facebook/react/labels/Type:%20Bug","name":"Type: Bug","color":"b60205","default":false},{"id":725156255,"node_id":"MDU6TGFiZWw3MjUxNTYyNTU=","url":"https://api.github.com/repos/facebook/react/labels/good%20first%20issue%20(taken)","name":"good first issue (taken)","color":"b60205","default":false}],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":19,"created_at":"2017-12-22T12:10:29Z","updated_at":"2018-07-12T09:56:24Z","closed_at":null,"author_association":"NONE","body":"<!--\r\n  Note: if the issue is about documentation or the website, please file it at:\r\n  https://github.com/reactjs/reactjs.org/issues/new\r\n-->\r\n\r\n**Do you want to request a *feature* or report a *bug*?** \r\n\r\nBug \r\n\r\n**What is the current behavior?**\r\n\r\nReact DOM crashes when `<option>` contains three interpolated value if one is a conditional. \r\n\r\nReproduction: https://jsfiddle.net/0opjvycp/ \r\n\r\n1. Change the value of the `<select>`\r\n2. React crashes with `NotFoundError: Node was not found` \r\n\r\nFrom what I can tell, the conditional value is necessary, and it must be three interpolated values. \r\n\r\n**What is the expected behavior?**\r\n\r\nReact should not crash. \r\n\r\n**Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React?**\r\n\r\nReact DOM 16.2 and 16.0. I think this worked in 15.6 - https://jsfiddle.net/mrwkmuqc/ does not crash \r\n"},"comment":{"url":"https://api.github.com/repos/facebook/react/issues/comments/404458425","html_url":"https://github.com/facebook/react/issues/11911#issuecomment-404458425","issue_url":"https://api.github.com/repos/facebook/react/issues/11911","id":404458425,"node_id":"MDEyOklzc3VlQ29tbWVudDQwNDQ1ODQyNQ==","user":{"login":"Slowyn","id":7250604,"node_id":"MDQ6VXNlcjcyNTA2MDQ=","avatar_url":"https://avatars0.githubusercontent.com/u/7250604?v=4","gravatar_id":"","url":"https://api.github.com/users/Slowyn","html_url":"https://github.com/Slowyn","followers_url":"https://api.github.com/users/Slowyn/followers","following_url":"https://api.github.com/users/Slowyn/following{/other_user}","gists_url":"https://api.github.com/users/Slowyn/gists{/gist_id}","starred_url":"https://api.github.com/users/Slowyn/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Slowyn/subscriptions","organizations_url":"https://api.github.com/users/Slowyn/orgs","repos_url":"https://api.github.com/users/Slowyn/repos","events_url":"https://api.github.com/users/Slowyn/events{/privacy}","received_events_url":"https://api.github.com/users/Slowyn/received_events","type":"User","site_admin":false},"created_at":"2018-07-12T09:56:24Z","updated_at":"2018-07-12T09:56:24Z","author_association":"NONE","body":"@gaearon Hi Dan!\r\nI did some research and that's what I have at the moment. Basically, I just confirm @kevinzwhuang conclusions.\r\n1. A fiber of text inside of option contains `stateNode` without a parentNode.\r\n2. It happens because of flattening children into an `option`.\r\n3. this bug isn't reproduced if I replace children flattening with filtering an array. But this produce new bugs and tests are failed, so it doesn't fit as a decision.\r\n4. Also, the bug isn't reproduced when you use a construction like this `{condition ? 'renderString' ''}`. I mean if not use `null` or  'false' (`{condition && 'renderString'}`).\r\n\r\nI think the easiest solution would be a changing of flattening (or replacing) in a right way. As I get it an `option` expects one string as a child, but I'm not sure why we need it now when fiber landed 🤔 \r\n\r\nBy the way, it's cool to dip into react sources :)"}}
{"actor":{"display_login":"Slowyn"}}