Skip to content

Commit f818af9

Browse files
authored
[Fresh] Always remount classes (#16823)
1 parent 6ecfa90 commit f818af9

File tree

2 files changed

+52
-1
lines changed

2 files changed

+52
-1
lines changed

packages/react-reconciler/src/ReactFiberHotReloading.js

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -296,7 +296,11 @@ function scheduleFibersWithFamiliesRecursively(
296296
if (staleFamilies.has(family)) {
297297
needsRemount = true;
298298
} else if (updatedFamilies.has(family)) {
299-
needsRender = true;
299+
if (tag === ClassComponent) {
300+
needsRemount = true;
301+
} else {
302+
needsRender = true;
303+
}
300304
}
301305
}
302306
}

packages/react-refresh/src/__tests__/ReactFreshIntegration-test.js

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1299,6 +1299,53 @@ describe('ReactFreshIntegration', () => {
12991299
}
13001300
});
13011301

1302+
it('remounts deprecated factory components', () => {
1303+
if (__DEV__) {
1304+
expect(() => {
1305+
render(`
1306+
function Parent() {
1307+
return {
1308+
render() {
1309+
return <Child prop="A" />;
1310+
}
1311+
};
1312+
};
1313+
1314+
function Child({prop}) {
1315+
return <h1>{prop}1</h1>;
1316+
};
1317+
1318+
export default Parent;
1319+
`);
1320+
}).toWarnDev(
1321+
'The <Parent /> component appears to be a function component ' +
1322+
'that returns a class instance.',
1323+
{withoutStack: true},
1324+
);
1325+
const el = container.firstChild;
1326+
expect(el.textContent).toBe('A1');
1327+
patch(`
1328+
function Parent() {
1329+
return {
1330+
render() {
1331+
return <Child prop="B" />;
1332+
}
1333+
};
1334+
};
1335+
1336+
function Child({prop}) {
1337+
return <h1>{prop}2</h1>;
1338+
};
1339+
1340+
export default Parent;
1341+
`);
1342+
// Like classes, factory components always remount.
1343+
expect(container.firstChild).not.toBe(el);
1344+
const newEl = container.firstChild;
1345+
expect(newEl.textContent).toBe('B2');
1346+
}
1347+
});
1348+
13021349
describe('with inline requires', () => {
13031350
beforeEach(() => {
13041351
global.FakeModuleSystem = {};

0 commit comments

Comments
 (0)