solid-js 1.7.0-beta.0 → 1.7.0-beta.2

package/web/dist/server.js

@@ -1,5 +1,6 @@
-import { sharedConfig, splitProps } from 'solid-js';
+import { sharedConfig, createRoot, splitProps } from 'solid-js';
 export { ErrorBoundary, For, Index, Match, Show, Suspense, SuspenseList, Switch, createComponent, mergeProps } from 'solid-js';
+import { serialize, Feature } from 'seroval';
 
 const booleans = ["allowfullscreen", "async", "autofocus", "autoplay", "checked", "controls", "default", "disabled", "formnovalidate", "hidden", "indeterminate", "ismap", "loop", "multiple", "muted", "nomodule", "novalidate", "open", "playsinline", "readonly", "required", "reversed", "seamless", "selected"];
 const BooleanAttributes = /*#__PURE__*/new Set(booleans);
@@ -10,258 +11,17 @@ const Aliases = /*#__PURE__*/Object.assign(Object.create(null), {
   htmlFor: "for"
 });
 
-const {
-  hasOwnProperty
-} = Object.prototype;
-const REF_START_CHARS = "hjkmoquxzABCDEFGHIJKLNPQRTUVWXYZ$_";
-const REF_START_CHARS_LEN = REF_START_CHARS.length;
-const REF_CHARS = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789$_";
-const REF_CHARS_LEN = REF_CHARS.length;
-const STACK = [];
-const BUFFER = [""];
-let ASSIGNMENTS = new Map();
-let INDEX_OR_REF = new WeakMap();
-let REF_COUNT = 0;
-BUFFER.pop();
-function stringify(root) {
-  if (writeProp(root, "")) {
-    let result = BUFFER[0];
-    for (let i = 1, len = BUFFER.length; i < len; i++) {
-      result += BUFFER[i];
-    }
-    if (REF_COUNT) {
-      if (ASSIGNMENTS.size) {
-        let ref = INDEX_OR_REF.get(root);
-        if (typeof ref === "number") {
-          ref = toRefParam(REF_COUNT++);
-          result = ref + "=" + result;
-        }
-        for (const [assignmentRef, assignments] of ASSIGNMENTS) {
-          result += ";" + assignments + assignmentRef;
-        }
-        result += ";return " + ref;
-        ASSIGNMENTS = new Map();
-      } else {
-        result = "return " + result;
-      }
-      result = "(function(" + refParamsString() + "){" + result + "}())";
-    } else if (root && root.constructor === Object) {
-      result = "(" + result + ")";
-    }
-    BUFFER.length = 0;
-    INDEX_OR_REF = new WeakMap();
-    return result;
-  }
-  return "void 0";
-}
-function writeProp(cur, accessor) {
-  switch (typeof cur) {
-    case "string":
-      BUFFER.push(quote(cur, 0));
-      break;
-    case "number":
-      BUFFER.push(cur + "");
-      break;
-    case "boolean":
-      BUFFER.push(cur ? "!0" : "!1");
-      break;
-    case "object":
-      if (cur === null) {
-        BUFFER.push("null");
-      } else {
-        const ref = getRef(cur, accessor);
-        switch (ref) {
-          case true:
-            return false;
-          case false:
-            switch (cur.constructor) {
-              case Object:
-                writeObject(cur);
-                break;
-              case Array:
-                writeArray(cur);
-                break;
-              case Date:
-                BUFFER.push('new Date("' + cur.toISOString() + '")');
-                break;
-              case RegExp:
-                BUFFER.push(cur + "");
-                break;
-              case Map:
-                BUFFER.push("new Map(");
-                writeArray(Array.from(cur));
-                BUFFER.push(")");
-                break;
-              case Set:
-                BUFFER.push("new Set(");
-                writeArray(Array.from(cur));
-                BUFFER.push(")");
-                break;
-              case undefined:
-                BUFFER.push("Object.assign(Object.create(null),");
-                writeObject(cur);
-                BUFFER.push(")");
-                break;
-              default:
-                return false;
-            }
-            break;
-          default:
-            BUFFER.push(ref);
-            break;
-        }
-      }
-      break;
-    default:
-      return false;
-  }
-  return true;
-}
-function writeObject(obj) {
-  let sep = "{";
-  STACK.push(obj);
-  for (const key in obj) {
-    if (hasOwnProperty.call(obj, key)) {
-      const val = obj[key];
-      const escapedKey = toObjectKey(key);
-      BUFFER.push(sep + escapedKey + ":");
-      if (writeProp(val, escapedKey)) {
-        sep = ",";
-      } else {
-        BUFFER.pop();
-      }
-    }
-  }
-  if (sep === "{") {
-    BUFFER.push("{}");
-  } else {
-    BUFFER.push("}");
-  }
-  STACK.pop();
-}
-function writeArray(arr) {
-  BUFFER.push("[");
-  STACK.push(arr);
-  writeProp(arr[0], 0);
-  for (let i = 1, len = arr.length; i < len; i++) {
-    BUFFER.push(",");
-    writeProp(arr[i], i);
-  }
-  STACK.pop();
-  BUFFER.push("]");
-}
-function getRef(cur, accessor) {
-  let ref = INDEX_OR_REF.get(cur);
-  if (ref === undefined) {
-    INDEX_OR_REF.set(cur, BUFFER.length);
-    return false;
-  }
-  if (typeof ref === "number") {
-    ref = insertAndGetRef(cur, ref);
-  }
-  if (STACK.includes(cur)) {
-    const parent = STACK[STACK.length - 1];
-    let parentRef = INDEX_OR_REF.get(parent);
-    if (typeof parentRef === "number") {
-      parentRef = insertAndGetRef(parent, parentRef);
-    }
-    ASSIGNMENTS.set(ref, (ASSIGNMENTS.get(ref) || "") + toAssignment(parentRef, accessor) + "=");
-    return true;
-  }
-  return ref;
-}
-function toObjectKey(name) {
-  const invalidIdentifierPos = getInvalidIdentifierPos(name);
-  return invalidIdentifierPos === -1 ? name : quote(name, invalidIdentifierPos);
-}
-function toAssignment(parent, key) {
-  return parent + (typeof key === "number" || key[0] === '"' ? "[" + key + "]" : "." + key);
-}
-function getInvalidIdentifierPos(name) {
-  let char = name[0];
-  if (!(char >= "a" && char <= "z" || char >= "A" && char <= "Z" || char === "$" || char === "_")) {
-    return 0;
-  }
-  for (let i = 1, len = name.length; i < len; i++) {
-    char = name[i];
-    if (!(char >= "a" && char <= "z" || char >= "A" && char <= "Z" || char >= "0" && char <= "9" || char === "$" || char === "_")) {
-      return i;
-    }
-  }
-  return -1;
-}
-function quote(str, startPos) {
-  let result = "";
-  let lastPos = 0;
-  for (let i = startPos, len = str.length; i < len; i++) {
-    let replacement;
-    switch (str[i]) {
-      case '"':
-        replacement = '\\"';
-        break;
-      case "\\":
-        replacement = "\\\\";
-        break;
-      case "<":
-        replacement = "\\x3C";
-        break;
-      case "\n":
-        replacement = "\\n";
-        break;
-      case "\r":
-        replacement = "\\r";
-        break;
-      case "\u2028":
-        replacement = "\\u2028";
-        break;
-      case "\u2029":
-        replacement = "\\u2029";
-        break;
-      default:
-        continue;
-    }
-    result += str.slice(lastPos, i) + replacement;
-    lastPos = i + 1;
-  }
-  if (lastPos === startPos) {
-    result = str;
-  } else {
-    result += str.slice(lastPos);
-  }
-  return '"' + result + '"';
-}
-function insertAndGetRef(obj, pos) {
-  const ref = toRefParam(REF_COUNT++);
-  INDEX_OR_REF.set(obj, ref);
-  if (pos) {
-    BUFFER[pos - 1] += ref + "=";
-  } else {
-    BUFFER[pos] = ref + "=" + BUFFER[pos];
-  }
-  return ref;
-}
-function refParamsString() {
-  let result = REF_START_CHARS[0];
-  for (let i = 1; i < REF_COUNT; i++) {
-    result += "," + toRefParam(i);
-  }
-  REF_COUNT = 0;
-  return result;
-}
-function toRefParam(index) {
-  let mod = index % REF_START_CHARS_LEN;
-  let ref = REF_START_CHARS[mod];
-  index = (index - mod) / REF_START_CHARS_LEN;
-  while (index > 0) {
-    mod = index % REF_CHARS_LEN;
-    ref += REF_CHARS[mod];
-    index = (index - mod) / REF_CHARS_LEN;
-  }
-  return ref;
+const ES2017FLAG = Feature.AggregateError
+| Feature.BigInt
+| Feature.BigIntTypedArray;
+function stringify(data) {
+  return serialize(data, {
+    disabledFeatures: ES2017FLAG
+  });
 }
 
 const VOID_ELEMENTS = /^(?:area|base|br|col|embed|hr|img|input|keygen|link|menuitem|meta|param|source|track|wbr)$/i;
-const REPLACE_SCRIPT = `function $df(e,t,n,o,d){if(n=document.getElementById(e),o=document.getElementById("pl-"+e)){for(;o&&8!==o.nodeType&&o.nodeValue!=="pl-"+e;)d=o.nextSibling,o.remove(),o=d;o.replaceWith(n.content)}n.remove(),_$HY.set(e,t),_$HY.fe(e)}`;
+const REPLACE_SCRIPT = `function $df(e,n,t,o,d){if(t=document.getElementById(e),o=document.getElementById("pl-"+e)){for(;o&&8!==o.nodeType&&o.nodeValue!=="pl-"+e;)d=o.nextSibling,o.remove(),o=d;_$HY.done?o.remove():o.replaceWith(t.content)}t.remove(),_$HY.set(e,n),_$HY.fe(e)}`;
 function renderToString(code, options = {}) {
   let scripts = "";
   sharedConfig.context = {
@@ -273,11 +33,14 @@ function renderToString(code, options = {}) {
     nonce: options.nonce,
     writeResource(id, p, error) {
       if (sharedConfig.context.noHydrate) return;
-      if (error) return scripts += `_$HY.set("${id}", ${serializeError(p)});`;
+      if (error) return scripts += `_$HY.set("${id}", ${stringify(p)});`;
       scripts += `_$HY.set("${id}", ${stringify(p)});`;
     }
   };
-  let html = resolveSSRNode(escape(code()));
+  let html = createRoot(d => {
+    setTimeout(d);
+    return resolveSSRNode(escape(code()));
+  });
   sharedConfig.context.noHydrate = true;
   html = injectAssets(sharedConfig.context.assets, html);
   if (scripts.length) html = injectScripts(html, scripts, options.nonce);
@@ -303,6 +66,7 @@ function renderToStream(code, options = {}) {
     onCompleteAll,
     renderId
   } = options;
+  let dispose;
   const blockingResources = [];
   const registry = new Map();
   const dedupe = new WeakMap();
@@ -316,6 +80,7 @@ function renderToStream(code, options = {}) {
       });
       writable && writable.end();
       completed = true;
+      setTimeout(dispose);
     }
   };
   const pushTask = task => {
@@ -367,7 +132,7 @@ function renderToStream(code, options = {}) {
     },
     writeResource(id, p, error, wait) {
       const serverOnly = sharedConfig.context.noHydrate;
-      if (error) return !serverOnly && pushTask(serializeSet(dedupe, id, p, serializeError));
+      if (error) return !serverOnly && pushTask(serializeSet(dedupe, id, p));
       if (!p || typeof p !== "object" || !("then" in p)) return !serverOnly && pushTask(serializeSet(dedupe, id, p));
       if (!firstFlushed) wait && blockingResources.push(p);else !serverOnly && pushTask(`_$HY.init("${id}")`);
       if (serverOnly) return;
@@ -390,10 +155,10 @@ function renderToStream(code, options = {}) {
           if ((value !== undefined || error) && !completed) {
             if (!firstFlushed) {
               Promise.resolve().then(() => html = replacePlaceholder(html, key, value !== undefined ? value : ""));
-              error && pushTask(serializeSet(dedupe, key, error, serializeError));
+              error && pushTask(serializeSet(dedupe, key, error));
             } else {
               buffer.write(`<template id="${key}">${value !== undefined ? value : " "}</template>`);
-              pushTask(`${keys.length ? keys.map(k => `_$HY.unset("${k}")`).join(";") + ";" : ""}$df("${key}"${error ? "," + serializeError(error) : ""})${!scriptFlushed ? ";" + REPLACE_SCRIPT : ""}`);
+              pushTask(`${keys.length ? keys.map(k => `_$HY.unset("${k}")`).join(";") + ";" : ""}$df("${key}"${error ? "," + stringify(error) : ""})${!scriptFlushed ? ";" + REPLACE_SCRIPT : ""}`);
               scriptFlushed = true;
             }
           }
@@ -403,7 +168,10 @@ function renderToStream(code, options = {}) {
       };
     }
   };
-  let html = resolveSSRNode(escape(code()));
+  let html = createRoot(d => {
+    dispose = d;
+    return resolveSSRNode(escape(code()));
+  });
   function doShell() {
     sharedConfig.context = context;
     context.noHydrate = true;
@@ -501,7 +269,7 @@ function ssrClassList(value) {
       classValue = !!value[key];
     if (!key || key === "undefined" || !classValue) continue;
     i && (result += " ");
-    result += key;
+    result += escape(key);
   }
   return result;
 }
@@ -538,7 +306,7 @@ function ssrElement(tag, props, children, needsId) {
     } else if (prop === "class" || prop === "className" || prop === "classList") {
       if (classResolved) continue;
       let n;
-      result += `class="${(n = props.class) ? n + " " : ""}${(n = props.className) ? n + " " : ""}${ssrClassList(props.classList)}"`;
+      result += `class="${escape(((n = props.class) ? n + " " : "") + ((n = props.className) ? n + " " : ""), true) + ssrClassList(props.classList)}"`;
       classResolved = true;
     } else if (BooleanAttributes.has(prop)) {
       if (value) result += prop;else continue;
@@ -551,7 +319,7 @@ function ssrElement(tag, props, children, needsId) {
   }
   if (skipChildren) {
     return {
-      t: result + '/>'
+      t: result + "/>"
     };
   }
   return {
@@ -568,13 +336,10 @@ function ssrHydrationKey() {
 function escape(s, attr) {
   const t = typeof s;
   if (t !== "string") {
-    if (!attr && t === "function") return escape(s(), attr);
+    if (!attr && t === "function") return escape(s());
     if (!attr && Array.isArray(s)) {
-      let r = "";
-      for (let i = 0; i < s.length; i++) r += resolveSSRNode(escape(s[i], attr));
-      return {
-        t: r
-      };
+      for (let i = 0; i < s.length; i++) s[i] = escape(s[i]);
+      return s;
     }
     if (attr && t === "boolean") return String(s);
     return s;
@@ -619,8 +384,12 @@ function resolveSSRNode(node) {
   if (t === "string") return node;
   if (node == null || t === "boolean") return "";
   if (Array.isArray(node)) {
+    let prev = {};
     let mapped = "";
-    for (let i = 0, len = node.length; i < len; i++) mapped += resolveSSRNode(node[i]);
+    for (let i = 0, len = node.length; i < len; i++) {
+      if (typeof prev !== "object" && typeof node[i] !== "object") mapped += `<!--!-->`;
+      mapped += resolveSSRNode(prev = node[i]);
+    }
     return mapped;
   }
   if (t === "object") return node.t;
@@ -677,21 +446,6 @@ function injectScripts(html, scripts, nonce) {
   }
   return html + tag;
 }
-function serializeError(error) {
-  if (error.message) {
-    const fields = {};
-    const keys = Object.getOwnPropertyNames(error);
-    for (let i = 0; i < keys.length; i++) {
-      const key = keys[i];
-      const value = error[key];
-      if (!value || key !== "message" && typeof value !== "function") {
-        fields[key] = value;
-      }
-    }
-    return `Object.assign(new Error(${stringify(error.message)}), ${stringify(fields)})`;
-  }
-  return stringify(error);
-}
 function waitForFragments(registry, key) {
   for (const k of [...registry.keys()].reverse()) {
     if (key.startsWith(k)) {
@@ -701,11 +455,11 @@ function waitForFragments(registry, key) {
   }
   return false;
 }
-function serializeSet(registry, key, value, serializer = stringify) {
+function serializeSet(registry, key, value) {
   const exist = registry.get(value);
   if (exist) return `_$HY.set("${key}", _$HY.r["${exist}"][0])`;
   value !== null && typeof value === "object" && registry.set(value, key);
-  return `_$HY.set("${key}", ${serializer(value)})`;
+  return `_$HY.set("${key}", ${stringify(value)})`;
 }
 function replacePlaceholder(html, key, value) {
   const marker = `<template id="pl-${key}">`;
@@ -772,9 +526,10 @@ function ssrSpread(props, isSVG, skipChildren) {
       classResolved = true;
     } else if (BooleanAttributes.has(prop)) {
       if (value) result += prop;else continue;
-    } else if (value == undefined || prop === "ref" || prop.slice(0, 2) === "on") {
+    } else if (value == undefined || prop === "ref" || prop.slice(0, 2) === "on" || prop.slice(0, 5) === "prop:") {
       continue;
     } else {
+      if (prop.slice(0, 5) === "attr:") prop = prop.slice(5);
       result += `${Aliases[prop] || prop}="${escape(value, true)}"`;
     }
     if (i !== keys.length - 1) result += " ";
@@ -783,6 +538,7 @@ function ssrSpread(props, isSVG, skipChildren) {
 }
 
 const isServer = true;
+const isDev = false;
 function render() {}
 function hydrate() {}
 function insert() {}
@@ -803,4 +559,4 @@ function Portal(props) {
   return "";
 }
 
-export { Assets, Dynamic, Hydration, HydrationScript, NoHydration, Portal, addEventListener, delegateEvents, escape, generateHydrationScript, getAssets, getHydrationKey, hydrate, insert, isServer, pipeToNodeWritable, pipeToWritable, render, renderToStream, renderToString, renderToStringAsync, resolveSSRNode, spread, ssr, ssrAttribute, ssrClassList, ssrElement, ssrHydrationKey, ssrSpread, ssrStyle, stringify, useAssets };
+export { Assets, Dynamic, Hydration, HydrationScript, NoHydration, Portal, addEventListener, delegateEvents, escape, generateHydrationScript, getAssets, getHydrationKey, hydrate, insert, isDev, isServer, pipeToNodeWritable, pipeToWritable, render, renderToStream, renderToString, renderToStringAsync, resolveSSRNode, spread, ssr, ssrAttribute, ssrClassList, ssrElement, ssrHydrationKey, ssrSpread, ssrStyle, stringify, useAssets };