import "https://esm.sh/preact@10.23.1/debug"; import * as Preact from "https://esm.sh/preact@10.23.1"; import * as React from "https://esm.sh/preact@10.23.1/compat"; const H = Preact.h; const SPOOF =(...args)=> { console.log("spoof state", ...args); const [hookGet, hookSet] = React.useState(...args); const spoofSetter = (...args)=>{ console.log("spoofed setter", ...args); hookSet(...args); } return [ hookGet, spoofSetter ] } function OptionsHook(key, hookNew) { const hookOld =Preact.options[key]; Preact.options[key] = hookOld ? (...args)=>{hookOld(...args); hookNew(...args);} : hookNew; } OptionsHook("__r", (/** @type {Preact.VNode}*/vnode)=> { console.log("render!"); console.log(); }); OptionsHook("__h", (component_instance, hook_index, hook_state)=> { console.log("Hook!") console.log(hook_index, hook_state); }) OptionsHook("__", (...args)=> { console.log("unknown!") console.log(...args); }) const Component =()=> { const [countGet, countSet] = SPOOF(12345); const [textGet, textSet] = SPOOF("Count is:"); return H("h1", {onClick(){countSet(countGet+1)}}, `${textGet} ${countGet}`); } const root = document.querySelector("#app")||document.body; Preact.render( H(Preact.Fragment, null, H(Component), H(Component), ), root);