@bleedingdev/modern-js-runtime-renderer-extensions 3.9.0-ultramodern.13 → 3.9.0-ultramodern.15

package/package.json

@@ -11,7 +11,7 @@
     "directory": "packages/runtime/renderer-extensions"
   },
   "license": "MIT",
-  "version": "3.9.0-ultramodern.13",
+  "version": "3.9.0-ultramodern.15",
   "engines": {
     "node": ">=26.7.0"
   },
@@ -36,12 +36,12 @@
     }
   },
   "dependencies": {
-    "@modern-js/plugin": "npm:@bleedingdev/modern-js-plugin@3.9.0-ultramodern.13",
-    "@modern-js/runtime-extensions": "npm:@bleedingdev/modern-js-runtime-extensions@3.9.0-ultramodern.13"
+    "@modern-js/plugin": "npm:@bleedingdev/modern-js-plugin@3.9.0-ultramodern.15",
+    "@modern-js/runtime-extensions": "npm:@bleedingdev/modern-js-runtime-extensions@3.9.0-ultramodern.15"
   },
   "devDependencies": {
-    "@modern-js/render": "npm:@bleedingdev/modern-js-render@3.9.0-ultramodern.13",
-    "@modern-js/tsconfig": "npm:@bleedingdev/modern-js-tsconfig@3.9.0-ultramodern.13",
+    "@modern-js/render": "npm:@bleedingdev/modern-js-render@3.9.0-ultramodern.15",
+    "@modern-js/tsconfig": "npm:@bleedingdev/modern-js-tsconfig@3.9.0-ultramodern.15",
     "@rslib/core": "1.0.2",
     "@scripts/rstest-config": "2.66.0",
     "@testing-library/dom": "^10.4.2",

package/tests/nativeStreamHead.test.tsx

@@ -24,16 +24,28 @@ const createRuntimeContext = () => ({
   },
 });
 
+const renderDocument = async (root: React.ReactElement) => {
+  registerPlugin([rendererHeadPlugin()]);
+  const stream = await renderStreaming(new Request('http://localhost/'), root, {
+    resource: {
+      entryName: 'index',
+      htmlTemplate: '<html><head></head><body><!--<?- html ?>--></body></html>',
+      routeManifest: {},
+    },
+    runtimeContext: createRuntimeContext(),
+    config: {},
+    onError: () => {},
+    onTiming: () => {},
+  } as any);
+  return new Response(stream).text();
+};
+
 describe('streaming Helmet collection', () => {
   it('publishes only Helmet markers present in the completed shell', async () => {
-    registerPlugin([rendererHeadPlugin()]);
-
     const AbandonPrimary = (): null => {
       throw new Error('abandon primary');
     };
-    const runtimeContext = createRuntimeContext();
-    const stream = await renderStreaming(
-      new Request('http://localhost/'),
+    const html = await renderDocument(
       <>
         <Helmet>
           <meta name="outside" content="committed" />
@@ -54,24 +66,36 @@ describe('streaming Helmet collection', () => {
           <AbandonPrimary />
         </React.Suspense>
       </>,
-      {
-        resource: {
-          entryName: 'index',
-          htmlTemplate:
-            '<html><head></head><body><!--<?- html ?>--></body></html>',
-          routeManifest: {},
-        },
-        runtimeContext,
-        config: {},
-        onError: () => {},
-        onTiming: () => {},
-      } as any,
     );
 
-    const html = await new Response(stream).text();
     expect(html).toContain('name="outside" content="committed"');
     expect(html).toContain('name="fallback" content="committed"');
     expect(html).not.toContain('abandoned-unique');
     expect(html).not.toContain('data-modern-helmet');
   });
+
+  it('keeps the head of a large completed route boundary in the shell', async () => {
+    // Routes render inside Suspense below the app container. A completed
+    // boundary this large is one React would otherwise write after the shell,
+    // past the point where the document head is sealed.
+    const html = await renderDocument(
+      <div id="app">
+        <React.Suspense fallback="loading">
+          <main>{'Route content. '.repeat(1000)}</main>
+          <Helmet htmlAttributes={{ lang: 'cs' }}>
+            <title>Route title</title>
+            <meta name="description" content="Route description" />
+          </Helmet>
+        </React.Suspense>
+      </div>,
+    );
+
+    const head = html.slice(0, html.indexOf('</head>'));
+    expect(head).toContain('<html lang="cs">');
+    expect(head).toMatch(/<title[^>]*>Route title<\/title>/);
+    expect(head).toMatch(
+      /<meta(?=[^>]*name="description")(?=[^>]*content="Route description")/,
+    );
+    expect(html).toContain('<main>Route content. ');
+  });
 });