diff --git a/packages/react/src/components/OverflowMenu/OverflowMenu-test.js b/packages/react/src/components/OverflowMenu/OverflowMenu-test.js
index 46eec3e5834d..daa44bb499d1 100644
--- a/packages/react/src/components/OverflowMenu/OverflowMenu-test.js
+++ b/packages/react/src/components/OverflowMenu/OverflowMenu-test.js
@@ -10,7 +10,7 @@ import OverflowMenu from './OverflowMenu';
import OverflowMenuItem from '../OverflowMenuItem';
import { Filter } from '@carbon/icons-react';
import userEvent from '@testing-library/user-event';
-import { render, screen } from '@testing-library/react';
+import { render, screen, fireEvent } from '@testing-library/react';
describe('OverflowMenu', () => {
describe('Renders as expected', () => {
@@ -171,5 +171,29 @@ describe('OverflowMenu', () => {
'true'
);
});
+
+ it('should call onClick handler only once per click', async () => {
+ const handleClick = jest.fn();
+
+ render(
+
+
+
+
+ );
+
+ // Find the OverflowMenu button
+ const button = screen.getByRole('button');
+
+ // Click the OverflowMenu button
+ await userEvent.click(button);
+
+ // Check that the click handler was called only once
+ expect(handleClick).toHaveBeenCalledTimes(1);
+ });
});
});
diff --git a/packages/react/src/components/OverflowMenu/OverflowMenu.tsx b/packages/react/src/components/OverflowMenu/OverflowMenu.tsx
index 157a976655de..b6ee30ccddb3 100644
--- a/packages/react/src/components/OverflowMenu/OverflowMenu.tsx
+++ b/packages/react/src/components/OverflowMenu/OverflowMenu.tsx
@@ -439,7 +439,6 @@ class OverflowMenu extends React.Component<
handleClick = (evt) => {
const { onClick = noopFn } = this.props;
this.setState({ click: true });
- evt.stopPropagation();
if (!this._menuBody || !this._menuBody.contains(evt.target)) {
this.setState({ open: !this.state.open });
onClick(evt);
diff --git a/packages/react/src/components/Popover/Popover.stories.js b/packages/react/src/components/Popover/Popover.stories.js
index 1285cf930f7a..f32b32e60068 100644
--- a/packages/react/src/components/Popover/Popover.stories.js
+++ b/packages/react/src/components/Popover/Popover.stories.js
@@ -15,6 +15,8 @@ import { default as Checkbox } from '../Checkbox';
import mdx from './Popover.mdx';
import { Settings } from '@carbon/icons-react';
import { keys, match } from '../../internal/keyboard';
+import OverflowMenu from '../OverflowMenu/OverflowMenu';
+import OverflowMenuItem from '../OverflowMenuItem';
const prefix = 'cds';
@@ -267,6 +269,67 @@ export const ExperimentalAutoAlign = () => {
);
};
+export const Test = () => {
+ const [open, setOpen] = useState();
+ const align = document?.dir === 'rtl' ? 'bottom-right' : 'bottom-left';
+ const alignTwo = document?.dir === 'rtl' ? 'bottom-left' : 'bottom-right';
+ return (
+
+
+
+
+
+
+
+
+
+
+
{
+ if (match(evt, keys.Escape)) {
+ setOpen(false);
+ }
+ }}
+ isTabTip
+ onRequestClose={() => setOpen(false)}>
+
+
+
+
+
+
+
+
+
+
+
+ );
+};
export const TabTipExperimentalAutoAlign = () => {
const [open, setOpen] = useState(true);