[]previous and next page

flushSync (@shadow-js/core/extend)

Runs fn (optional) in a batch and runs every pending effect before returning, so the DOM and other effects are up to date on the next line. (flushSync of @shadow-js/core/extend)

Runs fn (optional) in a batch and runs every pending effect before returning, so the DOM and other effects are up to date on the next line. Use it in tests and before reading layout. Called while a flush is running (from inside an effect), it only runs fn and leaves the effects to that flush; development builds warn FLUSH_IN_EFFECT.

Import#

ts
import { flushSync } from "@shadow-js/core/extend";

Signature#

ts
function flushSync<T = void>(fn?: () => T): T

Parameters#

Name Description
fn The writes to make first. Undefined only flushes.

Returns#

What fn returns, or undefined without fn.

Throws#

  • What fn throws, after the flush. An error of the flush is thrown as flush throws it (including ShadowError INFINITE_LOOP); when fn threw as well, both are thrown together as an AggregateError.

Examples#

ts
import { createRoot, flushSync, useEffect, useSignal } from "@shadow-js/core";

createRoot(() => {
  const [count, setCount] = useSignal(0);
  useEffect(() => console.log(count()));
  flushSync(); // logs 0
  flushSync(() => setCount(1)); // logs 1 before this line ends
});