@rindo/core 4.19.1 → 4.20.0-dev.1737933003.7d01dba

package/internal/testing/index.js

@@ -784,17 +784,6 @@ var clientHydrate = (parentVNode, childRenderNodes, slotNodes, shadowRootNodes,
         }
       }
     }
-    for (i2 = node.childNodes.length - 1; i2 >= 0; i2--) {
-      clientHydrate(
-        parentVNode,
-        childRenderNodes,
-        slotNodes,
-        shadowRootNodes,
-        hostElm,
-        node.childNodes[i2],
-        hostId
-      );
-    }
     if (node.shadowRoot) {
       for (i2 = node.shadowRoot.childNodes.length - 1; i2 >= 0; i2--) {
         clientHydrate(
@@ -808,6 +797,17 @@ var clientHydrate = (parentVNode, childRenderNodes, slotNodes, shadowRootNodes,
         );
       }
     }
+    for (i2 = node.childNodes.length - 1; i2 >= 0; i2--) {
+      clientHydrate(
+        parentVNode,
+        childRenderNodes,
+        slotNodes,
+        shadowRootNodes,
+        hostElm,
+        node.childNodes[i2],
+        hostId
+      );
+    }
   } else if (node.nodeType === 8 /* CommentNode */) {
     childIdSplt = node.nodeValue.split(".");
     if (childIdSplt[1] === hostId || childIdSplt[1] === "0") {
@@ -885,14 +885,14 @@ var clientHydrate = (parentVNode, childRenderNodes, slotNodes, shadowRootNodes,
 var initializeDocumentHydrate = (node, orgLocNodes) => {
   if (node.nodeType === 1 /* ElementNode */) {
     let i2 = 0;
-    for (; i2 < node.childNodes.length; i2++) {
-      initializeDocumentHydrate(node.childNodes[i2], orgLocNodes);
-    }
     if (node.shadowRoot) {
-      for (i2 = 0; i2 < node.shadowRoot.childNodes.length; i2++) {
+      for (; i2 < node.shadowRoot.childNodes.length; i2++) {
         initializeDocumentHydrate(node.shadowRoot.childNodes[i2], orgLocNodes);
       }
     }
+    for (i2 = 0; i2 < node.childNodes.length; i2++) {
+      initializeDocumentHydrate(node.childNodes[i2], orgLocNodes);
+    }
   } else if (node.nodeType === 8 /* CommentNode */) {
     const childIdSplt = node.nodeValue.split(".");
     if (childIdSplt[0] === ORG_LOCATION_ID) {
@@ -987,8 +987,6 @@ var registerStyle = (scopeId2, cssText, allowCS) => {
 };
 var addStyle = (styleContainerNode, cmpMeta, mode) => {
   var _a;
-  const styleContainerDocument = styleContainerNode;
-  const styleContainerShadowRoot = styleContainerNode;
   const scopeId2 = getScopeId(cmpMeta, mode);
   const style = styles.get(scopeId2);
   if (!import_app_data7.BUILD.attachStyles) {
@@ -997,14 +995,14 @@ var addStyle = (styleContainerNode, cmpMeta, mode) => {
   styleContainerNode = styleContainerNode.nodeType === 11 /* DocumentFragment */ ? styleContainerNode : doc;
   if (style) {
     if (typeof style === "string") {
-      styleContainerNode = styleContainerDocument.head || styleContainerNode;
+      styleContainerNode = styleContainerNode.head || styleContainerNode;
       let appliedStyles = rootAppliedStyles.get(styleContainerNode);
       let styleElm;
       if (!appliedStyles) {
         rootAppliedStyles.set(styleContainerNode, appliedStyles = /* @__PURE__ */ new Set());
       }
       if (!appliedStyles.has(scopeId2)) {
-        if (import_app_data7.BUILD.hydrateClientSide && styleContainerShadowRoot.host && (styleElm = styleContainerNode.querySelector(`[${HYDRATED_STYLE_ID}="${scopeId2}"]`))) {
+        if (import_app_data7.BUILD.hydrateClientSide && styleContainerNode.host && (styleElm = styleContainerNode.querySelector(`[${HYDRATED_STYLE_ID}="${scopeId2}"]`))) {
           styleElm.innerHTML = style;
         } else {
           styleElm = doc.createElement("style");
@@ -1013,10 +1011,21 @@ var addStyle = (styleContainerNode, cmpMeta, mode) => {
           if (nonce != null) {
             styleElm.setAttribute("nonce", nonce);
           }
-          if (import_app_data7.BUILD.hydrateServerSide || import_app_data7.BUILD.hotModuleReplacement) {
+          if ((import_app_data7.BUILD.hydrateServerSide || import_app_data7.BUILD.hotModuleReplacement) && cmpMeta.$flags$ & 2 /* scopedCssEncapsulation */) {
             styleElm.setAttribute(HYDRATED_STYLE_ID, scopeId2);
           }
-          styleContainerNode.insertBefore(styleElm, styleContainerNode.querySelector("link"));
+          const injectStyle = (
+            /**
+             * we render a scoped component
+             */
+            !(cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) || /**
+             * we are using shadow dom and render the style tag within the shadowRoot
+             */
+            cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */ && styleContainerNode.nodeName !== "HEAD"
+          );
+          if (injectStyle) {
+            styleContainerNode.insertBefore(styleElm, styleContainerNode.querySelector("link"));
+          }
         }
         if (cmpMeta.$flags$ & 4 /* hasSlotRelocation */) {
           styleElm.innerHTML += SLOT_FB_CSS;
@@ -1025,8 +1034,8 @@ var addStyle = (styleContainerNode, cmpMeta, mode) => {
           appliedStyles.add(scopeId2);
         }
       }
-    } else if (import_app_data7.BUILD.constructableCSS && !styleContainerDocument.adoptedStyleSheets.includes(style)) {
-      styleContainerDocument.adoptedStyleSheets = [...styleContainerDocument.adoptedStyleSheets, style];
+    } else if (import_app_data7.BUILD.constructableCSS && !styleContainerNode.adoptedStyleSheets.includes(style)) {
+      styleContainerNode.adoptedStyleSheets = [...styleContainerNode.adoptedStyleSheets, style];
     }
   }
   return scopeId2;
@@ -1041,7 +1050,7 @@ var attachStyles = (hostRef) => {
     cmpMeta,
     hostRef.$modeName$
   );
-  if ((import_app_data7.BUILD.shadowDom || import_app_data7.BUILD.scoped) && import_app_data7.BUILD.cssAnnotations && flags & 10 /* needsScopedEncapsulation */) {
+  if ((import_app_data7.BUILD.shadowDom || import_app_data7.BUILD.scoped) && import_app_data7.BUILD.cssAnnotations && flags & 10 /* needsScopedEncapsulation */ && flags & 2 /* scopedCssEncapsulation */) {
     elm["s-sc"] = scopeId2;
     elm.classList.add(scopeId2 + "-h");
     if (import_app_data7.BUILD.scoped && flags & 2 /* scopedCssEncapsulation */) {
@@ -1051,7 +1060,6 @@ var attachStyles = (hostRef) => {
   endAttachStyles();
 };
 var getScopeId = (cmp, mode) => "sc-" + (import_app_data7.BUILD.mode && mode && cmp.$flags$ & 32 /* hasMode */ ? cmp.$tagName$ + "-" + mode : cmp.$tagName$);
-var convertScopedToShadow = (css) => css.replace(/\/\*!@([^\/]+)\*\/[^\{]+\{/g, "$1{");
 
 // src/runtime/vdom/vdom-render.ts
 var import_app_data10 = require("@rindo/core/internal/app-data");
@@ -1247,7 +1255,9 @@ var createElm = (oldParentVNode, newParentVNode, childIndex, parentElm) => {
     if (import_app_data10.BUILD.vdomAttribute) {
       updateElement(null, newVNode2, isSvgMode);
     }
-    if ((import_app_data10.BUILD.shadowDom || import_app_data10.BUILD.scoped) && isDef(scopeId) && elm["s-si"] !== scopeId) {
+    const rootNode = elm.getRootNode();
+    const isElementWithinShadowRoot = !rootNode.querySelector("body");
+    if (!isElementWithinShadowRoot && import_app_data10.BUILD.scoped && isDef(scopeId) && elm["s-si"] !== scopeId) {
       elm.classList.add(elm["s-si"] = scopeId);
     }
     if (import_app_data10.BUILD.scoped) {
@@ -1461,6 +1471,15 @@ var updateChildren = (parentElm, oldCh, newVNode2, newCh, isInitialRender = fals
 var isSameVnode = (leftVNode, rightVNode, isInitialRender = false) => {
   if (leftVNode.$tag$ === rightVNode.$tag$) {
     if (import_app_data10.BUILD.slotRelocation && leftVNode.$tag$ === "slot") {
+      if (
+        // The component gets hydrated and no VDOM has been initialized.
+        // Here the comparison can't happen as $name$ property is not set for `leftNode`.
+        "$nodeId$" in leftVNode && isInitialRender && // `leftNode` is not from type HTMLComment which would cause many
+        // hydration comments to be removed
+        leftVNode.$elm$.nodeType !== 8
+      ) {
+        return false;
+      }
       return leftVNode.$name$ === rightVNode.$name$;
     }
     if (import_app_data10.BUILD.vdomKey && !isInitialRender) {
@@ -1502,7 +1521,10 @@ var patch = (oldVNode, newVNode2, isInitialRender = false) => {
         elm.textContent = "";
       }
       addVnodes(elm, null, newVNode2, newChildren, 0, newChildren.length - 1);
-    } else if (import_app_data10.BUILD.updatable && oldChildren !== null) {
+    } else if (
+      // don't do this on initial render as it can cause non-hydrated content to be removed
+      !isInitialRender && import_app_data10.BUILD.updatable && oldChildren !== null
+    ) {
       removeVnodes(oldChildren, 0, oldChildren.length - 1);
     }
     if (import_app_data10.BUILD.svg && isSvgMode && tag === "svg") {
@@ -2194,7 +2216,8 @@ More information: https://rindojs.web.app/docs/properties#prop-mutability`
           if (this.hasOwnProperty(propName)) {
             newValue = this[propName];
             delete this[propName];
-          } else if (prototype.hasOwnProperty(propName) && typeof this[propName] === "number" && this[propName] == newValue) {
+          } else if (prototype.hasOwnProperty(propName) && typeof this[propName] === "number" && // cast type to number to avoid TS compiler issues
+          this[propName] == newValue) {
             return;
           } else if (propName == null) {
             const hostRef = getHostRef(this);
@@ -2301,7 +2324,7 @@ var initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
         const endRegisterStyles = createTime("registerStyles", cmpMeta.$tagName$);
         if (!import_app_data14.BUILD.hydrateServerSide && import_app_data14.BUILD.shadowDom && // TODO(RINDO-854): Remove code related to legacy shadowDomShim field
         import_app_data14.BUILD.shadowDomShim && cmpMeta.$flags$ & 8 /* needsShadowDomShim */) {
-          style = await import("../client/shadow-css.js").then((m) => m.scopeCss(style, scopeId2, false));
+          style = await import("../client/shadow-css.js").then((m) => m.scopeCss(style, scopeId2));
         }
         registerStyle(scopeId2, style, !!(cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */));
         endRegisterStyles();
@@ -2870,10 +2893,8 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
   const metaCharset = /* @__PURE__ */ head.querySelector("meta[charset]");
   const dataStyles = /* @__PURE__ */ doc.createElement("style");
   const deferredConnectedCallbacks = [];
-  const styles2 = /* @__PURE__ */ doc.querySelectorAll(`[${HYDRATED_STYLE_ID}]`);
   let appLoadFallback;
   let isBootstrapping = true;
-  let i2 = 0;
   Object.assign(plt, options);
   plt.$resourcesUrl$ = new URL(options.resourcesUrl || "./", doc.baseURI).href;
   if (import_app_data19.BUILD.asyncQueue) {
@@ -2884,11 +2905,6 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
   if (import_app_data19.BUILD.hydrateClientSide) {
     plt.$flags$ |= 2 /* appLoaded */;
   }
-  if (import_app_data19.BUILD.hydrateClientSide && import_app_data19.BUILD.shadowDom) {
-    for (; i2 < styles2.length; i2++) {
-      registerStyle(styles2[i2].getAttribute(HYDRATED_STYLE_ID), convertScopedToShadow(styles2[i2].innerHTML), true);
-    }
-  }
   let hasSlotRelocation = false;
   lazyBundles.map((lazyBundle) => {
     lazyBundle[1].map((compactMeta) => {

package/internal/testing/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rindo/core/internal/testing",
-  "version": "4.19.1",
+  "version": "4.20.0-dev.1737933003.7d01dba",
   "description": "Rindo internal testing platform to be imported by the Rindo Compiler. Breaking changes can and will happen at any time.",
   "main": "./index.js",
   "private": true

package/mock-doc/index.cjs

@@ -1,5 +1,5 @@
 /*!
- Rindo Mock Doc (CommonJS) v4.19.1 | MIT Licensed | https://rindojs.web.app
+ Rindo Mock Doc (CommonJS) v4.20.0-dev.1737933003.7d01dba | MIT Licensed | https://rindojs.web.app
  */
 "use strict";
 var __defProp = Object.defineProperty;
@@ -6287,7 +6287,7 @@ function normalizeSerializationOptions(opts = {}) {
     removeAttributeQuotes: typeof opts.removeAttributeQuotes !== "boolean" ? false : opts.removeAttributeQuotes,
     removeBooleanAttributeQuotes: typeof opts.removeBooleanAttributeQuotes !== "boolean" ? false : opts.removeBooleanAttributeQuotes,
     removeHtmlComments: typeof opts.removeHtmlComments !== "boolean" ? false : opts.removeHtmlComments,
-    serializeShadowRoot: typeof opts.serializeShadowRoot !== "boolean" ? false : opts.serializeShadowRoot,
+    serializeShadowRoot: typeof opts.serializeShadowRoot !== "boolean" ? true : opts.serializeShadowRoot,
     fullDocument: typeof opts.fullDocument !== "boolean" ? true : opts.fullDocument
   };
 }
@@ -6413,7 +6413,7 @@ style="${cssText}">`;
     }
     if (EMPTY_ELEMENTS.has(tagName) === false) {
       const shadowRoot = node.shadowRoot;
-      if (opts.serializeShadowRoot && shadowRoot != null) {
+      if (shadowRoot != null && opts.serializeShadowRoot) {
         output.indent = output.indent + ((_c = opts.indentSpaces) != null ? _c : 0);
         yield* streamToHtml(shadowRoot, opts, output);
         output.indent = output.indent - ((_d = opts.indentSpaces) != null ? _d : 0);

package/mock-doc/index.d.ts

@@ -975,7 +975,7 @@ declare class MockWindow {
     addEventListener: (_type: string, _handler: (ev?: any) => void) => void;
     removeEventListener: (_type: string, _handler: (ev?: any) => void) => void;
     dispatchEvent: (_ev: any) => void;
-    onchange: (this: MediaQueryList, ev: MediaQueryListEvent) => any;
+    onchange: ((this: MediaQueryList, ev: MediaQueryListEvent) => any) | null;
   };
   get Node(): any;
   get NodeList(): any;

package/mock-doc/index.js

@@ -1,5 +1,5 @@
 /*!
- Rindo Mock Doc v4.19.1 | MIT Licensed | https://rindojs.web.app
+ Rindo Mock Doc v4.20.0-dev.1737933003.7d01dba | MIT Licensed | https://rindojs.web.app
  */
 
 // src/runtime/runtime-constants.ts
@@ -6234,7 +6234,7 @@ function normalizeSerializationOptions(opts = {}) {
     removeAttributeQuotes: typeof opts.removeAttributeQuotes !== "boolean" ? false : opts.removeAttributeQuotes,
     removeBooleanAttributeQuotes: typeof opts.removeBooleanAttributeQuotes !== "boolean" ? false : opts.removeBooleanAttributeQuotes,
     removeHtmlComments: typeof opts.removeHtmlComments !== "boolean" ? false : opts.removeHtmlComments,
-    serializeShadowRoot: typeof opts.serializeShadowRoot !== "boolean" ? false : opts.serializeShadowRoot,
+    serializeShadowRoot: typeof opts.serializeShadowRoot !== "boolean" ? true : opts.serializeShadowRoot,
     fullDocument: typeof opts.fullDocument !== "boolean" ? true : opts.fullDocument
   };
 }
@@ -6360,7 +6360,7 @@ style="${cssText}">`;
     }
     if (EMPTY_ELEMENTS.has(tagName) === false) {
       const shadowRoot = node.shadowRoot;
-      if (opts.serializeShadowRoot && shadowRoot != null) {
+      if (shadowRoot != null && opts.serializeShadowRoot) {
         output.indent = output.indent + ((_c = opts.indentSpaces) != null ? _c : 0);
         yield* streamToHtml(shadowRoot, opts, output);
         output.indent = output.indent - ((_d = opts.indentSpaces) != null ? _d : 0);

package/mock-doc/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rindo/core/mock-doc",
-  "version": "4.19.1",
+  "version": "4.20.0-dev.1737933003.7d01dba",
   "description": "Mock window, document and DOM outside of a browser environment.",
   "main": "./index.cjs",
   "module": "./index.js",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rindo/core",
-  "version": "4.19.1",
+  "version": "4.20.0-dev.1737933003.7d01dba",
   "license": "MIT",
   "main": "./internal/rindo-core/index.cjs",
   "module": "./internal/rindo-core/index.js",
@@ -37,10 +37,12 @@
       "types": "./internal/index.d.ts"
     },
     "./internal/client": {
-      "import": "./internal/client/index.js"
+      "import": "./internal/client/index.js",
+      "require": "./internal/client/index.js"
     },
     "./internal/testing": {
-      "import": "./internal/testing/index.js"
+      "import": "./internal/testing/index.js",
+      "require": "./internal/testing/index.js"
     },
     "./internal/testing/*": {
       "import": "./internal/testing/*"
@@ -61,7 +63,12 @@
       "types": "./compiler/rindo.d.ts"
     },
     "./compiler/*": {
-      "import": "./compiler/*"
+      "import": "./compiler/*",
+      "types": "./compiler/*"
+    },
+    "./screenshot": {
+      "require": "./screenshot/index.js",
+      "types": "./screenshot/index.d.ts"
     },
     "./sys/node": {
       "import": "./sys/node/index.js",
@@ -71,6 +78,18 @@
     "./sys/node/*": {
       "import": "./sys/node/*",
       "require": "./sys/node/*"
+    },
+    "./testing": {
+      "import": "./testing/index.js",
+      "types": "./testing/index.d.ts",
+      "require": "./testing/index.js"
+    },
+    "./testing/jest-preset": {
+      "require": "./testing/jest-preset.js"
+    },
+    "./testing/*": {
+      "import": "./testing/*",
+      "require": "./testing/*"
     }
   },
   "scripts": {
@@ -80,7 +99,7 @@
     "clean": "rm -rf build/ cli/ compiler/ dev-server/ internal/ mock-doc/ sys/ testing/ && npm run clean:scripts && npm run clean.screenshots",
     "clean.screenshots": "rm -rf test/end-to-end/screenshot/builds test/end-to-end/screenshot/images",
     "clean:scripts": "rm -rf scripts/build",
-    "lint": "eslint \"bin/*\" \"scripts/*.ts\" \"scripts/**/*.ts\" \"src/*.ts\" \"src/**/*.ts\" \"src/**/*.tsx\"",
+    "lint": "eslint 'bin/*' 'scripts/*.ts' 'scripts/**/*.ts' 'src/*.ts' 'src/**/*.ts' 'src/**/*.tsx'",
     "install.jest": "bash ./src/testing/jest/install-dependencies.sh",
     "prettier": "npm run prettier.base -- --write",
     "prettier.base": "prettier --cache \"./({bin,scripts,src,test}/**/*.{ts,tsx,js,jsx})|bin/rindo|.github/(**/)?*.(yml|yaml)|*.js\"",
@@ -135,7 +154,7 @@
     "eslint-plugin-jest": "^28.0.0",
     "eslint-plugin-jsdoc": "^48.0.0",
     "eslint-plugin-simple-import-sort": "^12.0.0",
-    "execa": "8.0.1",
+    "execa": "9.3.0",
     "exit": "^0.1.2",
     "fs-extra": "^11.0.0",
     "glob": "10.4.1",
@@ -162,7 +181,7 @@
     "semver": "^7.3.7",
     "terser": "5.31.1",
     "tsx": "^4.10.3",
-    "typescript": "~5.4.0",
+    "typescript": "~5.5.3",
     "webpack": "^5.75.0",
     "ws": "8.17.1"
   },

package/screenshot/index.js

@@ -1,5 +1,5 @@
 /*
- Rindo Screenshot v4.19.1 | MIT Licensed | https://rindojs.web.app
+ Rindo Screenshot v4.20.0-dev.1737933003.7d01dba | MIT Licensed | https://rindojs.web.app
  */
 "use strict";
 var __create = Object.create;

package/screenshot/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rindo/core/screenshot",
-  "version": "4.19.1",
+  "version": "4.20.0-dev.1737933003.7d01dba",
   "description": "Rindo Screenshot.",
   "main": "./index.js",
   "types": "./index.d.ts",

package/screenshot/pixel-match.js

@@ -1,5 +1,5 @@
 /*
- Rindo Screenshot Pixel Match v4.19.1 | MIT Licensed | https://rindojs.web.app
+ Rindo Screenshot Pixel Match v4.20.0-dev.1737933003.7d01dba | MIT Licensed | https://rindojs.web.app
  */
 "use strict";
 var __create = Object.create;

package/screenshot/screenshot-compare.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="node" />
 import type * as d from '@rindo/core/internal';
 export declare function compareScreenshot(emulateConfig: d.EmulateConfig, screenshotBuildData: d.ScreenshotBuildData, currentScreenshotBuf: Buffer, screenshotTimeoutMs: number | null, desc: string, width: number, height: number, testPath: string, pixelmatchThreshold: number): Promise<{
     id: string;
@@ -17,5 +16,5 @@ export declare function compareScreenshot(emulateConfig: d.EmulateConfig, screen
     allowableMismatchedPixels: number;
     allowableMismatchedRatio: number;
     testPath: string;
-    cacheKey: string;
+    cacheKey: string | undefined;
 }>;

package/screenshot/screenshot-fs.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="node" />
 import type * as d from '@rindo/core/internal';
 export declare function writeScreenshotImage(imagePath: string, screenshotBuf: Buffer): Promise<void>;
 export declare function writeScreenshotData(dataDir: string, screenshotData: d.Screenshot): Promise<void>;