@gluonjs/core / src / AsyncTimeoutError
Class: AsyncTimeoutError
Extends
Error
Constructors
Constructor
new AsyncTimeoutError(
timeout):AsyncTimeoutError
Parameters
timeout
number
Returns
AsyncTimeoutError
Overrides
Error.constructor
Properties
timeout
readonlytimeout:number
Example
Distinguish an asynchronous boundary timeout and inspect the configured millisecond deadline that expired:
import {
AsyncTimeoutError,
Suspense,
defineAsyncComponent,
html,
type AsyncComponent,
type AsyncComponentOptions,
type AsyncLoadContext,
type AsyncSource,
type SuspenseProps,
} from '@gluonjs/core';
type ProductProps = { id: string };
const options = {
loader: async ({ signal, attempt }: AsyncLoadContext) => {
if (signal.aborted) throw signal.reason;
console.log('load attempt', attempt);
return ({ id }: ProductProps) => html`<article>Product ${id}</article>`;
},
loading: ({ id }: ProductProps) => html`<p>Loading ${id}…</p>`,
error: (error: unknown, retry: () => void) => html`<button @click=${retry}>${String(error)}</button>`,
timeout: 5_000,
} satisfies AsyncComponentOptions<ProductProps>;
const ProductPage: AsyncComponent<ProductProps> = defineAsyncComponent(options);
await ProductPage.preload();
const source: AsyncSource<string> = async ({ signal }) => signal.aborted ? 'cancelled' : 'In stock';
const suspense = { source, fallback: html`<span>Checking…</span>`, children: (value: string) => html`<span>${value}</span>` } satisfies SuspenseProps<string>;
console.log(ProductPage.resolved, ProductPage({ id: 'orbit-lamp' }), Suspense(suspense));
ProductPage.reset();
console.log(new AsyncTimeoutError(5_000).timeout);