Skip to content

Commit 438bdec

Browse files
authored
fix: Menu defaultOpenKeys not work in React18 (#502)
* fix: Menu defaultOpenKeys not work in React18 * fix: mount check logic
1 parent 5100a57 commit 438bdec

File tree

2 files changed

+67
-1
lines changed

2 files changed

+67
-1
lines changed

Diff for: src/Menu.tsx

+8-1
Original file line numberDiff line numberDiff line change
@@ -293,7 +293,6 @@ const Menu = React.forwardRef<MenuRef, MenuProps>((props, ref) => {
293293
// Restore
294294
React.useEffect(() => {
295295
if (!mountRef.current) {
296-
mountRef.current = true;
297296
return;
298297
}
299298

@@ -305,6 +304,14 @@ const Menu = React.forwardRef<MenuRef, MenuProps>((props, ref) => {
305304
}
306305
}, [isInlineMode]);
307306

307+
React.useEffect(() => {
308+
mountRef.current = true;
309+
310+
return () => {
311+
mountRef.current = false;
312+
};
313+
}, []);
314+
308315
// ========================= Path =========================
309316
const {
310317
registerPath,

Diff for: tests/React18.spec.tsx

+59
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
/* eslint-disable no-undef */
2+
import React from 'react';
3+
import { act, render } from '@testing-library/react';
4+
import Menu, { MenuItem, SubMenu } from '../src';
5+
import type { MenuProps } from '../src';
6+
7+
describe('React18', () => {
8+
function runAllTimer() {
9+
for (let i = 0; i < 10; i += 1) {
10+
act(() => {
11+
jest.runAllTimers();
12+
});
13+
}
14+
}
15+
16+
beforeEach(() => {
17+
jest.useFakeTimers();
18+
});
19+
20+
afterEach(() => {
21+
jest.useRealTimers();
22+
});
23+
24+
function createMenu(props?: MenuProps) {
25+
return (
26+
<React.StrictMode>
27+
<Menu {...props}>
28+
<SubMenu key="s1" title="submenu1">
29+
<MenuItem key="s1-1">1</MenuItem>
30+
<SubMenu key="s1-2" title="submenu1-1">
31+
<MenuItem key="s1-2-1">2</MenuItem>
32+
</SubMenu>
33+
</SubMenu>
34+
<SubMenu key="s2" title="submenu2">
35+
<MenuItem key="s2-2">2</MenuItem>
36+
</SubMenu>
37+
</Menu>
38+
</React.StrictMode>
39+
);
40+
}
41+
42+
it("don't show submenu when disabled", () => {
43+
const { container } = render(
44+
createMenu({
45+
defaultOpenKeys: ['s1'],
46+
mode: 'horizontal',
47+
}),
48+
);
49+
50+
runAllTimer();
51+
52+
expect(
53+
container
54+
.querySelector('.rc-menu-submenu-open')
55+
.querySelector('.rc-menu-submenu-title').textContent,
56+
).toEqual('submenu1');
57+
});
58+
});
59+
/* eslint-enable */

0 commit comments

Comments
 (0)