cursor[bot] 11cc766dfa [MM-69726] Fix Message actions menu displaying off screen in narrow display (#37396)
* [MM-69726] Fix Message actions menu rendering off screen in narrow view

In mobile/single-column view the post Message actions menu renders as a
full-screen fixed overlay. Because posts live inside the virtualized post
list, whose `will-change: transform` establishes a containing block for
fixed-position descendants, the overlay anchored to the scrolled post list
content instead of the viewport. For longer channels/threads this pushed the
menu off screen (to the top of the message pane) so it appeared to do nothing.

Portal the mobile Message actions menu to document.body so its fixed overlay
is positioned relative to the viewport, and extend the mobile overlay styles
to the portaled container.

Co-authored-by: mattermost-code <matty-code@mattermost.com>

* [MM-69726] Keep portaled Message actions menu open until item click resolves

The mobile Message actions menu is portaled to the body, so it lives outside
the MenuWrapper node in the DOM. MenuWrapper's capture-phase blur handler
treated clicks inside the portaled menu as outside clicks and closed the menu
before the item's onClick fired (synchronously under the legacy React root),
so selecting an item did nothing. Mark the portal and skip blur-close for
clicks inside it.

Co-authored-by: mattermost-code <matty-code@mattermost.com>

* [MM-69726] Add tests for portaled mobile Message actions menu

Cover that the ActionsMenu portals its menu to the body in mobile view and
renders inline on desktop, and that MenuWrapper's blur handling keeps a
portaled menu open while still closing on genuine outside clicks.

Co-authored-by: mattermost-code <matty-code@mattermost.com>

* [MM-69726] Add integration coverage for portaled menu item clicks

Add a test that clicking an item in the portaled mobile Message actions menu
runs its action (the exact behavior the blur-handler fix restored), and a TAB
keyboard test mirroring the click-based portal exception.

Co-authored-by: mattermost-code <matty-code@mattermost.com>

* [MM-69726] Clarify portaled menu item test name

Co-authored-by: mattermost-code <matty-code@mattermost.com>

* [MM-69726] Fix import order in actions_menu test

Co-authored-by: mattermost-code <matty-code@mattermost.com>

* [MM-69726] Move portaled-menu blur handling out of generic MenuWrapper

Replace the hardcoded [data-menu-portal] selector in MenuWrapper.closeOnBlur
with a generic, opt-in portalNodeRef prop. ActionsMenu now owns the portal
detail and passes its portal node ref, keeping the generic (deprecated) widget
free of consumer-specific conditions.

* [MM-69726] Satisfy jsx-max-props-per-line in menu wrapper test

---------

Co-authored-by: Cursor Agent <cursoragent@cursor.com>
Co-authored-by: mattermost-code <matty-code@mattermost.com>
2026-08-11 15:29:01 -04:00
2018-05-30 10:23:25 -04:00
2026-04-01 13:03:36 +00:00

Mattermost logo

Mattermost is an open core, self-hosted collaboration platform that offers chat, workflow automation, voice calling, screen sharing, and AI integration. This repo is the primary source for core development on the Mattermost platform; it's written in Go and React, runs as a single Linux binary, and relies on PostgreSQL. A new compiled version is released under an MIT license every month on the 16th.

Deploy Mattermost on-premises, or try it for free in the cloud.

mattermost user interface

Learn more about the following use cases with Mattermost:

Other useful resources:

Table of contents

Install Mattermost

Other install guides:

Native mobile and desktop apps

In addition to the web interface, you can also download Mattermost clients for Android, iOS, Windows PC, macOS, and Linux.

Get Mattermost on Google Play Get Mattermost on the App Store Get Mattermost on Windows PC Get Mattermost on Mac OSX Get Mattermost on Linux

Get security bulletins

Receive notifications of critical security updates. The sophistication of online attackers is perpetually increasing. If you're deploying Mattermost it's highly recommended you subscribe to the Mattermost Security Bulletin mailing list for updates on critical security releases.

Subscribe here

Get involved

Learn more

License

See the LICENSE file for license rights and limitations.

Get the latest news

Contributing

Small Image

Please see CONTRIBUTING.md. Join the Mattermost Contributors server to join community discussions about contributions, development, and more.

S
Description
Mattermost is an open source platform for secure collaboration across the entire software development lifecycle..
Readme 2.4 GiB
Languages
TypeScript 48.2%
Go 41.4%
JavaScript 5.4%
SCSS 2.6%
HTML 2.1%
Other 0.2%