@@ -1625,15 +1625,39 @@ describe('ReactDOMInput', () => {
16251625 const originalCreateElement = document . createElement ;
16261626 spyOnDevAndProd ( document , 'createElement' ) . and . callFake ( function ( type ) {
16271627 const el = originalCreateElement . apply ( this , arguments ) ;
1628- let value = '' ;
1628+ const getDefaultValue = Object . getOwnPropertyDescriptor (
1629+ HTMLInputElement . prototype ,
1630+ 'defaultValue' ,
1631+ ) . get ;
1632+ const getValue = Object . getOwnPropertyDescriptor (
1633+ HTMLInputElement . prototype ,
1634+ 'value' ,
1635+ ) . get ;
1636+ const setDefaultValue = Object . getOwnPropertyDescriptor (
1637+ HTMLInputElement . prototype ,
1638+ 'defaultValue' ,
1639+ ) . set ;
1640+ const setValue = Object . getOwnPropertyDescriptor (
1641+ HTMLInputElement . prototype ,
1642+ 'value' ,
1643+ ) . set ;
16291644 if ( type === 'input' ) {
1645+ Object . defineProperty ( el , 'defaultValue' , {
1646+ get : function ( ) {
1647+ return getDefaultValue . call ( this ) ;
1648+ } ,
1649+ set : function ( val ) {
1650+ log . push ( `node.defaultValue = ${ strify ( val ) } ` ) ;
1651+ setDefaultValue . call ( this , val ) ;
1652+ } ,
1653+ } ) ;
16301654 Object . defineProperty ( el , 'value' , {
16311655 get : function ( ) {
1632- return value ;
1656+ return getValue . call ( this ) ;
16331657 } ,
16341658 set : function ( val ) {
1635- value = '' + val ;
16361659 log . push ( `node.value = ${ strify ( val ) } ` ) ;
1660+ setValue . call ( this , val ) ;
16371661 } ,
16381662 } ) ;
16391663 spyOnDevAndProd ( el , 'setAttribute' ) . and . callFake ( function ( name , val ) {
@@ -1648,12 +1672,18 @@ describe('ReactDOMInput', () => {
16481672 if ( disableInputAttributeSyncing ) {
16491673 expect ( log ) . toEqual ( [
16501674 'node.setAttribute("type", "date")' ,
1651- 'node.setAttribute("value", "1980-01-01")' ,
1675+ 'node.defaultValue = "1980-01-01"' ,
1676+ // TODO: it's possible this reintroduces the bug because we don't assign `value` at all.
1677+ // Need to check this on mobile Safari and Chrome.
16521678 ] ) ;
16531679 } else {
16541680 expect ( log ) . toEqual ( [
16551681 'node.setAttribute("type", "date")' ,
1682+ // value must be assigned before defaultValue. This fixes an issue where the
1683+ // visually displayed value of date inputs disappears on mobile Safari and Chrome:
1684+ // https://github.com/facebook/react/issues/7233
16561685 'node.value = "1980-01-01"' ,
1686+ 'node.defaultValue = "1980-01-01"' ,
16571687 ] ) ;
16581688 }
16591689 } ) ;
0 commit comments