fix(ssr): include <style /> for scope components when fullDocument: false

package.json

@@ -22,6 +22,10 @@
     "sys/",
     "testing/"
   ],
+  "browser": {
+    "node:fs": false,
+    "node:path": false
+  },
   "exports": {
     ".": {
       "import": "./internal/stencil-core/index.js",

src/mock-doc/serialize-node.ts

@@ -1,3 +1,4 @@
+import { BUILD } from '@platform';
 import {
   CONTENT_REF_ID,
   HYDRATE_ID,
@@ -63,13 +64,33 @@
   };
 
   let renderedNode = '';
+
   const children =
     !opts.fullDocument && (elm as MockDocument).body
       ? Array.from((elm as MockDocument).body.childNodes)
       : opts.outerHtml
         ? [elm]
         : Array.from(getChildNodes(elm));
 
+  // If we are not serializing the full document and we're not exclusively using declarative shadow dom
+  // we need to make sure we also include the style element for any components that are being hydrated
+  if (
+    !opts.fullDocument &&
+    (BUILD.scoped || (opts.serializeShadowRoot !== 'declarative-shadow-dom' && opts.serializeShadowRoot !== true))
+  ) {
+    for (let i = 0, ii = children.length; i < ii; i++) {
+      const child = children[i] as HTMLElement;
+      if (child.tagName) {
+        const styleTag = (elm as Element).querySelector(
+          `style[sty-id="sc-${(child as Element).tagName.toLowerCase()}"]`
+        );
+        if (styleTag) {
+          child.prepend(styleTag);
+        }
+      }
+    }
+  }
+
   for (let i = 0, ii = children.length; i < ii; i++) {
     const child = children[i];
     const chunks = Array.from(streamToHtml(child, opts, output));

src/utils/output-target.ts

@@ -1,6 +1,6 @@
 import { flatOne, normalizePath, sortBy } from '@utils';
 import { join } from '@utils';
-import { basename, dirname, relative } from 'path';
+import { basename, dirname, relative } from 'node:path';
 
 import type * as d from '../declarations';
 import {

src/utils/path.ts

@@ -1,4 +1,4 @@
-import path from 'path';
+import path from 'node:path';
 
 /**
  * Convert Windows backslash paths to slash paths: foo\\bar ➔ foo/bar