File tree Expand file tree Collapse file tree
packages/react-dom/src/__tests__ Expand file tree Collapse file tree Original file line number Diff line number Diff line change @@ -1280,4 +1280,40 @@ describe('ReactDOMFiber', () => {
12801280 ) ;
12811281 expect ( didCallOnChange ) . toBe ( true ) ;
12821282 } ) ;
1283+
1284+ it ( 'unmounted legacy roots should never clear newer root content from a container' , ( ) => {
1285+ const ref = React . createRef ( ) ;
1286+
1287+ function OldApp ( ) {
1288+ const hideOnFocus = ( ) => {
1289+ // This app unmounts itself inside of a focus event.
1290+ ReactDOM . unmountComponentAtNode ( container ) ;
1291+ } ;
1292+
1293+ return (
1294+ < button onFocus = { hideOnFocus } ref = { ref } >
1295+ old
1296+ </ button >
1297+ ) ;
1298+ }
1299+
1300+ function NewApp ( ) {
1301+ return (
1302+ < button tabIndex = { 0 } ref = { ref } >
1303+ new
1304+ </ button >
1305+ ) ;
1306+ }
1307+
1308+ ReactDOM . render ( < OldApp /> , container ) ;
1309+ ref . current . focus ( ) ;
1310+
1311+ ReactDOM . render ( < NewApp /> , container ) ;
1312+
1313+ // Calling focus again will flush previously scheduled discerete work for the old root-
1314+ // but this should not clear out the newly mounted app.
1315+ ref . current . focus ( ) ;
1316+
1317+ expect ( container . textContent ) . toBe ( 'new' ) ;
1318+ } ) ;
12831319} ) ;
You can’t perform that action at this time.
0 commit comments