fix(livepreview): use unique iframe id for mdviewer to avoid duplicate DOM ids

The mdviewer iframe now uses id="panel-md-preview-frame" instead of
sharing "panel-live-preview-frame" with the HTML preview iframe.
Fixes duplicate ID causing test failures in Device Size & Resize Ruler.

Author: abose

src/extensionsIntegrated/Phoenix-live-preview/live-preview.css

@@ -25,7 +25,8 @@
     height: 100%;
 }
 
-#panel-live-preview-frame{
+#panel-live-preview-frame,
+#panel-md-preview-frame {
     background-color: white;
     position: relative;
 }

src/extensionsIntegrated/Phoenix-live-preview/main.js

@@ -125,6 +125,7 @@ define(function (require, exports, module) {
 
     const LIVE_PREVIEW_PANEL_ID = "live-preview-panel";
     const LIVE_PREVIEW_IFRAME_ID = "panel-live-preview-frame";
+    const MDVIEWR_IFRAME_ID = "panel-md-preview-frame";
     const _sandboxAttr = Phoenix.isTestWindow ? "" :
         'sandbox="allow-same-origin allow-popups allow-popups-to-escape-sandbox allow-scripts allow-forms allow-modals allow-pointer-lock"';
     const LIVE_PREVIEW_IFRAME_HTML = `
@@ -137,12 +138,12 @@ define(function (require, exports, module) {
 
     // Mdviewer renders untrusted markdown — tighter sandbox than live preview:
     // no allow-same-origin (prevents malicious scripts from accessing Phoenix context),
-    // no allow-forms, allow-modals, allow-pointer-lock (not needed for markdown editing).
+    // no allow-forms, allow-pointer-lock (not needed for markdown editing).
     // Communication works via MarkdownSync's own message handler (bypasses EventManager origin check).
     const _mdSandboxAttr = Phoenix.isTestWindow ? "" :
         'sandbox="allow-scripts allow-popups allow-popups-to-escape-sandbox allow-modals"';
     const MDVIEWR_IFRAME_HTML = `
-    <iframe id="${LIVE_PREVIEW_IFRAME_ID}" title="Live Preview" style="border: none"
+    <iframe id="${MDVIEWR_IFRAME_ID}" title="Markdown Preview" style="border: none"
              width="100%" height="100%" seamless="true"
              src='about:blank'
              ${_mdSandboxAttr}>

src/extensionsIntegrated/Phoenix-live-preview/utils.js

@@ -37,6 +37,7 @@
 
 define(function (require, exports, module) {
     const LIVE_PREVIEW_IFRAME_ID = "panel-live-preview-frame";
+    const MDVIEWR_IFRAME_ID = "panel-md-preview-frame";
     const EditorManager      = require("editor/EditorManager");
     function getExtension(filePath) {
         filePath = filePath || '';
@@ -98,7 +99,8 @@ define(function (require, exports, module) {
         if(!editor){
             return;
         }
-        if (document.activeElement === document.getElementById(LIVE_PREVIEW_IFRAME_ID)) {
+        if (document.activeElement === document.getElementById(LIVE_PREVIEW_IFRAME_ID) ||
+            document.activeElement === document.getElementById(MDVIEWR_IFRAME_ID)) {
             editor.focus();
         }
     }