react-on-rails 16.2.0-beta.10 → 16.2.0-beta.12

package/lib/RenderUtils.d.ts

@@ -1,2 +1,2 @@
-export declare function wrapInScriptTags(scriptId: string, scriptBody: string): string;
+export declare function wrapInScriptTags(scriptId: string, scriptBody: string, nonce?: string): string;
 //# sourceMappingURL=RenderUtils.d.ts.map

package/lib/RenderUtils.js

@@ -1,10 +1,14 @@
 // eslint-disable-next-line import/prefer-default-export -- only one export for now, but others may be added later
-export function wrapInScriptTags(scriptId, scriptBody) {
+export function wrapInScriptTags(scriptId, scriptBody, nonce) {
     if (!scriptBody) {
         return '';
     }
+    // Sanitize nonce to prevent attribute injection attacks
+    // CSP nonces should be base64 strings, so only allow alphanumeric, +, /, =, -, and _
+    const sanitizedNonce = nonce?.replace(/[^a-zA-Z0-9+/=_-]/g, '');
+    const nonceAttr = sanitizedNonce ? ` nonce="${sanitizedNonce}"` : '';
     return `
-<script id="${scriptId}">
+<script id="${scriptId}"${nonceAttr}>
 ${scriptBody}
 </script>`;
 }

package/lib/base/client.js

@@ -1,5 +1,5 @@
 import * as Authenticity from "../Authenticity.js";
-import buildConsoleReplay from "../buildConsoleReplay.js";
+import buildConsoleReplay, { consoleReplay } from "../buildConsoleReplay.js";
 import reactHydrateOrRender from "../reactHydrateOrRender.js";
 import createReactOutput from "../createReactOutput.js";
 const DEFAULT_OPTIONS = {
@@ -107,6 +107,9 @@ Fix: Use only react-on-rails OR react-on-rails-pro, not both.`);
         buildConsoleReplay() {
             return buildConsoleReplay();
         },
+        getConsoleReplayScript() {
+            return consoleReplay();
+        },
         resetOptions() {
             this.options = { ...DEFAULT_OPTIONS };
         },

package/lib/buildConsoleReplay.d.ts

@@ -6,7 +6,11 @@ declare global {
         }[];
     }
 }
-/** @internal Exported only for tests */
+/**
+ * Returns the console replay JavaScript code without wrapping it in script tags.
+ * This is useful when you want to wrap the code in script tags yourself (e.g., with a CSP nonce).
+ * @internal Exported for tests and for Ruby helper to wrap with nonce
+ */
 export declare function consoleReplay(customConsoleHistory?: (typeof console)['history'] | undefined, numberOfMessagesToSkip?: number): string;
-export default function buildConsoleReplay(customConsoleHistory?: (typeof console)['history'] | undefined, numberOfMessagesToSkip?: number): string;
+export default function buildConsoleReplay(customConsoleHistory?: (typeof console)['history'] | undefined, numberOfMessagesToSkip?: number, nonce?: string): string;
 //# sourceMappingURL=buildConsoleReplay.d.ts.map

package/lib/buildConsoleReplay.js

@@ -1,6 +1,10 @@
 import { wrapInScriptTags } from "./RenderUtils.js";
 import scriptSanitizedVal from "./scriptSanitizedVal.js";
-/** @internal Exported only for tests */
+/**
+ * Returns the console replay JavaScript code without wrapping it in script tags.
+ * This is useful when you want to wrap the code in script tags yourself (e.g., with a CSP nonce).
+ * @internal Exported for tests and for Ruby helper to wrap with nonce
+ */
 export function consoleReplay(customConsoleHistory = undefined, numberOfMessagesToSkip = 0) {
     // console.history is a global polyfill used in server rendering.
     const consoleHistory = customConsoleHistory ?? console.history;
@@ -34,11 +38,11 @@ export function consoleReplay(customConsoleHistory = undefined, numberOfMessages
     });
     return lines.join('\n');
 }
-export default function buildConsoleReplay(customConsoleHistory = undefined, numberOfMessagesToSkip = 0) {
+export default function buildConsoleReplay(customConsoleHistory = undefined, numberOfMessagesToSkip = 0, nonce) {
     const consoleReplayJS = consoleReplay(customConsoleHistory, numberOfMessagesToSkip);
     if (consoleReplayJS.length === 0) {
         return '';
     }
-    return wrapInScriptTags('consoleReplayLog', consoleReplayJS);
+    return wrapInScriptTags('consoleReplayLog', consoleReplayJS, nonce);
 }
 //# sourceMappingURL=buildConsoleReplay.js.map

package/lib/serverRenderReactComponent.js

@@ -2,7 +2,7 @@ import { isValidElement } from 'react';
 // ComponentRegistry is accessed via globalThis.ReactOnRails.getComponent for cross-bundle compatibility
 import createReactOutput from "./createReactOutput.js";
 import { isPromise, isServerRenderHash } from "./isServerRenderResult.js";
-import buildConsoleReplay from "./buildConsoleReplay.js";
+import { consoleReplay } from "./buildConsoleReplay.js";
 import handleError from "./handleError.js";
 import { renderToString } from "./ReactDOMServer.cjs";
 import { createResultObject, convertToError, validateComponent } from "./serverRenderUtils.js";
@@ -80,12 +80,12 @@ async function createPromiseResult(renderState, componentName, throwJsErrors) {
     const consoleHistory = console.history;
     try {
         const html = await renderState.result;
-        const consoleReplayScript = buildConsoleReplay(consoleHistory);
+        const consoleReplayScript = consoleReplay(consoleHistory);
         return createResultObject(html, consoleReplayScript, renderState);
     }
     catch (e) {
         const errorRenderState = handleRenderingError(e, { componentName, throwJsErrors });
-        const consoleReplayScript = buildConsoleReplay(consoleHistory);
+        const consoleReplayScript = consoleReplay(consoleHistory);
         return createResultObject(errorRenderState.result, consoleReplayScript, errorRenderState);
     }
 }
@@ -94,7 +94,7 @@ function createFinalResult(renderState, componentName, throwJsErrors) {
     if (isPromise(result)) {
         return createPromiseResult({ ...renderState, result }, componentName, throwJsErrors);
     }
-    const consoleReplayScript = buildConsoleReplay();
+    const consoleReplayScript = consoleReplay();
     return JSON.stringify(createResultObject(result, consoleReplayScript, renderState));
 }
 function serverRenderReactComponentInternal(options) {

package/lib/types/index.d.ts

@@ -324,8 +324,14 @@ export interface ReactOnRailsInternal extends ReactOnRails {
     handleError(options: ErrorOptions): string | undefined;
     /**
      * Used by Rails server rendering to replay console messages.
+     * Returns the console replay script wrapped in script tags.
      */
     buildConsoleReplay(): string;
+    /**
+     * Returns the console replay JavaScript code without wrapping it in script tags.
+     * Useful when you need to add CSP nonce or other attributes to the script tag.
+     */
+    getConsoleReplayScript(): string;
     /**
      * Get a Map containing all registered components. Useful for debugging.
      */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-on-rails",
-  "version": "16.2.0-beta.10",
+  "version": "16.2.0-beta.12",
   "description": "react-on-rails JavaScript for react_on_rails Ruby gem",
   "main": "lib/ReactOnRails.full.js",
   "type": "module",