diff --git a/packages/components/src/dropdown/__tests__/Dropdown.test.tsx b/packages/components/src/dropdown/__tests__/Dropdown.test.tsx
index ed0174a1..f0de2378 100644
--- a/packages/components/src/dropdown/__tests__/Dropdown.test.tsx
+++ b/packages/components/src/dropdown/__tests__/Dropdown.test.tsx
@@ -207,4 +207,42 @@ describe('Dropdown', () => {
expect(onSelect).not.toBeCalled();
expect(balloon).toMatchSnapshot();
});
+ it('修复测试 在鼠标右击启动的情况下,点击选项关闭窗体后无法再次鼠标右击开启 #79', () => {
+ jest.useFakeTimers();
+ const options: DropdownOptionsItem[] = [
+ { label: '黄金蛋炒饭', key: '1' },
+ { label: '扬州炒饭', key: '2' },
+ ];
+ const { container } = render(
+
+ foo bar
+ ,
+ );
+
+ expect(getBalloon()).toBeNull();
+
+ // 第一步:开启
+ fireEvent.contextMenu(container.firstChild!);
+ act(() => jest.advanceTimersByTime(500));
+ act(() => jest.advanceTimersByTime(500));
+ expect(getBalloon()).not.toBeNull();
+ expect(getBalloon()).not.toHaveClass('t-transition--invisible');
+
+ // 第二步:点击选项
+ fireEvent.click(document.querySelector('.t-dropdown-option')!);
+ act(() => jest.advanceTimersByTime(500));
+ act(() => jest.advanceTimersByTime(500));
+ expect(getBalloon()).toHaveClass('t-transition--invisible');
+
+ // 第三步:再次开启
+ fireEvent.contextMenu(container.firstChild!);
+ act(() => jest.advanceTimersByTime(500));
+ act(() => jest.advanceTimersByTime(500));
+ // bug 所在
+ expect(getBalloon()).not.toHaveClass('t-transition--invisible');
+
+ function getBalloon(): HTMLDivElement | null {
+ return document.querySelector('.t-word-balloon');
+ }
+ });
});
diff --git a/packages/components/src/popover/Contextmenu.tsx b/packages/components/src/popover/Contextmenu.tsx
index 7397deb0..499ac56d 100644
--- a/packages/components/src/popover/Contextmenu.tsx
+++ b/packages/components/src/popover/Contextmenu.tsx
@@ -1,19 +1,23 @@
import { getComponentClass, useForceUpdate, useNextEffect } from '@pkg/shared';
import type { PopoverProps } from './popover.types';
import { getClassNames } from '@tool-pack/basic';
+import React, { useEffect, useRef } from 'react';
import { createPortal } from 'react-dom';
-import React, { useRef } from 'react';
import { Popover } from './Popover';
const rootClass = getComponentClass('popover');
export const Contextmenu: React.FC = (props) => {
- const { onVisibleChange, trigger: _, children, ...rest } = props;
+ const { onVisibleChange, trigger: _, children, visible, ...rest } = props;
const triggerRef = useRef(null);
const visibleRef = useRef(false);
const nextEffect = useNextEffect();
const forceUpdate = useForceUpdate();
+ useEffect(() => {
+ if (visible === false) visibleRef.current = false;
+ }, [visible]);
+
return (
<>
{React.cloneElement(
@@ -22,7 +26,12 @@ export const Contextmenu: React.FC = (props) => {
children.props.children,
)}
{createPortal(
-
+