feat: keyboard shortcuts for cut/copy/paste should work only in edit mode

Author: abose

src/extensionsIntegrated/phoenix-pro/LivePreviewEdit.js

@@ -33,6 +33,7 @@ define(function (require, exports, module) {
     const ChangeHelper = require("editor/EditorHelper/ChangeHelper");
     const AppInit = require("utils/AppInit");
     const Editor = require("editor/Editor").Editor;
+    const CONSTANTS = require("LiveDevelopment/LivePreviewConstants");
 
     // state manager key, to save the download location of the image
     const IMAGE_DOWNLOAD_FOLDER_KEY = "imageGallery.downloadFolder";
@@ -1890,9 +1891,34 @@ define(function (require, exports, module) {
     });
 
     let _isInLivePreviewSelectionContext = false;
-    // Cut interceptor
+    /**
+     * Cut (Ctrl+X) interceptor.
+     *
+     * This handler intercepts CodeMirror’s internal "cut" event (not a DOM event
+     * from the Live Preview iframe).
+     *
+     * Important context:
+     * - The Live Preview is embedded, but keyboard focus is always on the editor.
+     * - Clicking an element in Live Preview shifts *selection context* to Live Preview,
+     *   but not keyboard focus.
+     * - Therefore, when the user presses Ctrl+X while an element is selected in
+     *   Live Preview, CodeMirror still receives the cut event.
+     *
+     * Expected user intent:
+     * - Ctrl+X while selecting a Live Preview element → cut the selected DOM node
+     * - Ctrl+X while editing text in the editor → cut editor text
+     *
+     * Behavior:
+     * - If we are in Live Preview selection context AND Live Edit mode is active,
+     *   we prevent CodeMirror’s default cut behavior.
+     * - Instead, we forward the cut operation to the Live Preview via protocol,
+     *   so the selected DOM element is cut correctly.
+     *
+     * Note:
+     * - The Live Preview selection context is reset as soon as any editor event occurs.
+     */
     ChangeHelper.setCutInterceptor(function(editor, cm, event) {
-        if (_isInLivePreviewSelectionContext) {
+        if (_isInLivePreviewSelectionContext && LiveDevelopment.getCurrentMode() === CONSTANTS.LIVE_EDIT_MODE) {
             const currLiveDoc = LiveDevMultiBrowser.getCurrentLiveDoc();
             if (currLiveDoc && currLiveDoc.protocol && currLiveDoc.protocol.evaluate) {
                 event.preventDefault();
@@ -1901,9 +1927,9 @@ define(function (require, exports, module) {
         }
     });
 
-    // Copy interceptor
+    // Copy interceptor, see cut interceptor docs above to understand impl details
     ChangeHelper.setCopyInterceptor(function(editor, cm, event) {
-        if (_isInLivePreviewSelectionContext) {
+        if (_isInLivePreviewSelectionContext && LiveDevelopment.getCurrentMode() === CONSTANTS.LIVE_EDIT_MODE) {
             const currLiveDoc = LiveDevMultiBrowser.getCurrentLiveDoc();
             if (currLiveDoc && currLiveDoc.protocol && currLiveDoc.protocol.evaluate) {
                 event.preventDefault();
@@ -1912,9 +1938,9 @@ define(function (require, exports, module) {
         }
     });
 
-    // Paste interceptor
+    // Paste interceptor, see cut interceptor docs above to understand impl details
     ChangeHelper.setPasteInterceptor(function(editor, cm, event) {
-        if (_isInLivePreviewSelectionContext) {
+        if (_isInLivePreviewSelectionContext && LiveDevelopment.getCurrentMode() === CONSTANTS.LIVE_EDIT_MODE) {
             const currLiveDoc = LiveDevMultiBrowser.getCurrentLiveDoc();
             if (currLiveDoc && currLiveDoc.protocol && currLiveDoc.protocol.evaluate) {
                 event.preventDefault();