Fix: prevent keyup propagation from Monaco editor triggering false dirty state (#1495)

[kiyotaka-hibino]

Fixes #1495

Summary

On macOS, pressing the Command key alone while focused on the backend Code Editor (Monaco Editor) incorrectly marks the form as "dirty" (unsaved changes), even though no content was edited.

Root cause

keyup events fired inside the Monaco Editor's DOM node bubble up and are captured by jQuery, which triggers the backend form's dirty-state handler.

Fix

Stop the propagation of keyup events at the editor's DOM node level. This prevents unrelated key events (such as pressing Command alone) from reaching the form's dirty-state handler, while actual content edits still flow through Monaco's onDidChangeContent event as before:
Monaco model change → CodeEditor input event → Winter CMS dirty state

Testing

• Confirmed pressing Command alone no longer marks the field as dirty (macOS, Safari & Chrome)
• Confirmed actual content edits still correctly mark the field as dirty

Note on compiled assets

I attempted to run mix:compile locally to update the compiled bundle, but this produced a large number of unrelated changes (chunk naming, minified worker files) likely due to differences between my local Node/webpack environment and the one used to produce the current build. To keep this PR focused and reviewable, I've only included the source change in codeeditor.js.

Summary by CodeRabbit

• Bug Fixes
  • Improved keyboard interaction in the code editor so keyup events are no longer intercepted by surrounding page behavior while editing.
  • This helps the editor respond more reliably when typing and using shortcuts.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 9f58365d-2fa5-4f69-a61c-4aa15381d9b7

📥 Commits

Reviewing files that changed from the base of the PR and between 4731b17 and a0e6853.

📒 Files selected for processing (1)

• modules/backend/formwidgets/codeeditor/assets/js/codeeditor.js

---

Walkthrough

The CodeEditor form widget's attachListeners() method now registers a capture-phase keyup event listener on the Monaco editor's DOM node that stops event propagation. This prevents keyup events from bubbling up to jQuery, which previously caused forms to be incorrectly marked as "dirty" when keys such as Command (macOS) were pressed inside the editor without actual content changes.

Estimated code review effort: 1 (Trivial) | ~2 minutes

Changes

File	Change Summary
modules/backend/formwidgets/codeeditor/assets/js/codeeditor.js	Added a capture-phase keyup listener to the editor DOM node in attachListeners() to stop event propagation.

Sequence Diagram(s)

sequenceDiagram
  participant User
  participant EditorDomNode
  participant jQuery

  User->>EditorDomNode: keyup event
  EditorDomNode->>EditorDomNode: stopPropagation (capture phase)
  EditorDomNode-->>jQuery: event blocked

Loading

Related issues: #1495 — CodeEditor: Unwanted 'dirty' flag triggered by Command key in Monaco Editor (macOS)

Suggested labels: bug, backend, javascript

Suggested reviewers: none identified

Poem
A rabbit tapped Command with glee,
No dirty flag now troubles me,
The keyup stops right at the door,
jQuery hears it nevermore,
Clean forms hop on, joyfully free. 🐇

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title clearly describes the main fix: stopping Monaco keyup propagation to prevent false dirty-state changes.
Linked Issues check	✅ Passed	The change matches #1495 by stopping editor keyup bubbling, which should prevent macOS Command key presses from triggering dirty state.
Out of Scope Changes check	✅ Passed	The diff is narrowly scoped to the CodeEditor keyup listener and does not introduce unrelated changes.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}