@reckona/mreact-server 0.0.138 → 0.0.139

package/src/html-helpers.ts

@@ -184,7 +184,12 @@ function appendReactNodeList(
 
   for (const node of nodes) {
     if (chain !== undefined) {
-      chain = chain.then(() => appendReactNode(sink, node, state));
+      const buffered = renderReactNodeToBufferedString(node, state);
+      chain = chain.then(async () => {
+        await buffered.result;
+        await buffered.sink.drain();
+        sink.append(buffered.sink.toString());
+      });
       continue;
     }
 
@@ -198,6 +203,18 @@ function appendReactNodeList(
   return chain;
 }
 
+function renderReactNodeToBufferedString(
+  node: unknown,
+  state: HtmlRenderState,
+): { result: void | PromiseLike<void>; sink: ReturnType<typeof createStringSink> } {
+  const sink = createStringSink();
+
+  return {
+    result: appendReactNode(sink, node, state),
+    sink,
+  };
+}
+
 function appendReactElement(
   sink: HtmlSink,
   element: ReactCompatElement,
@@ -294,7 +311,12 @@ function appendRawTextNodeList(
 
   for (const node of nodes) {
     if (chain !== undefined) {
-      chain = chain.then(() => appendRawTextNode(sink, node));
+      const buffered = renderRawTextNodeToBufferedString(node);
+      chain = chain.then(async () => {
+        await buffered.result;
+        await buffered.sink.drain();
+        sink.append(buffered.sink.toString());
+      });
       continue;
     }
 
@@ -308,6 +330,17 @@ function appendRawTextNodeList(
   return chain;
 }
 
+function renderRawTextNodeToBufferedString(
+  node: unknown,
+): { result: void | PromiseLike<void>; sink: ReturnType<typeof createStringSink> } {
+  const sink = createStringSink();
+
+  return {
+    result: appendRawTextNode(sink, node),
+    sink,
+  };
+}
+
 function appendSuspenseElement(
   sink: HtmlSink,
   element: ReactCompatElement,
@@ -410,7 +443,8 @@ function renderHtmlAttribute(name: string, value: unknown): string {
     name === "ref" ||
     value === null ||
     value === undefined ||
-    typeof value === "function"
+    typeof value === "function" ||
+    /^on/i.test(name)
   ) {
     return "";
   }
@@ -421,6 +455,10 @@ function renderHtmlAttribute(name: string, value: unknown): string {
     return "";
   }
 
+  if (/^on/i.test(attributeName)) {
+    return "";
+  }
+
   if (value === false && !isBooleanishStringAttribute(attributeName)) {
     return "";
   }
@@ -488,11 +526,25 @@ const HTML_ATTRIBUTE_ALIASES: Record<string, string> = {
 };
 
 function isBooleanishStringAttribute(name: string): boolean {
-  const attributeName = toHtmlAttributeName(name).toLowerCase();
-  return (
+  const attributeName = name;
+
+  if (
     attributeName.startsWith("aria-") ||
     attributeName.startsWith("data-") ||
     BOOLEANISH_STRING_ATTRIBUTES.has(attributeName)
+  ) {
+    return true;
+  }
+
+  if (!hasAsciiUppercase(attributeName)) {
+    return false;
+  }
+
+  const lowerAttributeName = attributeName.toLowerCase();
+  return (
+    lowerAttributeName.startsWith("aria-") ||
+    lowerAttributeName.startsWith("data-") ||
+    BOOLEANISH_STRING_ATTRIBUTES.has(lowerAttributeName)
   );
 }
 
@@ -502,6 +554,17 @@ const BOOLEANISH_STRING_ATTRIBUTES = new Set<string>([
   "spellcheck",
 ]);
 
+function hasAsciiUppercase(value: string): boolean {
+  for (let index = 0; index < value.length; index += 1) {
+    const code = value.charCodeAt(index);
+    if (code >= 65 && code <= 90) {
+      return true;
+    }
+  }
+
+  return false;
+}
+
 function isPromiseLikeNode(value: unknown): value is PromiseLike<unknown> {
   return isPromiseLikeUnknown(value);
 }

package/src/html-internals.ts

@@ -1,16 +1,17 @@
+const attributeEscapePattern = /["&<>]/;
+const scriptJsonEscapePattern = /[<\u2028\u2029]/;
+
 export function escapeAttribute(value: string): string {
-  return value
-    .replaceAll("&", "&amp;")
-    .replaceAll('"', "&quot;")
-    .replaceAll("<", "&lt;")
-    .replaceAll(">", "&gt;");
+  return escapeString(value, attributeEscapePattern, attributeReplacement);
 }
 
 export function serializeScriptJson(value: unknown): string {
-  return JSON.stringify(value)
-    .replaceAll("<", "\\u003c")
-    .replaceAll("\u2028", "\\u2028")
-    .replaceAll("\u2029", "\\u2029");
+  const json = JSON.stringify(value);
+  if (json === undefined) {
+    throw new TypeError("Cannot serialize undefined as script JSON");
+  }
+
+  return escapeString(json, scriptJsonEscapePattern, scriptJsonReplacement);
 }
 
 export function renderNonceAttribute(nonce: string | undefined): string {
@@ -25,3 +26,64 @@ export function isPromiseLikeUnknown(value: unknown): value is PromiseLike<unkno
     typeof (value as { then?: unknown }).then === "function"
   );
 }
+
+function escapeString(
+  value: string,
+  pattern: RegExp,
+  replacementForCode: (code: number) => string | undefined,
+): string {
+  const match = pattern.exec(value);
+
+  if (match === null) {
+    return value;
+  }
+
+  let escaped = "";
+  let lastIndex = 0;
+  let index = match.index;
+
+  for (; index < value.length; index += 1) {
+    const replacement = replacementForCode(value.charCodeAt(index));
+
+    if (replacement === undefined) {
+      continue;
+    }
+
+    if (lastIndex !== index) {
+      escaped += value.substring(lastIndex, index);
+    }
+
+    escaped += replacement;
+    lastIndex = index + 1;
+  }
+
+  return lastIndex === index ? escaped : escaped + value.substring(lastIndex, index);
+}
+
+function attributeReplacement(code: number): string | undefined {
+  switch (code) {
+    case 34:
+      return "&quot;";
+    case 38:
+      return "&amp;";
+    case 60:
+      return "&lt;";
+    case 62:
+      return "&gt;";
+    default:
+      return undefined;
+  }
+}
+
+function scriptJsonReplacement(code: number): string | undefined {
+  switch (code) {
+    case 60:
+      return "\\u003c";
+    case 8232:
+      return "\\u2028";
+    case 8233:
+      return "\\u2029";
+    default:
+      return undefined;
+  }
+}