pome-ui 2.0.0-preview66 → 2.0.0-preview68

package/package.json

@@ -1,21 +1,21 @@
-{
-  "name": "pome-ui",
-  "version": "2.0.0-preview66",
-  "description": "Front-end MVC library",
-  "main": "pome-ui.js",
-  "bin": {
-    "pomelo-vue": "bin/pome-ui.js"
-  },
-  "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
-  },
-  "repository": {
-    "type": "git",
-    "url": "git+https://git.net/pomesoft/pome-ui.git"
-  },
-  "author": "Yuko Zheng",
-  "license": "GPL v3",
-  "bugs": {
-  },
-  "homepage": "https://git.net/pomesoft/pome-ui"
-}
+{
+  "name": "pome-ui",
+  "version": "2.0.0-preview68",
+  "description": "Front-end MVC library",
+  "main": "pome-ui.js",
+  "bin": {
+    "pomelo-vue": "bin/pome-ui.js"
+  },
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://git.net/pomesoft/pome-ui.git"
+  },
+  "author": "Yuko Zheng",
+  "license": "GPL v3",
+  "bugs": {
+  },
+  "homepage": "https://git.net/pomesoft/pome-ui"
+}

package/pome-ui.dev.js

@@ -19235,6 +19235,22 @@ function build(options, exports) {
                                         } else {
                                             var msg = 'Mount component to ' + self.selector + ' failed: container element not found in DOM after retries. URL: ' + url;
                                             console.error('[PomeUI]', msg);
+                                            try {
+                                                var _pomelos = Array.prototype.map.call(document.querySelectorAll('[id^="pomelo-"]'), function (e) { return '#' + e.id; });
+                                                var _containers = Array.prototype.map.call(document.querySelectorAll('[id^="container-"]'), function (e) { return '#' + e.id; });
+                                                var _bodyHtml = document.body ? document.body.innerHTML : '(no body)';
+                                                console.error('[PomeUI] Container-not-found diagnostics:', {
+                                                    wantedSelector: self.selector,
+                                                    url: url,
+                                                    pomeloRoots: _pomelos,
+                                                    containerDivs: _containers,
+                                                    bodyInnerLength: _bodyHtml.length,
+                                                    bodyInnerHead: _bodyHtml.substring(0, 600),
+                                                    rootProxyExists: !!exports.root()
+                                                });
+                                            } catch (diagErr) {
+                                                console.error('[PomeUI] diagnostics failed:', diagErr);
+                                            }
                                             return rej(new Error(msg));
                                         }
                                     }
@@ -20180,6 +20196,10 @@ function build(options, exports) {
                         var appId = 'pomelo-' + ticks;
                         var containerId = 'container-' + ticks;
                         var bodyHtml = document.querySelector('body').innerHTML;
+                        // Strip HTML comments first: a literal <render-body> mentioned inside a
+                        // comment (e.g. an explanatory note in the layout) must not be mistaken
+                        // for the real mount point. Comments are inert in the compiled template.
+                        bodyHtml = bodyHtml.replace(/<!--[\s\S]*?-->/g, '');
                         var renderBodyRegex = /<render-body\s*(?:\/\s*)?>(?:<\/render-body\s*>)?/i;
                         var body;
                         if (renderBodyRegex.test(bodyHtml)) {
@@ -20224,8 +20244,23 @@ function build(options, exports) {
                         document.querySelector('body').innerHTML = '<div id="' + appId + '" class="_pome-vue-cloak">' + body + '</div>';
                         if (!document.getElementById(containerId)) {
                             console.error('[PomeUI] Container element #' + containerId + ' not found in DOM immediately after setting body innerHTML. The <render-body> replacement likely failed.');
+                            try {
+                                var _idxInBody = body.indexOf('id="' + containerId + '"');
+                                var _cp = document.querySelector('.center-pane');
+                                console.error('[PomeUI] render-body-replace diagnostics:', {
+                                    containerInBodyString: _idxInBody,
+                                    bodyStringLength: body.length,
+                                    bodyAroundContainer: _idxInBody >= 0 ? body.substring(Math.max(0, _idxInBody - 300), _idxInBody + 120) : '(container id not in body string)',
+                                    centerPaneExists: !!_cp,
+                                    centerPaneInnerHtml: _cp ? _cp.innerHTML.substring(0, 200) : '(no .center-pane in parsed DOM)',
+                                    centerPaneOuterStart: _cp ? _cp.outerHTML.substring(0, 120) : '(n/a)',
+                                    parsedBodyLength: document.body.innerHTML.length
+                                });
+                            } catch (rbErr) {
+                                console.error('[PomeUI] render-body-replace diagnostics failed:', rbErr);
+                            }
                         }
-                        options.template = null;
+                        options.template = body;
                         if (!options.mounted) {
                             options.mounted = function () { };
                         }