Add more escape characters to the inline stream component (#34)

examples/kitchen-sink/src/pages/nav.tsx

@@ -88,6 +88,11 @@ export default function Nav() {
                         description="Dedupe data requests with React's cache helper."
                         href="/react/cache"
                       />
+                      <ExampleLink
+                        title="Logging"
+                        description="RSC server to client logging."
+                        href="/react/logging"
+                      />
                     </ExampleGroup>
 
                     <ExampleGroup name="Server actions" path="/server-actions">

examples/kitchen-sink/src/pages/react/logging/client-component.tsx

@@ -0,0 +1,5 @@
+"use client";
+
+export function DisplayText({ text }: { text: string }) {
+  return <p>{text}</p>;
+}

examples/kitchen-sink/src/pages/react/logging/index.page.tsx

@@ -0,0 +1,25 @@
+import { DisplayText } from "./client-component";
+
+export default function LoggingPage() {
+  console.log("Hello world!");
+  console.log("Hello <b>html</b> world!");
+  console.log("Hello <script></script> world!");
+
+  return (
+    <div className="space-y-4">
+      <div>
+        <h2>These should be escaped</h2>
+        <p>{"A string with some HTML: <b>Hello</b><script></script>"}</p>
+        <DisplayText text="Hello <b>world!</b><script></script>" />
+      </div>
+      <div>
+        <h2>This should contain HTML</h2>
+        <p
+          dangerouslySetInnerHTML={{
+            __html: "A string with some <b>HTML</b><script></script>",
+          }}
+        ></p>
+      </div>
+    </div>
+  );
+}

packages/framework/src/components/inline-rsc-stream.tsx

@@ -99,19 +99,21 @@ async function Inline({
 
 // From https://github.com/cyco130/vite-rsc/blob/2e3d0ad9915e57c4b2eaa3ea24b46c1b477a4cce/packages/fully-react/src/server/htmlescape.ts#L25C1-L38C2
 
-const TERMINATORS_LOOKUP: Record<string, string> = {
+let ESCAPE_LOOKUP: Record<string, string> = {
+  ">": "\\u003e",
+  "<": "\\u003c",
   "\u2028": "\\u2028",
   "\u2029": "\\u2029",
 };
 
-const TERMINATORS_REGEX = /[\u2028\u2029]/g;
+let ESCAPE_REGEX = /[><\u2028\u2029]/g;
 
-function sanitizer(match: string | number) {
-  return TERMINATORS_LOOKUP[match];
+function escaper(match: string | number) {
+  return ESCAPE_LOOKUP[match];
 }
 
 function sanitize(str: string) {
-  return str.replace(TERMINATORS_REGEX, sanitizer);
+  return str.replace(ESCAPE_REGEX, escaper);
 }
 
 export class TeardownOnError extends Component<