@virtualstate/app-history/esnext/tests/examples/jsx.js

Native JavaScript [app-history](https://github.com/WICG/app-history) implementation

import { h, toString } from "@virtualstate/fringe";
import { AsyncEventTarget } from "../../event-target/index.js";
import { ok } from "../util.js";
const React = {
    createElement: h
};
export async function jsxExample(appHistory) {
    function Component({ caption, dateTaken }, input) {
        return h("figure", {}, h("date", {}, dateTaken), h("figcaption", {}, caption), input);
        // return (
        //     <figure>
        //         <date>{dateTaken}</date>
        //         <figcaption>{caption}</figcaption>
        //         {input}
        //     </figure>
        // )
    }
    const body = new AsyncEventTarget();
    let bodyUpdated;
    appHistory.addEventListener("currentchange", async (event) => {
        await (event.transitionWhile ?? (promise => promise))(bodyUpdated = handler());
        async function handler() {
            body.innerHTML = await new Promise((resolve, reject) => (toString(h(Component, { ...appHistory.current?.getState() })).then(resolve, reject)));
            console.log({ body: body.innerHTML });
        }
    });
    ok(!body.innerHTML);
    await appHistory.navigate('/', {
        state: {
            dateTaken: new Date().toISOString(),
            caption: `Photo taken on the date ${new Date().toDateString()}`
        }
    }).finished;
    // console.log(body.innerHTML);
    ok(bodyUpdated);
    await bodyUpdated;
    ok(body.innerHTML);
    const updatedCaption = `Photo ${Math.random()}`;
    ok(bodyUpdated);
    await bodyUpdated;
    ok(!body.innerHTML?.includes(updatedCaption));
    await appHistory.updateCurrent({
        state: {
            ...appHistory.current?.getState(),
            caption: updatedCaption
        }
    });
    ok(bodyUpdated);
    await bodyUpdated;
    // This test will fail if async resolution is not supported.
    ok(body.innerHTML?.includes(updatedCaption));
}
//# sourceMappingURL=jsx.js.map