{"action":"created","issue":{"url":"https://api.github.com/repos/facebook/react/issues/7359","repository_url":"https://api.github.com/repos/facebook/react","labels_url":"https://api.github.com/repos/facebook/react/issues/7359/labels{/name}","comments_url":"https://api.github.com/repos/facebook/react/issues/7359/comments","events_url":"https://api.github.com/repos/facebook/react/issues/7359/events","html_url":"https://github.com/facebook/react/pull/7359","id":167747513,"number":7359,"title":"Fix Chrome number input backspace and invalid input issue","user":{"login":"nhunzaker","id":590904,"avatar_url":"https://avatars.githubusercontent.com/u/590904?v=3","gravatar_id":"","url":"https://api.github.com/users/nhunzaker","html_url":"https://github.com/nhunzaker","followers_url":"https://api.github.com/users/nhunzaker/followers","following_url":"https://api.github.com/users/nhunzaker/following{/other_user}","gists_url":"https://api.github.com/users/nhunzaker/gists{/gist_id}","starred_url":"https://api.github.com/users/nhunzaker/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/nhunzaker/subscriptions","organizations_url":"https://api.github.com/users/nhunzaker/orgs","repos_url":"https://api.github.com/users/nhunzaker/repos","events_url":"https://api.github.com/users/nhunzaker/events{/privacy}","received_events_url":"https://api.github.com/users/nhunzaker/received_events","type":"User","site_admin":false},"labels":[{"id":196858374,"url":"https://api.github.com/repos/facebook/react/labels/CLA%20Signed","name":"CLA Signed","color":"e7e7e7","default":false},{"id":127893911,"url":"https://api.github.com/repos/facebook/react/labels/Component:%20DOM","name":"Component: DOM","color":"fef2c0","default":false},{"id":130714623,"url":"https://api.github.com/repos/facebook/react/labels/GH%20Review:%20review-needed","name":"GH Review: review-needed","color":"fbca04","default":false}],"state":"open","locked":false,"assignee":{"login":"Aweary","id":6886061,"avatar_url":"https://avatars.githubusercontent.com/u/6886061?v=3","gravatar_id":"","url":"https://api.github.com/users/Aweary","html_url":"https://github.com/Aweary","followers_url":"https://api.github.com/users/Aweary/followers","following_url":"https://api.github.com/users/Aweary/following{/other_user}","gists_url":"https://api.github.com/users/Aweary/gists{/gist_id}","starred_url":"https://api.github.com/users/Aweary/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Aweary/subscriptions","organizations_url":"https://api.github.com/users/Aweary/orgs","repos_url":"https://api.github.com/users/Aweary/repos","events_url":"https://api.github.com/users/Aweary/events{/privacy}","received_events_url":"https://api.github.com/users/Aweary/received_events","type":"User","site_admin":false},"assignees":[{"login":"Aweary","id":6886061,"avatar_url":"https://avatars.githubusercontent.com/u/6886061?v=3","gravatar_id":"","url":"https://api.github.com/users/Aweary","html_url":"https://github.com/Aweary","followers_url":"https://api.github.com/users/Aweary/followers","following_url":"https://api.github.com/users/Aweary/following{/other_user}","gists_url":"https://api.github.com/users/Aweary/gists{/gist_id}","starred_url":"https://api.github.com/users/Aweary/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Aweary/subscriptions","organizations_url":"https://api.github.com/users/Aweary/orgs","repos_url":"https://api.github.com/users/Aweary/repos","events_url":"https://api.github.com/users/Aweary/events{/privacy}","received_events_url":"https://api.github.com/users/Aweary/received_events","type":"User","site_admin":false}],"milestone":null,"comments":60,"created_at":"2016-07-27T01:15:46Z","updated_at":"2016-12-14T23:37:59Z","closed_at":null,"pull_request":{"url":"https://api.github.com/repos/facebook/react/pulls/7359","html_url":"https://github.com/facebook/react/pull/7359","diff_url":"https://github.com/facebook/react/pull/7359.diff","patch_url":"https://github.com/facebook/react/pull/7359.patch"},"body":"In Google Chrome, backspacing an controlled and uncontrolled number inputs causes an unexpected behavior:\n\n![backspace](https://cloud.githubusercontent.com/assets/590904/17160637/6dfbca3a-5374-11e6-9a0d-0a2c52813eea.gif)\n\nMore cases (and what fixes look like) here: https://github.com/facebook/react/issues/7253#issuecomment-236074326\n## Issues with uncontrolled inputs\n\nThis is because assigning `defaultValue` causes side-effects on `value`. It seems to trigger validation on `value` as if it were directly assigned itself. \n\nThis Codepen provides a step by step reproduction case:\n\nhttp://codepen.io/nhunzaker/pen/zBaokp\n\n![wat](https://cloud.githubusercontent.com/assets/590904/17160341/4d3acf64-5372-11e6-9871-64c6063b23b0.gif)\n\nThis PR wraps the `defaultValue` assignment in a conditional so that it will only ever be assigned if the defaultValue has changed.\n## Issues with controlled inputs\n\nIt looks like the issue here is that value is being assigned using the standard React method of updating attributes when the props get passed in here:\n\nhttps://github.com/facebook/react/blob/master/src/renderers/dom/shared/ReactDOMComponent.js#L926\n\nThere is some logic in ReactDOMInput to prevent duplicate values from being assigned here:\n\nhttps://github.com/facebook/react/blob/master/src/renderers/dom/client/wrappers/ReactDOMInput.js#L201-L210\n\nUnfortunately the new value has already been assigned.\n\nThis PR adds a check for the `value` prop, and only assigns it if is different. It never assigns the value attribute if it hasn't changed:\n\nI don't really know why this works. I didn't think node.setAttribute('value', value) was meaningful. What do you think?\n\n---\n\nRelated to https://github.com/facebook/react/issues/7253\n"},"comment":{"url":"https://api.github.com/repos/facebook/react/issues/comments/267191214","html_url":"https://github.com/facebook/react/pull/7359#issuecomment-267191214","issue_url":"https://api.github.com/repos/facebook/react/issues/7359","id":267191214,"user":{"login":"nhunzaker","id":590904,"avatar_url":"https://avatars.githubusercontent.com/u/590904?v=3","gravatar_id":"","url":"https://api.github.com/users/nhunzaker","html_url":"https://github.com/nhunzaker","followers_url":"https://api.github.com/users/nhunzaker/followers","following_url":"https://api.github.com/users/nhunzaker/following{/other_user}","gists_url":"https://api.github.com/users/nhunzaker/gists{/gist_id}","starred_url":"https://api.github.com/users/nhunzaker/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/nhunzaker/subscriptions","organizations_url":"https://api.github.com/users/nhunzaker/orgs","repos_url":"https://api.github.com/users/nhunzaker/repos","events_url":"https://api.github.com/users/nhunzaker/events{/privacy}","received_events_url":"https://api.github.com/users/nhunzaker/received_events","type":"User","site_admin":false},"created_at":"2016-12-14T23:37:59Z","updated_at":"2016-12-14T23:37:59Z","body":"I just confirmed that my `onBlur` handler approach is no longer valid with the new way event handlers are called in React (which is a super cool change, just unfortunate for me).\r\n\r\nI've pushed a few tests. The build fails, as it should. I like the technique of listening to onBlur, in principle. Now to just figure out how to apply it."}}
{"actor":{"display_login":"nhunzaker"}}