fix: scrolling the context menu shouldn't close it COMPASS-9584

[paula-stacho]

Description

stopPropagation doesn't work because the eventListener on window gets triggered first due to the capture option. I assume the capture was intentional and shouldn't be removed (correct me if I'm wrong @gagik ), but it's okay because we can just do this - ignore based on the target.

Screen.Recording.2025-08-06.at.22.49.15.mov

Checklist

• New tests and/or benchmarks are included
• Documentation is changed or added
• If this change updates the UI, screenshots/videos are added and a design review is requested
• I have signed the MongoDB Contributor License Agreement (https://www.mongodb.com/legal/contributor-agreement)

Motivation and Context

• Bugfix
• New feature
• Dependency update
• Misc

Open Questions

Dependents

Types of changes

• Backport Needed
• Patch (non-breaking change which fixes an issue)
• Minor (non-breaking change which adds functionality)
• Major (fix or feature that would cause existing functionality to change)

[Copilot]

Pull Request Overview

This PR fixes an issue where scrolling within a context menu would incorrectly close the menu. The fix involves checking if the scroll event originates from within the context menu itself before closing it.

• Adds a CSS class name constant for identifying context menu elements
• Modifies the scroll event handler to ignore scroll events from within the context menu
• Applies the CSS class to the context menu component for identification

Reviewed Changes

Copilot reviewed 4 out of 4 changed files in this pull request and generated 1 comment.

File	Description
packages/compass-context-menu/src/index.ts	Exports the new contextMenuClassName constant
packages/compass-context-menu/src/context-menu-provider.tsx	Updates scroll event handler to check if scroll target is within context menu
packages/compass-context-menu/src/consts.ts	Defines the contextMenuClassName constant
packages/compass-components/src/components/context-menu.tsx	Applies the contextMenuClassName to the menu component

[Copilot]

The check only verifies if the direct target has the contextMenuClassName. Consider using element.closest() to check if the scroll target is within any ancestor element that has the contextMenuClassName, as scroll events might originate from child elements within the context menu.

Suggested change

	e.target.classList.contains(contextMenuClassName);
	e.target.closest('.' + contextMenuClassName);

[codeowners-service-app]

Assigned himanshusinghs for team compass-developers because gagik is out of office.

[gagik]

Yeah the capture was intentional because we generally want to close the right click menu whenever it gets scrolled on any other item. Otherwise it'd end up floating awkwardly as you scroll.

[gagik]

Seems reasonable to me! Thanks for looking into it.