Fix Popper-related tests

mui · Apr 25, 2024 · 1c02cca · 1c02cca
1 parent f918897
commit 1c02cca
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 10 deletions.
diff --git a/packages/mui-base/src/Menu/Menu.test.tsx b/packages/mui-base/src/Menu/Menu.test.tsx
@@ -17,6 +17,12 @@ import { Popper } from '@base_ui/react/Popper';
 import { MenuProvider, useMenu } from '@base_ui/react/useMenu';
 import { describeConformanceUnstyled } from '../../test/describeConformanceUnstyled';
 
+function createAnchor() {
+  const anchor = document.createElement('div');
+  document.body.appendChild(anchor);
+  return anchor;
+}
+
 const testContext: DropdownContextValue = {
   dispatch: () => {},
   popupId: 'menu-popup',
@@ -158,7 +164,7 @@ describe('<Menu />', () => {
           disabledItemsFocusable: false,
         });
 
-        const anchorEl = triggerElement ?? document.createElement('div');
+        const anchorEl = triggerElement ?? createAnchor();
 
         return (
           <Popper open={open} anchorEl={anchorEl}>

diff --git a/packages/mui-base/src/Popper/Popper.test.tsx b/packages/mui-base/src/Popper/Popper.test.tsx
@@ -4,12 +4,18 @@ import { createRenderer, createMount, screen } from '@mui/internal-test-utils';
 import { Popper, popperClasses } from '@base_ui/react/Popper';
 import { describeConformanceUnstyled } from '../../test/describeConformanceUnstyled';
 
+function createAnchor() {
+  const anchor = document.createElement('div');
+  document.body.appendChild(anchor);
+  return anchor;
+}
+
 describe('<Popper />', () => {
   const { render } = createRenderer();
   const mount = createMount();
 
   const defaultProps = {
-    anchorEl: () => document.createElement('svg'),
+    anchorEl: () => createAnchor(),
     children: <span>Hello World</span>,
     open: true,
   };
@@ -35,13 +41,7 @@ describe('<Popper />', () => {
     const CustomComponent = React.forwardRef<HTMLDivElement, any>(({ ownerState }, ref) => (
       <div ref={ref} data-testid="foo" id={ownerState.id} />
     ));
-    render(
-      <Popper
-        anchorEl={() => document.createElement('div')}
-        open
-        slots={{ root: CustomComponent }}
-      />,
-    );
+    render(<Popper anchorEl={() => createAnchor()} open slots={{ root: CustomComponent }} />);
 
     expect(screen.getByTestId('foo')).to.not.have.attribute('id', 'id');
   });

diff --git a/packages/mui-base/src/Unstable_Popup/Popup.test.tsx b/packages/mui-base/src/Unstable_Popup/Popup.test.tsx
@@ -8,6 +8,12 @@ import { describeConformanceUnstyled } from '../../test/describeConformanceUnsty
 
 const TRANSITION_DURATION = 100;
 
+function createAnchor() {
+  const anchor = document.createElement('div');
+  document.body.appendChild(anchor);
+  return anchor;
+}
+
 function FakeTransition(props: React.PropsWithChildren<{}>) {
   const { children: transitionChildren } = props;
   const { requestedEnter, onExited } = useTransitionStateManager();
@@ -45,7 +51,7 @@ describe('<Popup />', () => {
   }
 
   const defaultProps: PopupProps = {
-    anchor: () => document.createElement('div'),
+    anchor: () => createAnchor(),
     children: <span>Hello World</span>,
     open: true,
   };