fixup! Wrap menu providers children in a container

Author: kraenhansen

packages/compass-context-menu/src/use-context-menu.spec.tsx

@@ -158,7 +158,7 @@ describe('useContextMenu', function () {
 
     it('renders without error', function () {
       render(
-        <ContextMenuProvider menuWrapper={TestMenu}>
+        <ContextMenuProvider container={document.body} menuWrapper={TestMenu}>
           <TestComponent />
         </ContextMenuProvider>
       );
@@ -170,7 +170,7 @@ describe('useContextMenu', function () {
       const onRegister = sinon.spy();
 
       render(
-        <ContextMenuProvider menuWrapper={TestMenu}>
+        <ContextMenuProvider container={document.body} menuWrapper={TestMenu}>
           <TestComponent onRegister={onRegister} />
         </ContextMenuProvider>
       );
@@ -181,7 +181,7 @@ describe('useContextMenu', function () {
 
     it('shows context menu on right click', function () {
       render(
-        <ContextMenuProvider menuWrapper={TestMenu}>
+        <ContextMenuProvider container={document.body} menuWrapper={TestMenu}>
           <TestComponent />
         </ContextMenuProvider>
       );
@@ -196,7 +196,7 @@ describe('useContextMenu', function () {
     describe('with nested context menus', function () {
       it('shows only parent items when right clicking parent area', function () {
         render(
-          <ContextMenuProvider menuWrapper={TestMenu}>
+          <ContextMenuProvider container={document.body} menuWrapper={TestMenu}>
             <ParentComponent />
           </ContextMenuProvider>
         );
@@ -215,7 +215,7 @@ describe('useContextMenu', function () {
 
       it('shows both parent and child items when right clicking child area', function () {
         render(
-          <ContextMenuProvider menuWrapper={TestMenu}>
+          <ContextMenuProvider container={document.body} menuWrapper={TestMenu}>
             <ParentComponent>
               <ChildComponent />
             </ParentComponent>
@@ -237,7 +237,7 @@ describe('useContextMenu', function () {
         const childOnAction = sinon.spy();
 
         render(
-          <ContextMenuProvider menuWrapper={TestMenu}>
+          <ContextMenuProvider container={document.body} menuWrapper={TestMenu}>
             <ParentComponent onAction={parentOnAction}>
               <ChildComponent onAction={childOnAction} />
             </ParentComponent>
@@ -260,7 +260,7 @@ describe('useContextMenu', function () {
         const childOnAction = sinon.spy();
 
         render(
-          <ContextMenuProvider menuWrapper={TestMenu}>
+          <ContextMenuProvider container={document.body} menuWrapper={TestMenu}>
             <ParentComponent onAction={parentOnAction}>
               <ChildComponent onAction={childOnAction} />
             </ParentComponent>
@@ -284,6 +284,7 @@ describe('useContextMenu', function () {
 
       render(
         <ContextMenuProvider
+          container={document.body}
           menuWrapper={TestMenu}
           onContextMenuOpen={onContextMenuOpen}
         >
@@ -310,7 +311,10 @@ describe('useContextMenu', function () {
       for (const event of ['scroll', 'resize', 'click']) {
         it(`closes menu on window ${event} event`, function () {
           render(
-            <ContextMenuProvider menuWrapper={TestMenu}>
+            <ContextMenuProvider
+              container={document.body}
+              menuWrapper={TestMenu}
+            >
               <TestComponent />
             </ContextMenuProvider>
           );