diff --git a/components/dropdown/__tests__/dropdown-button.test.tsx b/components/dropdown/__tests__/dropdown-button.test.tsx
index c4e769ac3d..040d7a4bd5 100644
--- a/components/dropdown/__tests__/dropdown-button.test.tsx
+++ b/components/dropdown/__tests__/dropdown-button.test.tsx
@@ -1,7 +1,7 @@
import React from 'react';
import mountTest from '../../../tests/shared/mountTest';
import rtlTest from '../../../tests/shared/rtlTest';
-import { render } from '../../../tests/utils';
+import { render, waitFakeTimer } from '../../../tests/utils';
import type { DropdownProps } from '../dropdown';
import DropdownButton from '../dropdown-button';
@@ -156,4 +156,17 @@ describe('DropdownButton', () => {
render();
expect(dropdownRender).toHaveBeenCalled();
});
+
+ it('should support focus menu when set autoFocus', async () => {
+ jest.useFakeTimers();
+ const items = [
+ {
+ label: 'foo',
+ key: '1',
+ },
+ ];
+ const { container } = render();
+ await waitFakeTimer();
+ expect(container.querySelector('.ant-dropdown-menu-item-active')).toBeTruthy();
+ });
});
diff --git a/components/dropdown/dropdown.tsx b/components/dropdown/dropdown.tsx
index eecd78ae12..eb3e18e80c 100644
--- a/components/dropdown/dropdown.tsx
+++ b/components/dropdown/dropdown.tsx
@@ -14,7 +14,6 @@ import { ConfigContext } from '../config-provider';
import type { MenuProps } from '../menu';
import Menu from '../menu';
import { OverrideProvider } from '../menu/OverrideContext';
-import { NoCompactStyle } from '../space/Compact';
import theme from '../theme';
import useStyle from './style';
@@ -274,7 +273,7 @@ const Dropdown: CompoundedComponent = (props) => {
);
}}
>
- {overlayNode}
+ {overlayNode}
);
};
diff --git a/components/menu/OverrideContext.tsx b/components/menu/OverrideContext.tsx
index ba663f69f5..bec81a456b 100644
--- a/components/menu/OverrideContext.tsx
+++ b/components/menu/OverrideContext.tsx
@@ -1,4 +1,5 @@
import * as React from 'react';
+import { NoCompactStyle } from '../space/Compact';
import type { MenuProps } from './menu';
// Used for Dropdown only
@@ -14,9 +15,10 @@ export interface OverrideContextProps {
const OverrideContext = React.createContext(null);
/** @internal Only used for Dropdown component. Do not use this in your production. */
-export const OverrideProvider: React.FC = (
- props,
-) => {
+export const OverrideProvider = React.forwardRef<
+ HTMLElement,
+ OverrideContextProps & { children: React.ReactNode }
+>((props, ref) => {
const { children, ...restProps } = props;
const override = React.useContext(OverrideContext);
@@ -32,8 +34,12 @@ export const OverrideProvider: React.FC{children};
-};
+ return (
+
+ {React.cloneElement(children as React.ReactElement, { ref })}
+
+ );
+});
/** @internal Only used for Dropdown component. Do not use this in your production. */
export default OverrideContext;