solid-js 1.4.8 → 1.5.0-beta.2

package/dist/server.cjs

@@ -7,6 +7,17 @@ const $PROXY = Symbol("solid-proxy");
 const $DEVCOMP = Symbol("solid-dev-component");
 const DEV = {};
 const ERROR = Symbol("error");
+const BRANCH = Symbol("branch");
+function castError(err) {
+  if (err instanceof Error || typeof err === "string") return err;
+  return new Error("Unknown error");
+}
+function handleError(err) {
+  err = castError(err);
+  const fns = lookup(Owner, ERROR);
+  if (!fns) throw err;
+  for (const f of fns) f(err);
+}
 const UNOWNED = {
   context: null,
   owner: null
@@ -24,9 +35,7 @@ function createRoot(fn, detachedOwner) {
   try {
     result = fn(() => {});
   } catch (err) {
-    const fns = lookup(Owner, ERROR);
-    if (!fns) throw err;
-    fns.forEach(f => f(err));
+    handleError(err);
   } finally {
     Owner = owner;
   }
@@ -45,9 +54,7 @@ function createComputed(fn, value) {
   try {
     fn(value);
   } catch (err) {
-    const fns = lookup(Owner, ERROR);
-    if (!fns) throw err;
-    fns.forEach(f => f(err));
+    handleError(err);
   } finally {
     Owner = Owner.owner;
   }
@@ -68,9 +75,7 @@ function createMemo(fn, value) {
   try {
     v = fn(value);
   } catch (err) {
-    const fns = lookup(Owner, ERROR);
-    if (!fns) throw err;
-    fns.forEach(f => f(err));
+    handleError(err);
   } finally {
     Owner = Owner.owner;
   }
@@ -100,11 +105,25 @@ function on(deps, fn, options = {}) {
   };
 }
 function onMount(fn) {}
-function onCleanup(fn) {}
+function onCleanup(fn) {
+  let node;
+  if (Owner && (node = lookup(Owner, BRANCH))) {
+    if (!node.cleanups) node.cleanups = [fn];else node.cleanups.push(fn);
+  }
+  return fn;
+}
+function cleanNode(node) {
+  if (node.cleanups) {
+    for (let i = 0; i < node.cleanups.length; i++) node.cleanups[i]();
+    node.cleanups = undefined;
+  }
+}
 function onError(fn) {
-  if (Owner === null) console.warn("error handlers created outside a `createRoot` or `render` will never be run");else if (Owner.context === null) Owner.context = {
-    [ERROR]: [fn]
-  };else if (!Owner.context[ERROR]) Owner.context[ERROR] = [fn];else Owner.context[ERROR].push(fn);
+  if (Owner) {
+    if (Owner.context === null) Owner.context = {
+      [ERROR]: [fn]
+    };else if (!Owner.context[ERROR]) Owner.context[ERROR] = [fn];else Owner.context[ERROR].push(fn);
+  }
 }
 function getListener() {
   return null;
@@ -132,6 +151,8 @@ function runWithOwner(o, fn) {
   Owner = o;
   try {
     return fn();
+  } catch (err) {
+    handleError(err);
   } finally {
     Owner = prev;
   }
@@ -177,31 +198,33 @@ function mapArray(list, mapFn, options = {}) {
   } else if (options.fallback) s = [options.fallback()];
   return () => s;
 }
-function getSymbol() {
-  const SymbolCopy = Symbol;
-  return SymbolCopy.observable || "@@observable";
-}
 function observable(input) {
-  const $$observable = getSymbol();
   return {
     subscribe(observer) {
       if (!(observer instanceof Object) || observer == null) {
         throw new TypeError("Expected the observer to be an object.");
       }
-      const handler = "next" in observer ? observer.next : observer;
-      let complete = false;
-      createComputed(() => {
-        if (complete) return;
-        const v = input();
-        handler(v);
+      const handler = typeof observer === "function" ? observer : observer.next && observer.next.bind(observer);
+      if (!handler) {
+        return {
+          unsubscribe() {}
+        };
+      }
+      const dispose = createRoot(disposer => {
+        createEffect(() => {
+          const v = input();
+          untrack(() => handler(v));
+        });
+        return disposer;
       });
+      if (getOwner()) onCleanup(dispose);
       return {
         unsubscribe() {
-          complete = true;
+          dispose();
         }
       };
     },
-    [$$observable]() {
+    [Symbol.observable || "@@observable"]() {
       return this;
     }
   };
@@ -209,9 +232,11 @@ function observable(input) {
 function from(producer) {
   const [s, set] = createSignal(undefined);
   if ("subscribe" in producer) {
-    producer.subscribe(v => set(() => v));
+    const unsub = producer.subscribe(v => set(() => v));
+    onCleanup(() => "unsubscribe" in unsub ? unsub.unsubscribe() : unsub());
   } else {
-    producer(set);
+    const clean = producer(set);
+    onCleanup(clean);
   }
   return s;
 }
@@ -226,7 +251,7 @@ function resolveSSRNode(node) {
     for (let i = 0, len = node.length; i < len; i++) mapped += resolveSSRNode(node[i]);
     return mapped;
   }
-  if (t === "object") return resolveSSRNode(node.t);
+  if (t === "object") return node.t;
   if (t === "function") return resolveSSRNode(node());
   return String(node);
 }
@@ -315,16 +340,16 @@ function Switch(props) {
 function Match(props) {
   return props;
 }
-const NoErrors = {};
 function resetErrorBoundaries() {}
 function ErrorBoundary(props) {
-  let error = NoErrors,
-      res;
+  let error,
+      res,
+      clean,
+      sync = true;
   const ctx = sharedConfig.context;
   const id = ctx.id + ctx.count;
-  onError(err => error = err);
-  createMemo(() => res = props.children);
-  if (error !== NoErrors) {
+  function displayFallback() {
+    cleanNode(clean);
     ctx.writeResource(id, error, true);
     setHydrateContext({ ...ctx,
       count: 0
@@ -332,7 +357,23 @@ function ErrorBoundary(props) {
     const f = props.fallback;
     return typeof f === "function" && f.length ? f(error, () => {}) : f;
   }
-  return res;
+  onError(err => {
+    error = err;
+    !sync && ctx.replace("e" + id, displayFallback);
+    sync = true;
+  });
+  onCleanup(() => cleanNode(clean));
+  createMemo(() => {
+    Owner.context = {
+      [BRANCH]: clean = {}
+    };
+    return res = props.children;
+  });
+  if (error) return displayFallback();
+  sync = false;
+  return {
+    t: `<!e${id}>${resolveSSRNode(res)}<!/e${id}>`
+  };
 }
 const SuspenseContext = createContext();
 let resourceContext = null;
@@ -412,7 +453,7 @@ function createResource(source, fetcher, options = {}) {
         return res;
       }).catch(err => {
         read.loading = false;
-        read.error = error = err;
+        read.error = error = castError(err);
         p = null;
         notifySuspense(contexts);
       });
@@ -439,6 +480,7 @@ function lazy(fn) {
     return p;
   };
   const contexts = new Set();
+  setTimeout(load);
   const wrap = props => {
     load();
     const id = sharedConfig.context.id.slice(0, -1);
@@ -462,10 +504,11 @@ function lazy(fn) {
   return wrap;
 }
 function suspenseComplete(c) {
+  if (c.complete) return true;
   for (const r of c.resources.values()) {
     if (r.loading) return false;
   }
-  return true;
+  return c.complete = true;
 }
 function notifySuspense(contexts) {
   for (const c of contexts) {
@@ -488,9 +531,15 @@ function SuspenseList(props) {
 }
 function Suspense(props) {
   let done;
+  let clean;
   const ctx = sharedConfig.context;
   const id = ctx.id + ctx.count;
   const o = Owner;
+  if (o) {
+    if (o.context) o.context[BRANCH] = clean = {};else o.context = {
+      [BRANCH]: clean = {}
+    };
+  }
   const value = ctx.suspense[id] || (ctx.suspense[id] = {
     resources: new Map(),
     completed: () => {
@@ -498,7 +547,8 @@ function Suspense(props) {
       if (suspenseComplete(value)) {
         done(resolveSSRNode(res));
       }
-    }
+    },
+    complete: false
   });
   function runSuspense() {
     setHydrateContext({ ...ctx,
@@ -508,36 +558,35 @@ function Suspense(props) {
       return createComponent(SuspenseContext.Provider, {
         value,
         get children() {
+          clean && cleanNode(clean);
           return props.children;
         }
       });
     });
   }
   const res = runSuspense();
-  if (suspenseComplete(value)) {
-    ctx.writeResource(id, null);
-    return res;
-  }
+  if (suspenseComplete(value)) return res;
   onError(err => {
-    if (!done || !done(undefined, err)) throw err;
+    if (!done || !done(undefined, err)) {
+      if (o) runWithOwner(o.owner, () => {
+        throw err;
+      });else throw err;
+    }
   });
   done = ctx.async ? ctx.registerFragment(id) : undefined;
-  if (ctx.streaming) {
+  if (ctx.async) {
     setHydrateContext(undefined);
     const res = {
       t: `<span id="pl-${id}">${resolveSSRNode(props.fallback)}</span>`
     };
     setHydrateContext(ctx);
     return res;
-  } else if (ctx.async) {
-    return {
-      t: `<![${id}]>`
-    };
   }
   setHydrateContext({ ...ctx,
     count: 0,
     id: ctx.id + "0.f"
   });
+  ctx.writeResource(id, "$$f");
   return props.fallback;
 }
 

package/dist/server.js

@@ -3,6 +3,17 @@ const $PROXY = Symbol("solid-proxy");
 const $DEVCOMP = Symbol("solid-dev-component");
 const DEV = {};
 const ERROR = Symbol("error");
+const BRANCH = Symbol("branch");
+function castError(err) {
+  if (err instanceof Error || typeof err === "string") return err;
+  return new Error("Unknown error");
+}
+function handleError(err) {
+  err = castError(err);
+  const fns = lookup(Owner, ERROR);
+  if (!fns) throw err;
+  for (const f of fns) f(err);
+}
 const UNOWNED = {
   context: null,
   owner: null
@@ -20,9 +31,7 @@ function createRoot(fn, detachedOwner) {
   try {
     result = fn(() => {});
   } catch (err) {
-    const fns = lookup(Owner, ERROR);
-    if (!fns) throw err;
-    fns.forEach(f => f(err));
+    handleError(err);
   } finally {
     Owner = owner;
   }
@@ -41,9 +50,7 @@ function createComputed(fn, value) {
   try {
     fn(value);
   } catch (err) {
-    const fns = lookup(Owner, ERROR);
-    if (!fns) throw err;
-    fns.forEach(f => f(err));
+    handleError(err);
   } finally {
     Owner = Owner.owner;
   }
@@ -64,9 +71,7 @@ function createMemo(fn, value) {
   try {
     v = fn(value);
   } catch (err) {
-    const fns = lookup(Owner, ERROR);
-    if (!fns) throw err;
-    fns.forEach(f => f(err));
+    handleError(err);
   } finally {
     Owner = Owner.owner;
   }
@@ -96,11 +101,25 @@ function on(deps, fn, options = {}) {
   };
 }
 function onMount(fn) {}
-function onCleanup(fn) {}
+function onCleanup(fn) {
+  let node;
+  if (Owner && (node = lookup(Owner, BRANCH))) {
+    if (!node.cleanups) node.cleanups = [fn];else node.cleanups.push(fn);
+  }
+  return fn;
+}
+function cleanNode(node) {
+  if (node.cleanups) {
+    for (let i = 0; i < node.cleanups.length; i++) node.cleanups[i]();
+    node.cleanups = undefined;
+  }
+}
 function onError(fn) {
-  if (Owner === null) console.warn("error handlers created outside a `createRoot` or `render` will never be run");else if (Owner.context === null) Owner.context = {
-    [ERROR]: [fn]
-  };else if (!Owner.context[ERROR]) Owner.context[ERROR] = [fn];else Owner.context[ERROR].push(fn);
+  if (Owner) {
+    if (Owner.context === null) Owner.context = {
+      [ERROR]: [fn]
+    };else if (!Owner.context[ERROR]) Owner.context[ERROR] = [fn];else Owner.context[ERROR].push(fn);
+  }
 }
 function getListener() {
   return null;
@@ -128,6 +147,8 @@ function runWithOwner(o, fn) {
   Owner = o;
   try {
     return fn();
+  } catch (err) {
+    handleError(err);
   } finally {
     Owner = prev;
   }
@@ -173,31 +194,33 @@ function mapArray(list, mapFn, options = {}) {
   } else if (options.fallback) s = [options.fallback()];
   return () => s;
 }
-function getSymbol() {
-  const SymbolCopy = Symbol;
-  return SymbolCopy.observable || "@@observable";
-}
 function observable(input) {
-  const $$observable = getSymbol();
   return {
     subscribe(observer) {
       if (!(observer instanceof Object) || observer == null) {
         throw new TypeError("Expected the observer to be an object.");
       }
-      const handler = "next" in observer ? observer.next : observer;
-      let complete = false;
-      createComputed(() => {
-        if (complete) return;
-        const v = input();
-        handler(v);
+      const handler = typeof observer === "function" ? observer : observer.next && observer.next.bind(observer);
+      if (!handler) {
+        return {
+          unsubscribe() {}
+        };
+      }
+      const dispose = createRoot(disposer => {
+        createEffect(() => {
+          const v = input();
+          untrack(() => handler(v));
+        });
+        return disposer;
       });
+      if (getOwner()) onCleanup(dispose);
       return {
         unsubscribe() {
-          complete = true;
+          dispose();
         }
       };
     },
-    [$$observable]() {
+    [Symbol.observable || "@@observable"]() {
       return this;
     }
   };
@@ -205,9 +228,11 @@ function observable(input) {
 function from(producer) {
   const [s, set] = createSignal(undefined);
   if ("subscribe" in producer) {
-    producer.subscribe(v => set(() => v));
+    const unsub = producer.subscribe(v => set(() => v));
+    onCleanup(() => "unsubscribe" in unsub ? unsub.unsubscribe() : unsub());
   } else {
-    producer(set);
+    const clean = producer(set);
+    onCleanup(clean);
   }
   return s;
 }
@@ -222,7 +247,7 @@ function resolveSSRNode(node) {
     for (let i = 0, len = node.length; i < len; i++) mapped += resolveSSRNode(node[i]);
     return mapped;
   }
-  if (t === "object") return resolveSSRNode(node.t);
+  if (t === "object") return node.t;
   if (t === "function") return resolveSSRNode(node());
   return String(node);
 }
@@ -311,16 +336,16 @@ function Switch(props) {
 function Match(props) {
   return props;
 }
-const NoErrors = {};
 function resetErrorBoundaries() {}
 function ErrorBoundary(props) {
-  let error = NoErrors,
-      res;
+  let error,
+      res,
+      clean,
+      sync = true;
   const ctx = sharedConfig.context;
   const id = ctx.id + ctx.count;
-  onError(err => error = err);
-  createMemo(() => res = props.children);
-  if (error !== NoErrors) {
+  function displayFallback() {
+    cleanNode(clean);
     ctx.writeResource(id, error, true);
     setHydrateContext({ ...ctx,
       count: 0
@@ -328,7 +353,23 @@ function ErrorBoundary(props) {
     const f = props.fallback;
     return typeof f === "function" && f.length ? f(error, () => {}) : f;
   }
-  return res;
+  onError(err => {
+    error = err;
+    !sync && ctx.replace("e" + id, displayFallback);
+    sync = true;
+  });
+  onCleanup(() => cleanNode(clean));
+  createMemo(() => {
+    Owner.context = {
+      [BRANCH]: clean = {}
+    };
+    return res = props.children;
+  });
+  if (error) return displayFallback();
+  sync = false;
+  return {
+    t: `<!e${id}>${resolveSSRNode(res)}<!/e${id}>`
+  };
 }
 const SuspenseContext = createContext();
 let resourceContext = null;
@@ -408,7 +449,7 @@ function createResource(source, fetcher, options = {}) {
         return res;
       }).catch(err => {
         read.loading = false;
-        read.error = error = err;
+        read.error = error = castError(err);
         p = null;
         notifySuspense(contexts);
       });
@@ -435,6 +476,7 @@ function lazy(fn) {
     return p;
   };
   const contexts = new Set();
+  setTimeout(load);
   const wrap = props => {
     load();
     const id = sharedConfig.context.id.slice(0, -1);
@@ -458,10 +500,11 @@ function lazy(fn) {
   return wrap;
 }
 function suspenseComplete(c) {
+  if (c.complete) return true;
   for (const r of c.resources.values()) {
     if (r.loading) return false;
   }
-  return true;
+  return c.complete = true;
 }
 function notifySuspense(contexts) {
   for (const c of contexts) {
@@ -484,9 +527,15 @@ function SuspenseList(props) {
 }
 function Suspense(props) {
   let done;
+  let clean;
   const ctx = sharedConfig.context;
   const id = ctx.id + ctx.count;
   const o = Owner;
+  if (o) {
+    if (o.context) o.context[BRANCH] = clean = {};else o.context = {
+      [BRANCH]: clean = {}
+    };
+  }
   const value = ctx.suspense[id] || (ctx.suspense[id] = {
     resources: new Map(),
     completed: () => {
@@ -494,7 +543,8 @@ function Suspense(props) {
       if (suspenseComplete(value)) {
         done(resolveSSRNode(res));
       }
-    }
+    },
+    complete: false
   });
   function runSuspense() {
     setHydrateContext({ ...ctx,
@@ -504,36 +554,35 @@ function Suspense(props) {
       return createComponent(SuspenseContext.Provider, {
         value,
         get children() {
+          clean && cleanNode(clean);
           return props.children;
         }
       });
     });
   }
   const res = runSuspense();
-  if (suspenseComplete(value)) {
-    ctx.writeResource(id, null);
-    return res;
-  }
+  if (suspenseComplete(value)) return res;
   onError(err => {
-    if (!done || !done(undefined, err)) throw err;
+    if (!done || !done(undefined, err)) {
+      if (o) runWithOwner(o.owner, () => {
+        throw err;
+      });else throw err;
+    }
   });
   done = ctx.async ? ctx.registerFragment(id) : undefined;
-  if (ctx.streaming) {
+  if (ctx.async) {
     setHydrateContext(undefined);
     const res = {
       t: `<span id="pl-${id}">${resolveSSRNode(props.fallback)}</span>`
     };
     setHydrateContext(ctx);
     return res;
-  } else if (ctx.async) {
-    return {
-      t: `<![${id}]>`
-    };
   }
   setHydrateContext({ ...ctx,
     count: 0,
     id: ctx.id + "0.f"
   });
+  ctx.writeResource(id, "$$f");
   return props.fallback;
 }