feat: new hook onAfterRenderHtml()

vikejs · Aug 20, 2024 · acd5466 · acd5466
1 parent 5dfd0fc
commit acd5466
Show file tree

Hide file tree

Showing 4 changed files with 28 additions and 3 deletions.
diff --git a/packages/vike-react/src/+config.ts b/packages/vike-react/src/+config.ts
@@ -76,6 +76,10 @@ const config = {
     streamIsRequired: {
       env: { server: true }
     },
+    onAfterRenderHtml: {
+      env: { server: true },
+      cumulative: true
+    },
     onBeforeRenderClient: {
       env: { client: true },
       cumulative: true

diff --git a/packages/vike-react/src/renderer/onRenderHtml.tsx b/packages/vike-react/src/renderer/onRenderHtml.tsx
@@ -13,6 +13,7 @@ import type { PageContextInternal } from '../types/PageContext.js'
 import type { Head } from '../types/Config.js'
 import { isReactElement } from '../utils/isReactElement.js'
 import { getTagAttributesString, type TagAttributes } from '../utils/getTagAttributesString.js'
+import { callCumulativeHooks } from '../utils/callCumulativeHooks.js'
 
 addEcosystemStamp()
 
@@ -40,18 +41,21 @@ const onRenderHtml: OnRenderHtmlAsync = async (
     </html>`
 }
 
+export type PageHtmlStream = Awaited<ReturnType<typeof renderToStream>>
 async function getPageHtml(pageContext: PageContextServer) {
-  let pageHtml: string | ReturnType<typeof dangerouslySkipEscape> | Awaited<ReturnType<typeof renderToStream>>
+  let pageHtml: string | ReturnType<typeof dangerouslySkipEscape> | PageHtmlStream
   if (!pageContext.Page) {
     pageHtml = ''
   } else {
     const page = getPageElement(pageContext)
     const { stream, streamIsRequired } = pageContext.config
     if (!stream && !streamIsRequired) {
-      pageHtml = dangerouslySkipEscape(renderToString(page))
+      const pageHtmlString = renderToString(page)
+      pageContext.pageHtmlString = pageHtmlString
+      pageHtml = dangerouslySkipEscape(pageHtmlString)
     } else {
       const disable = stream === false ? true : undefined
-      pageHtml = await renderToStream(page, {
+      const pageHtmlStream = await renderToStream(page, {
         webStream: typeof stream === 'string' ? stream === 'web' : undefined,
         userAgent:
           pageContext.headers?.['user-agent'] ||
@@ -60,8 +64,14 @@ async function getPageHtml(pageContext: PageContextServer) {
           pageContext.userAgent,
         disable
       })
+      pageContext.pageHtmlStream = pageHtmlStream
+      pageHtml = pageHtmlStream
     }
   }
+
+  // https://github.com/vikejs/vike/discussions/1804#discussioncomment-10394481
+  await callCumulativeHooks(pageContext.config.onAfterRenderHtml, pageContext)
+
   return pageHtml
 }
 

diff --git a/packages/vike-react/src/types/Config.ts b/packages/vike-react/src/types/Config.ts
@@ -170,6 +170,13 @@ declare global {
        */
       reactStrictMode?: boolean
 
+      /**
+       * Server-side hook called right after rendering the page's root React component to HTML.
+       *
+       * https://vike.dev/onAfterRenderHtml
+       */
+      onAfterRenderHtml?: (pageContext: PageContextServer) => void
+
       /**
        * Client-side hook called before the page is rendered.
        *
@@ -197,6 +204,7 @@ declare global {
       Head?: Head[]
       bodyAttributes?: TagAttributes[]
       htmlAttributes?: TagAttributes[]
+      onAfterRenderHtml?: Function[]
       onBeforeRenderClient?: Function[]
       onAfterRenderClient?: Function[]
     }

diff --git a/packages/vike-react/src/types/PageContext.ts b/packages/vike-react/src/types/PageContext.ts
@@ -2,6 +2,7 @@ import type React from 'react'
 import type { JSX } from 'react'
 import type ReactDOM from 'react-dom/client'
 import type { ConfigFromHookResolved } from './Config.js'
+import type { PageHtmlStream } from '../renderer/onRenderHtml.js'
 
 // https://vike.dev/pageContext#typescript
 declare global {
@@ -13,6 +14,8 @@ declare global {
       page?: JSX.Element
       /** The React root DOM container */
       root?: ReactDOM.Root
+      pageHtmlString?: string
+      pageHtmlStream?: PageHtmlStream
     }
   }
 }