feat(compass-context-menu): add context menu closing on scroll COMPASS-9471 (#7085)

Author: gagik

packages/compass-context-menu/src/context-menu-provider.tsx

@@ -76,10 +76,14 @@ export function ContextMenuProvider({
 
     document.addEventListener('contextmenu', handleContextMenu);
     window.addEventListener('resize', handleClosingEvent);
+    window.addEventListener('scroll', handleClosingEvent, { capture: true });
 
     return () => {
       document.removeEventListener('contextmenu', handleContextMenu);
       window.removeEventListener('resize', handleClosingEvent);
+      window.removeEventListener('scroll', handleClosingEvent, {
+        capture: true,
+      });
     };
   }, [disabled, handleClosingEvent, parentContext]);
 

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

@@ -263,5 +263,28 @@ describe('useContextMenu', function () {
         expect(() => screen.getByTestId('test-menu')).to.throw;
       });
     });
+
+    describe('menu closing behavior', function () {
+      for (const event of ['scroll', 'resize', 'click']) {
+        it(`closes menu on window ${event} event`, function () {
+          render(
+            <ContextMenuProvider menuWrapper={TestMenu}>
+              <TestComponent />
+            </ContextMenuProvider>
+          );
+
+          const trigger = screen.getByTestId('test-trigger');
+          userEvent.click(trigger, { button: 2 });
+
+          // Verify menu is open
+          expect(screen.getByTestId('menu-item-Test Item')).to.exist;
+
+          window.dispatchEvent(new Event(event));
+
+          // Verify menu is closed
+          expect(() => screen.getByTestId('test-menu')).to.throw;
+        });
+      }
+    });
   });
 });