dom

func ScheduleRender(componentID string, html string, delay time.Duration)

{
	sched.Lock()
	defer sched.Unlock()
	if t, ok := sched.timers[componentID]; ok {
		t.Stop()
	}
	sched.timers[componentID] = time.AfterFunc(delay, func() {
		UpdateDOM(componentID, html)
		sched.Lock()
		delete(sched.timers, componentID)
		sched.Unlock()
	})
}

func SnapshotComponentSignals(componentID string) map[string]any

{
	componentSignalsMu.RLock()
	defer componentSignalsMu.RUnlock()
	if signals, ok := componentSignals[componentID]; ok {
		clone := make(map[string]any, len(signals))
		for k, v := range signals {
			clone[k] = v
		}
		return clone
	}
	return nil
}

func recoverDOMUpdate(componentID string)

{
	if recovered := recover(); recovered != nil {
		panicValue := recoveredDOMPanic{value: recovered, stack: debug.Stack()}
		if OnHandlerPanic == nil {
			log.Printf("[rfw] recovered DOM update panic for %s: %v\n%s", componentID, recovered, panicValue.stack)
			return
		}
		func() {
			defer func() {
				if hookPanic := recover(); hookPanic != nil {
					log.Printf("[rfw] DOM panic reporter failed: %v", hookPanic)
					log.Printf("[rfw] recovered DOM update panic for %s: %v\n%s", componentID, recovered, panicValue.stack)
				}
			}()
			OnHandlerPanic(panicValue, "DOM update: "+componentID)
		}()
	}
}

func ComponentRoot(id string) Element

{
	doc := Doc()
	if id == "" {
		return doc.ByID("app")
	}
	el := doc.Query(fmt.Sprintf("[data-component-id='%s']", id))
	if el.IsNull() || el.IsUndefined() {
		return doc.ByID("app")
	}
	return el
}

func UpdateDOM(componentID string, html string)

{
	defer recoverDOMUpdate(componentID)
	element := ComponentRoot(componentID)
	if element.IsNull() || element.IsUndefined() {
		return
	}
	activeForm := captureActiveFormState(element.Value)

	// Diff-patch only when the resolved element is the component's OWN root: that
	// is an in-place reactive update, where patching preserves focus/selection.
	// Otherwise the target is the #app fallback (a fresh mount or a route change,
	// since ComponentRoot falls back to #app when the component root is not yet
	// in the DOM). There, positionally diffing two different <root> trees leaves
	// stale nodes from the previous component, so replace wholesale instead.
	elID := element.Call("getAttribute", "data-component-id")
	if componentID != "" && elID.Truthy() && elID.String() == componentID {
		patchInnerHTML(element.Value, html)
	} else {
		element.Set("innerHTML", html)
		recordRenderedTree(element.Value)
	}

	if TemplateHook != nil {
		TemplateHook(componentID, html)
	}

	// Release the listeners of the previous render: rebinding below attaches
	// fresh ones and stale listeners on replaced nodes would leak.
	ReleaseInputBindings(componentID)

	BindStoreInputsForComponent(componentID, element.Value)
	BindSignalInputs(componentID, element.Value)
	BindASTStoreInputs(componentID, element.Value)
	BindASTSignalInputs(componentID, element.Value)
	activeForm.restore()
	UpdateLifecycleHooks(componentID)
}

func UpdateMountedDOM(componentID, html string)

{
	el := ComponentRoot(componentID)
	if el.IsNull() || el.IsUndefined() {
		return
	}
	id := el.Call("getAttribute", "data-component-id")
	if !id.Truthy() || id.String() != componentID {
		return
	}
	UpdateDOM(componentID, html)
}

func UpdateDOMIn(target Element, componentID, html string)

{
	defer recoverDOMUpdate(componentID)
	if target.IsNull() || target.IsUndefined() {
		return
	}
	target.Set("innerHTML", html)
	recordRenderedTree(target.Value)

	if TemplateHook != nil {
		TemplateHook(componentID, html)
	}

	ReleaseInputBindings(componentID)

	BindStoreInputsForComponent(componentID, target.Value)
	BindSignalInputs(componentID, target.Value)
	BindASTStoreInputs(componentID, target.Value)
	BindASTSignalInputs(componentID, target.Value)
	UpdateLifecycleHooks(componentID)
}

func BindASTStoreInputs(componentID string, element js.Value)

{
	inputs := element.Call("querySelectorAll", "[data-bind-store]")
	for i := 0; i < inputs.Length(); i++ {
		input := inputs.Index(i)
		if !componentOwnsElement(componentID, input) {
			continue
		}
		binding := input.Call("getAttribute", "data-bind-store").String()
		parts := strings.Split(binding, ".")
		if len(parts) != 3 {
			continue
		}
		module, storeName, key := parts[0], parts[1], parts[2]
		store := state.GlobalStoreManager.GetStore(module, storeName)
		if store == nil {
			continue
		}
		if StoreBindingHook != nil && componentID != "" {
			StoreBindingHook(componentID, module, storeName, key)
		}
		storeValue := store.Get(key)
		tag := strings.ToLower(input.Get("tagName").String())
		if tag == "input" {
			inputType := input.Get("type").String()
			if inputType == "checkbox" {
				if b, ok := storeValue.(bool); ok {
					setCheckedIfChanged(input, b)
				}
				ch, stop := events.Listen("change", input)
				addInputBindingStop(componentID, stop)
				go func(in js.Value, st *state.Store, k string) {
					for range ch {
						st.Set(k, in.Get("checked").Bool())
					}
				}(input, store, key)
				continue
			}
		}
		if storeValue == nil {
			storeValue = ""
		}
		setValueIfChanged(input, fmt.Sprintf("%v", storeValue))
		ch, stop := events.Listen("input", input)
		addInputBindingStop(componentID, stop)
		go func(in js.Value, st *state.Store, k string) {
			for event := range ch {
				if inputEventIsComposing(event) {
					continue
				}
				st.Set(k, in.Get("value").String())
			}
		}(input, store, key)
	}
}

func BindASTSignalInputs(componentID string, element js.Value)

{
	inputs := element.Call("querySelectorAll", "[data-bind-signal]")
	for i := 0; i < inputs.Length(); i++ {
		input := inputs.Index(i)
		if !componentOwnsElement(componentID, input) {
			continue
		}
		name := input.Call("getAttribute", "data-bind-signal").String()
		sig := getSignal(componentID, name)
		if sig == nil {
			continue
		}
		tag := strings.ToLower(input.Get("tagName").String())
		if tag == "input" {
			inputType := input.Get("type").String()
			if inputType == "checkbox" {
				if s, ok := sig.(interface {
					Read() any
					Set(bool)
				}); ok {
					if b, ok := s.Read().(bool); ok {
						setCheckedIfChanged(input, b)
					}
					ch, stop := events.Listen("change", input)
					addInputBindingStop(componentID, stop)
					go func(in js.Value, sg interface{ Set(bool) }) {
						for range ch {
							sg.Set(in.Get("checked").Bool())
						}
					}(input, s)
					continue
				}
			}
		}
		if s, ok := sig.(interface {
			Read() any
			Set(string)
		}); ok {
			setValueIfChanged(input, fmt.Sprintf("%v", s.Read()))
			ch, stop := events.Listen("input", input)
			addInputBindingStop(componentID, stop)
			go func(in js.Value, sg interface{ Set(string) }) {
				for event := range ch {
					if inputEventIsComposing(event) {
						continue
					}
					sg.Set(in.Get("value").String())
				}
			}(input, s)
		}
	}
}

func BindStoreInputsForComponent(componentID string, element js.Value)

{
	inputs := element.Call("querySelectorAll", "input, select, textarea")
	for i := 0; i < inputs.Length(); i++ {
		input := inputs.Index(i)
		if !componentOwnsElement(componentID, input) {
			continue
		}

		valueAttr := ""
		if input.Call("hasAttribute", "value").Bool() {
			valueAttr = input.Call("getAttribute", "value").String()
		}
		checkedAttr := ""
		if input.Call("hasAttribute", "checked").Bool() {
			checkedAttr = input.Call("getAttribute", "checked").String()
		}

		re := reStoreWrite
		valueMatch := re.FindStringSubmatch(valueAttr)
		checkedMatch := re.FindStringSubmatch(checkedAttr)

		var module, storeName, key string
		var usesChecked bool
		if len(valueMatch) == 4 {
			module, storeName, key = valueMatch[1], valueMatch[2], valueMatch[3]
		} else if len(checkedMatch) == 4 {
			module, storeName, key = checkedMatch[1], checkedMatch[2], checkedMatch[3]
			usesChecked = true
		} else {
			continue
		}

		store := state.GlobalStoreManager.GetStore(module, storeName)
		if store == nil {
			continue
		}

		if StoreBindingHook != nil && componentID != "" {
			StoreBindingHook(componentID, module, storeName, key)
		}

		storeValue := store.Get(key)

		if usesChecked {
			boolVal, _ := storeValue.(bool)
			setCheckedIfChanged(input, boolVal)
			ch, stop := events.Listen("change", input)
			addInputBindingStop(componentID, stop)
			go func(in js.Value, st *state.Store, k string) {
				for range ch {
					st.Set(k, in.Get("checked").Bool())
				}
			}(input, store, key)
			continue
		}

		if storeValue == nil {
			storeValue = ""
		}
		setValueIfChanged(input, fmt.Sprintf("%v", storeValue))
		ch, stop := events.Listen("input", input)
		addInputBindingStop(componentID, stop)
		go func(in js.Value, st *state.Store, k string) {
			for event := range ch {
				if inputEventIsComposing(event) {
					continue
				}
				st.Set(k, in.Get("value").String())
			}
		}(input, store, key)
	}
}

func BindSignalInputs(componentID string, element js.Value)

{
	inputs := element.Call("querySelectorAll", "input, select, textarea")
	for i := 0; i < inputs.Length(); i++ {
		input := inputs.Index(i)
		if !componentOwnsElement(componentID, input) {
			continue
		}

		valueAttr := ""
		if input.Call("hasAttribute", "value").Bool() {
			valueAttr = input.Call("getAttribute", "value").String()
		}
		checkedAttr := ""
		if input.Call("hasAttribute", "checked").Bool() {
			checkedAttr = input.Call("getAttribute", "checked").String()
		}

		re := reSignalWrite
		valueMatch := re.FindStringSubmatch(valueAttr)
		checkedMatch := re.FindStringSubmatch(checkedAttr)

		var name string
		var usesChecked bool
		if len(valueMatch) == 2 {
			name = valueMatch[1]
		} else if len(checkedMatch) == 2 {
			name = checkedMatch[1]
			usesChecked = true
		} else {
			continue
		}

		sig := getSignal(componentID, name)
		if sig == nil {
			continue
		}

		if usesChecked {
			if s, ok := sig.(interface {
				Read() any
				Set(bool)
			}); ok {
				if b, ok := s.Read().(bool); ok {
					setCheckedIfChanged(input, b)
				}
				ch, stop := events.Listen("change", input)
				addInputBindingStop(componentID, stop)
				go func(in js.Value, sg interface{ Set(bool) }) {
					for range ch {
						sg.Set(in.Get("checked").Bool())
					}
				}(input, s)
			}
			continue
		}

		if s, ok := sig.(interface {
			Read() any
			Set(string)
		}); ok {
			setValueIfChanged(input, fmt.Sprintf("%v", s.Read()))
			ch, stop := events.Listen("input", input)
			addInputBindingStop(componentID, stop)
			go func(in js.Value, sg interface{ Set(string) }) {
				for event := range ch {
					if inputEventIsComposing(event) {
						continue
					}
					sg.Set(in.Get("value").String())
				}
			}(input, s)
		}
	}
}

func TestPatchFocusedNumberInputPreservesLiveValue(t *testing.T)

{
	body := js.Doc().Get("body")
	root := CreateElement("root")
	root.SetAttr("data-component-id", "number-input")
	root.SetHTML(`<input id="stake" type="number" value="25"><span>old</span>`)
	body.Call("appendChild", root.Value)
	defer root.Call("remove")

	input := root.Query("#stake")
	input.SetValue("28")
	input.Call("focus")

	patchInnerHTML(root.Value, `<root data-component-id="number-input"><input id="stake" type="number" value="25"><span>new</span></root>`)

	patched := root.Query("#stake")
	if !patched.Equal(input.Value) {
		t.Fatal("number input was replaced")
	}
	if got := patched.Val(); got != "28" {
		t.Fatalf("number input value = %q, want 28", got)
	}
	if !js.Doc().Get("activeElement").Equal(patched.Value) {
		t.Fatal("number input lost focus")
	}
	if got := root.Query("span").Text(); got != "new" {
		t.Fatalf("patched text = %q, want new", got)
	}
}

func TestPatchPreservesFocusedTextInputIdentityAndCaret(t *testing.T)

{
	body := js.Doc().Get("body")
	root := CreateElement("root")
	root.SetAttr("data-component-id", "search-input")
	root.SetHTML(`<input type="search" value="china"><span>old</span>`)
	body.Call("appendChild", root.Value)
	defer root.Call("remove")

	input := root.Query("input")
	input.SetValue("chinaa")
	input.Call("focus")
	input.Call("setSelectionRange", 2, 4, "forward")

	patchInnerHTML(root.Value, `<root data-component-id="search-input"><input type="search" value="server"><span>new</span></root>`)

	patched := root.Query("input")
	if !patched.Equal(input.Value) {
		t.Fatal("search input was replaced")
	}
	if !js.Doc().Get("activeElement").Equal(patched.Value) {
		t.Fatal("search input lost focus")
	}
	if got := patched.Val(); got != "chinaa" {
		t.Fatalf("live input value = %q, want chinaa", got)
	}
	if got := patched.Get("selectionStart").Int(); got != 2 {
		t.Fatalf("selection start = %d, want 2", got)
	}
	if got := patched.Get("selectionEnd").Int(); got != 4 {
		t.Fatalf("selection end = %d, want 4", got)
	}
}

func TestPatchDoesNotRestoreDeliberatelyBlurredInput(t *testing.T)

{
	body := js.Doc().Get("body")
	root := CreateElement("root")
	root.SetAttr("data-component-id", "blurred-input")
	root.SetHTML(`<input type="search"><button>Apply</button>`)
	body.Call("appendChild", root.Value)
	defer root.Call("remove")

	input := root.Query("input")
	input.Call("focus")
	input.Call("blur")

	patchInnerHTML(root.Value, `<root data-component-id="blurred-input"><input type="search"><button>Updated</button></root>`)

	if js.Doc().Get("activeElement").Equal(input.Value) {
		t.Fatal("patch restored focus after an explicit blur")
	}
}

func TestPatchPreservesUncontrolledFormProperties(t *testing.T)

{
	body := js.Doc().Get("body")
	root := CreateElement("root")
	root.SetAttr("data-component-id", "form-state")
	root.SetHTML(`<textarea>initial</textarea><input type="checkbox"><input type="radio" name="choice"><select><option>A</option><option>B</option></select>`)
	body.Call("appendChild", root.Value)
	defer root.Call("remove")

	textarea := root.Query("textarea")
	checkbox := root.Query(`input[type="checkbox"]`)
	radio := root.Query(`input[type="radio"]`)
	selectEl := root.Query("select")
	textarea.SetValue("operator text")
	checkbox.Set("checked", true)
	radio.Set("checked", true)
	selectEl.Set("selectedIndex", 1)

	patchInnerHTML(root.Value, `<root data-component-id="form-state"><textarea>server text</textarea><input type="checkbox"><input type="radio" name="choice"><select><option selected>A</option><option>B</option></select></root>`)

	if !root.Query("textarea").Equal(textarea.Value) || root.Query("textarea").Val() != "operator text" {
		t.Fatal("textarea identity or live value was not preserved")
	}
	if !root.Query(`input[type="checkbox"]`).Equal(checkbox.Value) || !checkbox.Checked() {
		t.Fatal("checkbox identity or checked state was not preserved")
	}
	if !root.Query(`input[type="radio"]`).Equal(radio.Value) || !radio.Checked() {
		t.Fatal("radio identity or checked state was not preserved")
	}
	if !root.Query("select").Equal(selectEl.Value) || selectEl.Get("selectedIndex").Int() != 1 {
		t.Fatal("select identity or selected option was not preserved")
	}
}

func TestPatchPreservesAndReordersKeyedNodes(t *testing.T)

{
	body := js.Doc().Get("body")
	root := CreateElement("root")
	root.SetAttr("data-component-id", "keyed-list")
	root.SetHTML(`<ul><li data-key="a">A</li><li data-key="b">B</li></ul>`)
	body.Call("appendChild", root.Value)
	defer root.Call("remove")

	a := root.Query(`[data-key="a"]`)
	b := root.Query(`[data-key="b"]`)
	patchInnerHTML(root.Value, `<root data-component-id="keyed-list"><ul><li data-key="b">B2</li><li data-key="a">A2</li><li data-key="c">C</li></ul></root>`)

	rows := root.QueryAll("li")
	if rows.Length() != 3 || !rows.Index(0).Equal(b.Value) || !rows.Index(1).Equal(a.Value) {
		t.Fatalf("keyed rows lost identity or order: %s", root.HTML())
	}
	if rows.Index(0).Text() != "B2" || rows.Index(1).Text() != "A2" {
		t.Fatalf("keyed row contents were not patched: %s", root.HTML())
	}
}

func TestInvalidPatchPlanLeavesDOMUntouched(t *testing.T)

{
	body := js.Doc().Get("body")
	root := CreateElement("root")
	root.SetAttr("data-component-id", "atomic-plan")
	root.SetHTML(`<ul><li data-key="a">A</li><li data-key="b">B</li></ul>`)
	body.Call("appendChild", root.Value)
	defer root.Call("remove")

	before := root.HTML()
	a := root.Query(`[data-key="a"]`)
	var recovered any
	func() {
		defer func() { recovered = recover() }()
		patchInnerHTML(root.Value, `<root data-component-id="atomic-plan"><ul><li data-key="a">changed</li><li data-key="a">duplicate</li></ul></root>`)
	}()

	if recovered == nil {
		t.Fatal("duplicate identity did not reject the patch")
	}
	if got := root.HTML(); got != before {
		t.Fatalf("invalid plan mutated DOM: got %s, want %s", got, before)
	}
	if !root.Query(`[data-key="a"]`).Equal(a.Value) {
		t.Fatal("invalid plan replaced a node before failing")
	}
}

func TestKeyIdentityIsScopedToItsLoop(t *testing.T)

{
	body := js.Doc().Get("body")
	root := CreateElement("root")
	root.SetAttr("data-component-id", "loop-scopes")
	root.SetHTML(`<section><i data-for="first" data-key="0">A</i><i data-for="second" data-key="0">B</i></section>`)
	body.Call("appendChild", root.Value)
	defer root.Call("remove")

	patchInnerHTML(root.Value, `<root data-component-id="loop-scopes"><section><i data-for="first" data-key="0">A2</i><i data-for="second" data-key="0">B2</i></section></root>`)
	rows := root.QueryAll("i")
	if rows.Length() != 2 || rows.Index(0).Text() != "A2" || rows.Index(1).Text() != "B2" {
		t.Fatalf("loop-scoped keys were treated as duplicates: %s", root.HTML())
	}
}

func TestPatchRespectsNestedDOMOwnership(t *testing.T)

{
	body := js.Doc().Get("body")
	root := CreateElement("root")
	root.SetAttr("data-component-id", "shell")
	root.SetHTML(`<span data-shell>old</span><root data-component-id="child"><div data-child>rendered</div></root><div data-router-outlet><root data-component-id="page"><div data-page>mounted</div></root></div>`)
	body.Call("appendChild", root.Value)
	defer root.Call("remove")

	child := root.Query(`[data-component-id="child"]`)
	page := root.Query(`[data-component-id="page"]`)
	child.Query("[data-child]").SetHTML("imperative child")
	page.Query("[data-page]").SetHTML("imperative page")

	patchInnerHTML(root.Value, `<root data-component-id="shell"><span data-shell>new</span><root data-component-id="child"><div data-child>stale render</div></root><div data-router-outlet><p>empty render</p></div></root>`)

	if root.Query("[data-shell]").Text() != "new" {
		t.Fatal("shell-owned node was not patched")
	}
	if !root.Query(`[data-component-id="child"]`).Equal(child.Value) || child.Query("[data-child]").Text() != "imperative child" {
		t.Fatal("parent patch crossed child component ownership")
	}
	if !root.Query(`[data-component-id="page"]`).Equal(page.Value) || page.Query("[data-page]").Text() != "imperative page" {
		t.Fatal("parent patch crossed router outlet ownership")
	}
}

func TestPatchPreservesLiveAttributesUntilTemplateChangesThem(t *testing.T)

{
	body := js.Doc().Get("body")
	root := CreateElement("root")
	root.SetAttr("data-component-id", "live-attributes")
	root.SetHTML(`<section class="panel" aria-expanded="false"><span>old</span></section>`)
	recordRenderedTree(root.Value)
	body.Call("appendChild", root.Value)
	defer root.Call("remove")

	panel := root.Query("section")
	panel.AddClass("open")
	panel.SetAttr("aria-expanded", "true")
	patchInnerHTML(root.Value, `<root data-component-id="live-attributes"><section class="panel" aria-expanded="false"><span>new</span></section></root>`)
	if !panel.HasClass("open") || panel.Attr("aria-expanded") != "true" {
		t.Fatalf("unchanged template attributes erased live state: %s", root.HTML())
	}
	if panel.Query("span").Text() != "new" {
		t.Fatal("attribute preservation blocked descendant patching")
	}

	patchInnerHTML(root.Value, `<root data-component-id="live-attributes"><section class="panel disabled" aria-expanded="mixed"><span>latest</span></section></root>`)
	if panel.Attr("class") != "panel disabled" || panel.Attr("aria-expanded") != "mixed" {
		t.Fatalf("changed template attributes did not take ownership: %s", root.HTML())
	}
}

func TestUpdateDOMRecoversAndAcceptsNextUpdate(t *testing.T)

{
	body := js.Doc().Get("body")
	root := CreateElement("root")
	root.SetAttr("data-component-id", "recover-update")
	root.SetHTML("<span>old</span>")
	body.Call("appendChild", root.Value)
	defer root.Call("remove")

	previousHook := TemplateHook
	previousPanic := OnHandlerPanic
	defer func() {
		TemplateHook = previousHook
		OnHandlerPanic = previousPanic
	}()
	recovered := 0
	OnHandlerPanic = func(any, string) { recovered++ }
	TemplateHook = func(string, string) { panic("template hook") }

	UpdateDOM("recover-update", `<root data-component-id="recover-update"><span>first</span></root>`)
	TemplateHook = nil
	UpdateDOM("recover-update", `<root data-component-id="recover-update"><span>second</span></root>`)

	if recovered != 1 {
		t.Fatalf("recovered updates = %d, want 1", recovered)
	}
	if got := root.Query("span").Text(); got != "second" {
		t.Fatalf("next update text = %q, want second", got)
	}
}

func TestDOMReporterPanicLogsOriginalFailure(t *testing.T)

{
	previousPanic := OnHandlerPanic
	previousWriter := log.Writer()
	var output bytes.Buffer
	OnHandlerPanic = func(any, string) { panic("reporter failure") }
	log.SetOutput(&output)
	defer func() {
		OnHandlerPanic = previousPanic
		log.SetOutput(previousWriter)
	}()

	func() {
		defer recoverDOMUpdate("broken-component")
		panic("original failure")
	}()

	logs := output.String()
	if !strings.Contains(logs, "DOM panic reporter failed: reporter failure") {
		t.Fatalf("missing reporter failure log: %s", logs)
	}
	if !strings.Contains(logs, "recovered DOM update panic for broken-component: original failure") {
		t.Fatalf("missing original failure log: %s", logs)
	}
}

func RegisterComponentHandler(componentID, name string, fn func(this js.Value, args []js.Value) any)

{
	handlerMu.Lock()
	defer handlerMu.Unlock()
	if componentHandlerRegistry[componentID] == nil {
		componentHandlerRegistry[componentID] = make(map[string]js.Func)
	}
	if old, ok := componentHandlerRegistry[componentID][name]; ok {
		old.Release()
	}
	componentHandlerRegistry[componentID][name] = js.SafeFuncOf(fn)
}

func RegisterHandlerElem(name string, fn func(el Element, evt Event))

{
	RegisterHandler(name, func(_ js.Value, args []js.Value) any {
		var evt, el js.Value
		if len(args) > 0 {
			evt = args[0]
		}
		if len(args) > 1 {
			el = args[1]
		} else if evt.Truthy() {
			el = evt.Get("target")
		}
		fn(Element{el}, Event{evt})
		return nil
	})
}

func DelegateEvents(componentID string, root js.Value)

{
	RemoveDelegatedEvents(componentID, root)

	var handlers []delegatedHandler
	events := []string{"click", "submit", "input", "change", "keydown", "keyup", "focus", "blur"}
	for _, evtName := range events {
		for _, capture := range []bool{false, true} {
			if (evtName == "focus" || evtName == "blur") && !capture {
				continue
			}
			handler := newDelegatedHandler(componentID, root, evtName, capture)
			handlers = append(handlers, handler)
			root.Call("addEventListener", evtName, handler.fn, capture)
		}
	}
	delegateMu.Lock()
	delegates[componentID] = handlers
	delegateMu.Unlock()
}

func newDelegatedHandler(componentID string, root js.Value, event string, capture bool) delegatedHandler

{
	var timerMu sync.Mutex
	timers := make(map[string]*time.Timer)
	throttled := make(map[string]time.Time)

	fn := js.SafeFuncOf(func(_ js.Value, args []js.Value) any {
		if len(args) == 0 {
			return nil
		}
		evt := args[0]
		target := evt.Get("target")
		for target.Truthy() {
			handlerName := target.Call("getAttribute", "data-on-"+event)
			if handlerName.Truthy() {
				modifiers := eventModifiers(target, event)
				_, wantsCapture := modifiers["capture"]
				nonBubbling := event == "focus" || event == "blur"
				if (nonBubbling || wantsCapture == capture) && eventAllowed(evt, target, modifiers) {
					h := GetComponentHandler(componentID, handlerName.String())
					if h.Truthy() {
						key := eventBindingKey(target, event, handlerName.String())
						if !claimEventBinding(evt, key) {
							if target.Equal(root) {
								break
							}
							target = target.Get("parentElement")
							continue
						}
						if _, ok := modifiers["prevent"]; ok {
							if _, passive := modifiers["passive"]; !passive {
								evt.Call("preventDefault")
							}
						}
						if _, ok := modifiers["stop"]; ok {
							evt.Call("stopPropagation")
						}
						if _, ok := modifiers["once"]; ok {
							target.Call("removeAttribute", "data-on-"+event)
							target.Call("removeAttribute", "data-on-"+event+"-modifiers")
						}

						invoke := func() {
							defer func() {
								if r := recover(); r != nil && OnHandlerPanic != nil {
									OnHandlerPanic(r, handlerName.String())
								}
							}()
							h.Invoke(evt, target)
						}
						if delay, ok := modifierDelay(modifiers, "debounce"); ok {
							timerMu.Lock()
							if timer := timers[key]; timer != nil {
								timer.Stop()
							}
							var scheduled *time.Timer
							scheduled = time.AfterFunc(delay, func() {
								invoke()
								timerMu.Lock()
								if timers[key] == scheduled {
									delete(timers, key)
								}
								timerMu.Unlock()
							})
							timers[key] = scheduled
							timerMu.Unlock()
							return nil
						}
						if delay, ok := modifierDelay(modifiers, "throttle"); ok {
							timerMu.Lock()
							last := throttled[key]
							if time.Since(last) < delay {
								timerMu.Unlock()
								return nil
							}
							throttled[key] = time.Now()
							timerMu.Unlock()
						}
						invoke()
						return nil
					}
				}
			}
			if target.Equal(root) {
				break
			}
			target = target.Get("parentElement")
		}
		return nil
	})

	stop := func() {
		timerMu.Lock()
		for _, timer := range timers {
			timer.Stop()
		}
		clear(timers)
		clear(throttled)
		timerMu.Unlock()
	}
	return delegatedHandler{event: event, capture: capture, fn: fn, stop: stop}
}

func claimEventBinding(evt js.Value, key string) bool

{
	const property = "__rfwDelegatedClaims"
	claims := evt.Get(property)
	if claims.Type() != js.TypeObject {
		claims = js.NewDict().Value
		evt.Set(property, claims)
	}
	if claims.Get(key).Truthy() {
		return false
	}
	claims.Set(key, true)
	return true
}

func eventModifiers(target js.Value, event string) map[string]struct{}

{
	raw := target.Call("getAttribute", "data-on-"+event+"-modifiers")
	modifiers := make(map[string]struct{})
	if !raw.Truthy() {
		return modifiers
	}
	for _, modifier := range strings.Split(raw.String(), ",") {
		modifier = strings.ToLower(strings.TrimSpace(modifier))
		if modifier != "" {
			modifiers[modifier] = struct{}{}
		}
	}
	return modifiers
}

func eventAllowed(evt, target js.Value, modifiers map[string]struct{}) bool

{
	if _, ok := modifiers["self"]; ok && !evt.Get("target").Equal(target) {
		return false
	}
	keys := map[string]string{
		"enter": "Enter", "escape": "Escape", "tab": "Tab", "space": " ",
		"up": "ArrowUp", "down": "ArrowDown", "left": "ArrowLeft", "right": "ArrowRight",
	}
	for modifier, key := range keys {
		if _, ok := modifiers[modifier]; ok && evt.Get("key").String() != key {
			return false
		}
	}
	system := map[string]string{"ctrl": "ctrlKey", "shift": "shiftKey", "alt": "altKey", "meta": "metaKey"}
	for modifier, property := range system {
		if _, ok := modifiers[modifier]; ok && !evt.Get(property).Bool() {
			return false
		}
	}
	if _, exact := modifiers["exact"]; exact {
		for modifier, property := range system {
			_, required := modifiers[modifier]
			if evt.Get(property).Bool() != required {
				return false
			}
		}
	}
	return true
}

func modifierDelay(modifiers map[string]struct{}, name string) (time.Duration, bool)

{
	if _, ok := modifiers[name]; !ok {
		return 0, false
	}
	delay := 300
	for modifier := range modifiers {
		if ms, err := strconv.Atoi(modifier); err == nil && ms >= 0 {
			delay = ms
			break
		}
	}
	return time.Duration(delay) * time.Millisecond, true
}

func RemoveDelegatedEvents(componentID string, root js.Value)

{
	delegateMu.Lock()
	handlers, ok := delegates[componentID]
	if ok {
		delete(delegates, componentID)
	}
	delegateMu.Unlock()
	if !ok {
		return
	}
	// A root that is already gone (its subtree was replaced) cannot have its
	// listeners detached, but the callbacks still have to be released.
	live := root.Truthy()
	for _, handler := range handlers {
		if live {
			root.Call("removeEventListener", handler.event, handler.fn.Value, handler.capture)
		}
		handler.stop()
		handler.fn.Release()
	}
}

func RegisterLifecycleHook(componentID string, hook LifecycleHook) func()

{
	record := &lifecycleRecord{id: lifecycleHooks.sequence.Add(1), hook: hook}
	lifecycleHooks.Lock()
	component := lifecycleHooks.components[componentID]
	if component == nil {
		component = &componentLifecycle{}
		lifecycleHooks.components[componentID] = component
	}
	component.hooks = append(component.hooks, record)
	mounted := component.mounted
	lifecycleHooks.Unlock()

	if mounted && hook.Mounted != nil {
		record.setCleanup(runMountedHook(componentID, hook.Mounted, ownComponentRoot(componentID)))
	}
	var once sync.Once
	return func() {
		once.Do(func() {
			lifecycleHooks.Lock()
			component := lifecycleHooks.components[componentID]
			if component != nil {
				for index, candidate := range component.hooks {
					if candidate.id == record.id {
						component.hooks = append(component.hooks[:index], component.hooks[index+1:]...)
						break
					}
				}
				if len(component.hooks) == 0 {
					delete(lifecycleHooks.components, componentID)
				}
			}
			cleanup := record.takeCleanup(true)
			lifecycleHooks.Unlock()
			if cleanup != nil {
				cleanup()
			}
		})
	}
}

func MountLifecycleHooks(componentID string)

{
	lifecycleHooks.Lock()
	component := lifecycleHooks.components[componentID]
	if component == nil || component.mounted {
		lifecycleHooks.Unlock()
		return
	}
	component.mounted = true
	hooks := append([]*lifecycleRecord(nil), component.hooks...)
	lifecycleHooks.Unlock()
	root := ownComponentRoot(componentID)
	for _, record := range hooks {
		if record.hook.Mounted != nil {
			record.setCleanup(runMountedHook(componentID, record.hook.Mounted, root))
		}
	}
}

func UpdateLifecycleHooks(componentID string)

{
	lifecycleHooks.Lock()
	component := lifecycleHooks.components[componentID]
	if component == nil || !component.mounted {
		lifecycleHooks.Unlock()
		return
	}
	hooks := append([]*lifecycleRecord(nil), component.hooks...)
	lifecycleHooks.Unlock()
	root := ownComponentRoot(componentID)
	for _, record := range hooks {
		if record.hook.Updated != nil {
			runLifecycleHook(componentID, "updated", func() {
				record.hook.Updated(root)
			})
		}
	}
}

func UnmountLifecycleHooks(componentID string)

{
	lifecycleHooks.Lock()
	component := lifecycleHooks.components[componentID]
	if component == nil || !component.mounted {
		lifecycleHooks.Unlock()
		return
	}
	component.mounted = false
	hooks := append([]*lifecycleRecord(nil), component.hooks...)
	lifecycleHooks.Unlock()
	root := ownComponentRoot(componentID)
	for index := len(hooks) - 1; index >= 0; index-- {
		record := hooks[index]
		if cleanup := record.takeCleanup(false); cleanup != nil {
			runLifecycleHook(componentID, "cleanup", cleanup)
		}
		if record.hook.Unmounted != nil {
			runLifecycleHook(componentID, "unmounted", func() {
				record.hook.Unmounted(root)
			})
		}
	}
}

func RegisterBindings(id, name, template string)

{
	if bs, ok := precompiledByName[name]; ok {
		compiledBindings[id] = bs
		return
	}
	bs, err := parseTemplate(template)
	if err != nil {
		return
	}
	precompiledByName[name] = bs
	compiledBindings[id] = bs
}

func collectBindings(n *html.Node, path []int) []binding

{
	var res []binding
	if n.Type == html.ElementNode {
		attrs := map[string]string{}
		for _, a := range n.Attr {
			attrs[a.Key] = a.Val
		}
		for k, v := range attrs {
			if strings.HasPrefix(k, "data-on-") && !strings.HasSuffix(k, "-modifiers") {
				event := strings.TrimPrefix(k, "data-on-")
				mods := []string{}
				if m, ok := attrs[fmt.Sprintf("data-on-%s-modifiers", event)]; ok && m != "" {
					for _, s := range strings.Split(m, ",") {
						s = strings.TrimSpace(s)
						if s != "" {
							mods = append(mods, s)
						}
					}
				}
				res = append(res, binding{Path: append([]int(nil), path...), Event: event, Handler: v, Modifiers: mods})
			}
		}
	}
	child := n.FirstChild
	idx := 0
	for child != nil {
		res = append(res, collectBindings(child, append(path, idx))...)
		child = child.NextSibling
		idx++
	}
	return res
}

func replaceEventHandlers(template string) string

{
	return eventRegex.ReplaceAllStringFunc(template, func(match string) string {
		parts := eventRegex.FindStringSubmatch(match)
		if len(parts) != 5 {
			return match
		}
		fullEvent := parts[2]
		handler := parts[3]
		suffix := parts[4]
		eventParts := strings.Split(fullEvent, ".")
		event := eventParts[0]
		modifiers := []string{}
		if len(eventParts) > 1 {
			modifiers = eventParts[1:]
		}
		attr := fmt.Sprintf("data-on-%s=\"%s\"", event, handler)
		if len(modifiers) > 0 {
			attr += fmt.Sprintf(" data-on-%s-modifiers=\"%s\"", event, strings.Join(modifiers, ","))
		}
		return attr + suffix
	})
}

func TestNullElementIsInert(t *testing.T)

{
	el := Doc().Query("#does-not-exist")
	el.SetHTML("<b>x</b>")
	el.SetText("x")
	el.SetAttr("a", "b")
	el.SetStyle("color", "red")
	el.SetValue("v")
	el.AddClass("c")
	el.RemoveClass("c")
	el.ToggleClass("c")
	if el.Text() != "" || el.HTML() != "" || el.Val() != "" || el.Attr("a") != "" ||
		el.Checked() || el.HasClass("c") || el.Data("x") != "" {
		t.Fatalf("null element readers must return zero values")
	}
}

func ExpandEvents(markup string) string

{
	return reExpandEvent.ReplaceAllStringFunc(markup, func(match string) string {
		parts := reExpandEvent.FindStringSubmatch(match)
		if len(parts) != 5 {
			return match
		}
		fullEvent := parts[2]
		handler := parts[3]
		suffix := parts[4]
		eventParts := strings.Split(fullEvent, ".")
		event := eventParts[0]
		attr := fmt.Sprintf("data-on-%s=%q", event, handler)
		if len(eventParts) > 1 {
			attr += fmt.Sprintf(" data-on-%s-modifiers=%q", event, strings.Join(eventParts[1:], ","))
		}
		return attr + suffix
	})
}

func patchInnerHTML(element js.Value, html string)

{
	template := CreateElement("template")
	template.Set("innerHTML", html)
	newContent := template.Get("content")

	ownerID := attribute(element, "data-component-id")
	plan := &patchPlan{ownerID: ownerID}
	firstChild := newContent.Get("firstChild")
	if firstChild.Truthy() && firstChild.Get("nodeName").String() == "ROOT" &&
		ownerID != "" && attribute(firstChild, "data-component-id") == ownerID {
		if err := plan.planNode(element, firstChild); err != nil {
			panic(err)
		}
	} else if err := plan.planChildren(element, newContent); err != nil {
		panic(err)
	}
	plan.commit()
}

func indexIdentities(children []js.Value) (map[string]int, error)

{
	indexed := make(map[string]int)
	for index, child := range children {
		identity := nodeIdentity(child)
		if identity == "" {
			continue
		}
		if _, exists := indexed[identity]; exists {
			return nil, fmt.Errorf("rfw DOM patch: duplicate sibling identity %q", identity)
		}
		indexed[identity] = index
	}
	return indexed, nil
}

func nodeIdentity(node js.Value) string

{
	if node.Get("nodeType").Int() != 1 {
		return ""
	}
	if key := attribute(node, "data-key"); key != "" {
		return "key:" + attribute(node, "data-for") + ":" + key
	}
	for _, candidate := range []struct {
		attribute string
		prefix    string
	}{
		{"data-component-id", "component:"},
		{"data-condition", "condition:"},
		{"data-for-anchor", "for-anchor:"},
		{"data-portal-id", "portal:"},
	} {
		if value := attribute(node, candidate.attribute); value != "" {
			return candidate.prefix + value
		}
	}
	if node.Call("hasAttribute", "data-router-outlet").Bool() {
		return "router-outlet"
	}
	if node.Call("hasAttribute", "data-portal-anchor").Bool() {
		return "portal-anchor"
	}
	if node.Call("hasAttribute", "data-keepalive-host").Bool() {
		return "keepalive-host"
	}
	return ""
}

func significantChildren(parent js.Value) []js.Value

{
	children := parent.Get("childNodes")
	out := make([]js.Value, 0, children.Length())
	for i := 0; i < children.Length(); i++ {
		child := children.Index(i)
		if child.Get("nodeType").Int() == 3 && strings.TrimSpace(child.Get("nodeValue").String()) == "" {
			continue
		}
		out = append(out, child)
	}
	return out
}

func attributeSnapshot(node js.Value) map[string]string

{
	attributes := make(map[string]string)
	if node.Get("nodeType").Int() != 1 {
		return attributes
	}
	names := node.Call("getAttributeNames")
	for i := 0; i < names.Length(); i++ {
		name := names.Index(i).String()
		attributes[name] = node.Call("getAttribute", name).String()
	}
	return attributes
}

func renderedAttributes(node js.Value) map[string]string

{
	rendered := node.Get(renderedAttrsProperty)
	if rendered.Type() != js.TypeObject {
		return attributeSnapshot(node)
	}
	attributes := make(map[string]string)
	keys := js.Object().Call("keys", rendered)
	for i := 0; i < keys.Length(); i++ {
		name := keys.Index(i).String()
		attributes[name] = rendered.Get(name).String()
	}
	return attributes
}

func recordRenderedTreeFromSource(node, source js.Value)

{
	if node.Get("nodeType").Int() == 1 && source.Get("nodeType").Int() == 1 {
		setRenderedAttributes(node, attributeSnapshot(source))
	}
	nodeChildren := node.Get("childNodes")
	sourceChildren := source.Get("childNodes")
	limit := nodeChildren.Length()
	if sourceChildren.Length() < limit {
		limit = sourceChildren.Length()
	}
	for i := 0; i < limit; i++ {
		recordRenderedTreeFromSource(nodeChildren.Index(i), sourceChildren.Index(i))
	}
}

func captureLiveFormState(existing, replacement js.Value) *liveFormState

{
	controlled := isControlledForm(existing) || isControlledForm(replacement)
	tag := existing.Get("nodeName").String()
	state := &liveFormState{}
	switch tag {
	case "INPUT":
		if !controlled {
			state.value = existing.Get("value").String()
			state.hasValue = true
		}
		typ := strings.ToLower(existing.Get("type").String())
		if !controlled && (typ == "checkbox" || typ == "radio") {
			state.checked = existing.Get("checked").Bool()
			state.hasChecked = true
		}
	case "TEXTAREA":
		if !controlled {
			state.value = existing.Get("value").String()
			state.hasValue = true
		}
	case "SELECT":
		if !controlled {
			state.selectedIndex = existing.Get("selectedIndex").Int()
			state.hasSelected = true
		}
	default:
		return nil
	}
	active := js.Global().Get("document").Get("activeElement")
	if active.Truthy() && active.Equal(existing) {
		start := existing.Get("selectionStart")
		end := existing.Get("selectionEnd")
		if start.Type() == js.TypeNumber && end.Type() == js.TypeNumber {
			state.selectionAt = start.Int()
			state.selectionEnd = end.Int()
			direction := existing.Get("selectionDirection")
			if direction.Type() == js.TypeString {
				state.selectionDir = direction.String()
			}
			state.hasCaret = true
		}
	}
	return state
}

func restoreLiveFormState(element js.Value, state liveFormState)

{
	if state.hasValue && element.Get("value").String() != state.value {
		element.Set("value", state.value)
	}
	if state.hasChecked && element.Get("checked").Bool() != state.checked {
		element.Set("checked", state.checked)
	}
	if state.hasSelected && element.Get("selectedIndex").Int() != state.selectedIndex {
		element.Set("selectedIndex", state.selectedIndex)
	}
	if state.hasCaret {
		setter := element.Get("setSelectionRange")
		if setter.Type() == js.TypeFunction {
			if state.selectionDir != "" {
				element.Call("setSelectionRange", state.selectionAt, state.selectionEnd, state.selectionDir)
			} else {
				element.Call("setSelectionRange", state.selectionAt, state.selectionEnd)
			}
		}
	}
}

func isControlledForm(node js.Value) bool

{
	if node.Get("nodeType").Int() != 1 {
		return false
	}
	if node.Call("hasAttribute", "data-bind-store").Bool() || node.Call("hasAttribute", "data-bind-signal").Bool() {
		return true
	}
	for _, name := range []string{"value", "checked"} {
		value := attribute(node, name)
		if strings.Contains(value, ":w") && (strings.Contains(value, "@store:") || strings.Contains(value, "@signal:")) {
			return true
		}
	}
	return false
}

func BenchmarkPatchKeyedList(b *testing.B)

{
	for _, size := range []int{10, 100, 1000} {
		b.Run(strconv.Itoa(size), func(b *testing.B) {
			root := CreateElement("root")
			componentID := "benchmark-keyed-" + strconv.Itoa(size)
			root.SetAttr("data-component-id", componentID)
			forward := benchmarkListHTML(componentID, size, false)
			reverse := benchmarkListHTML(componentID, size, true)
			root.SetHTML(strings.TrimSuffix(strings.TrimPrefix(forward, `<root data-component-id="`+componentID+`">`), "</root>"))
			recordRenderedTree(root.Value)
			Doc().Body().AppendChild(root)
			b.Cleanup(func() { root.Call("remove") })

			b.ResetTimer()
			for i := 0; i < b.N; i++ {
				if i%2 == 0 {
					patchInnerHTML(root.Value, reverse)
				} else {
					patchInnerHTML(root.Value, forward)
				}
			}
		})
	}
}

func benchmarkListHTML(componentID string, size int, reverse bool) string

{
	var html strings.Builder
	fmt.Fprintf(&html, `<root data-component-id="%s"><ul>`, componentID)
	for position := 0; position < size; position++ {
		item := position
		if reverse {
			item = size - position - 1
		}
		fmt.Fprintf(&html, `<li data-for="benchmark" data-key="%d">row-%d</li>`, item, item)
	}
	html.WriteString(`</ul></root>`)
	return html.String()
}

func StyleInline(styles map[string]string) string

{
	var b strings.Builder
	first := true
	for k, v := range styles {
		if !first {
			b.WriteByte(';')
		}
		first = false
		b.WriteString(k)
		b.WriteByte(':')
		b.WriteString(v)
	}
	return b.String()
}

func TestElementAttrsAndStyle(t *testing.T)

{
	doc := Doc()
	el := doc.CreateElement("div")
	el.SetAttr("data-x", "y")
	if got := el.Attr("data-x"); got != "y" {
		t.Fatalf("Attr() = %q", got)
	}
	el.SetHTML("<span>ok</span>")
	if got := el.HTML(); got != "<span>ok</span>" {
		t.Fatalf("HTML() = %q", got)
	}
	el.SetStyle("color", "red")
	if v := el.Get("style").Call("getPropertyValue", "color").String(); v != "red" {
		t.Fatalf("style color = %q", v)
	}
}

func TestElementCollections(t *testing.T)

{
	doc := Doc()
	parent := doc.CreateElement("div")
	parent.SetHTML("<span>a</span><span>b</span>")
	spans := parent.QueryAll("span")
	if spans.Length() != 2 {
		t.Fatalf("Length() = %d", spans.Length())
	}
	second := spans.Index(1)
	if second.Text() != "b" {
		t.Fatalf("Index(1).Text() = %q", second.Text())
	}
	second.ToggleClass("x")
	if !second.HasClass("x") {
		t.Fatalf("ToggleClass/HasClass failed")
	}
}

func TestComponentHandlersAreScoped(t *testing.T)

{
	firstRoot := mountHandlerRoot(t, `<button data-on-click="save">one</button>`)
	secondRoot := mountHandlerRoot(t, `<button data-on-click="save">two</button>`)
	var first, second int

	RegisterComponentHandlerFunc("first", "save", func() { first++ })
	RegisterComponentHandlerFunc("second", "save", func() { second++ })
	DelegateEvents("first", firstRoot.Value)
	DelegateEvents("second", secondRoot.Value)
	t.Cleanup(func() {
		RemoveDelegatedEvents("first", firstRoot.Value)
		RemoveDelegatedEvents("second", secondRoot.Value)
		ReleaseComponentHandlers("first")
		ReleaseComponentHandlers("second")
	})

	firstRoot.Query("button").Call("click")
	secondRoot.Query("button").Call("click")
	if first != 1 || second != 1 {
		t.Fatalf("scoped handler counts = %d, %d", first, second)
	}
}

func TestGlobalHandlerRunsOnceAcrossNestedDelegates(t *testing.T)

{
	root := mountHandlerRoot(t, `<div id="nested"><button data-on-click="page">next</button></div>`)
	nested := root.Query("#nested")
	calls := 0

	RegisterHandlerFunc("page", func() { calls++ })
	DelegateEvents("outer", root.Value)
	DelegateEvents("inner", nested.Value)
	t.Cleanup(func() {
		RemoveDelegatedEvents("inner", nested.Value)
		RemoveDelegatedEvents("outer", root.Value)
	})

	nested.Query("button").Call("click")
	if calls != 1 {
		t.Fatalf("global handler calls = %d, want 1", calls)
	}
	nested.Query("button").Call("click")
	if calls != 2 {
		t.Fatalf("global handler calls after a second click = %d, want 2", calls)
	}
}

func TestNestedDelegatesContinuePastClaimedBinding(t *testing.T)

{
	root := mountHandlerRoot(t, `<div id="nested" data-on-click="parent"><button data-on-click="child">next</button></div>`)
	nested := root.Query("#nested")
	var childCalls, parentCalls int

	RegisterHandlerFunc("child", func() { childCalls++ })
	RegisterHandlerFunc("parent", func() { parentCalls++ })
	DelegateEvents("outer-ancestor", root.Value)
	DelegateEvents("inner-ancestor", nested.Value)
	t.Cleanup(func() {
		RemoveDelegatedEvents("inner-ancestor", nested.Value)
		RemoveDelegatedEvents("outer-ancestor", root.Value)
	})

	nested.Query("button").Call("click")
	if childCalls != 1 || parentCalls != 1 {
		t.Fatalf("handler calls = child %d, parent %d; want 1, 1", childCalls, parentCalls)
	}
}

func TestDelegatedEventModifiers(t *testing.T)

{
	root := mountHandlerRoot(t, `<button data-on-click="save" data-on-click-modifiers="prevent,once">save</button>`)
	var calls int
	RegisterComponentHandlerFunc("modifiers", "save", func() { calls++ })
	DelegateEvents("modifiers", root.Value)
	t.Cleanup(func() {
		RemoveDelegatedEvents("modifiers", root.Value)
		ReleaseComponentHandlers("modifiers")
	})

	button := root.Query("button")
	first := js.Get("MouseEvent").New("click", eventOptions().Value)
	if allowed := button.Call("dispatchEvent", first).Bool(); allowed {
		t.Fatal("prevent modifier did not cancel the event")
	}
	button.Call("dispatchEvent", js.Get("MouseEvent").New("click", eventOptions().Value))
	if calls != 1 {
		t.Fatalf("once handler calls = %d", calls)
	}
}

func TestDelegatedKeyAndTimingModifiers(t *testing.T)

{
	root := mountHandlerRoot(t, `
		<input data-on-keydown="submit" data-on-keydown-modifiers="enter">
		<button id="debounce" data-on-click="search" data-on-click-modifiers="debounce,10">search</button>
		<button id="throttle" data-on-click="refresh" data-on-click-modifiers="throttle,10">refresh</button>
	`)
	var submit, search, refresh int
	RegisterComponentHandlerFunc("timing", "submit", func() { submit++ })
	RegisterComponentHandlerFunc("timing", "search", func() { search++ })
	RegisterComponentHandlerFunc("timing", "refresh", func() { refresh++ })
	DelegateEvents("timing", root.Value)
	t.Cleanup(func() {
		RemoveDelegatedEvents("timing", root.Value)
		ReleaseComponentHandlers("timing")
	})

	input := root.Query("input")
	escape := eventOptions()
	escape.Set("key", "Escape")
	input.Call("dispatchEvent", js.Get("KeyboardEvent").New("keydown", escape.Value))
	enter := eventOptions()
	enter.Set("key", "Enter")
	input.Call("dispatchEvent", js.Get("KeyboardEvent").New("keydown", enter.Value))
	if submit != 1 {
		t.Fatalf("enter handler calls = %d", submit)
	}

	debounce := root.Query("#debounce")
	debounce.Call("click")
	debounce.Call("click")
	throttle := root.Query("#throttle")
	throttle.Call("click")
	throttle.Call("click")
	time.Sleep(30 * time.Millisecond)
	throttle.Call("click")

	if search != 1 {
		t.Fatalf("debounce handler calls = %d", search)
	}
	if refresh != 2 {
		t.Fatalf("throttle handler calls = %d", refresh)
	}
}

func TestDelegatedFocusHandlerUsesCaptureListener(t *testing.T)

{
	root := mountHandlerRoot(t, `<input data-on-focus="focus">`)
	var calls int
	RegisterComponentHandlerFunc("focus", "focus", func() { calls++ })
	DelegateEvents("focus", root.Value)
	t.Cleanup(func() {
		RemoveDelegatedEvents("focus", root.Value)
		ReleaseComponentHandlers("focus")
	})

	options := js.NewDict()
	options.Set("bubbles", false)
	root.Query("input").Call("dispatchEvent", js.Get("FocusEvent").New("focus", options.Value))
	if calls != 1 {
		t.Fatalf("focus handler calls = %d", calls)
	}
}

func TestExpandEvents(t *testing.T)

{
	cases := []struct{ in, want string }{
		{`<button @on:click:save>`, `<button data-on-click="save">`},
		{`<button @click:save>`, `<button data-on-click="save">`},
		{`<input @on:keydown.enter:submit />`, `<input data-on-keydown="submit" data-on-keydown-modifiers="enter" />`},
		{`<tr @on:click:openRow data-id="3">`, `<tr data-on-click="openRow" data-id="3">`},
		{`plain text with an [email protected] stays`, `plain text with an [email protected] stays`},
	}
	for _, c := range cases {
		if got := ExpandEvents(c.in); got != c.want {
			t.Errorf("ExpandEvents(%q) = %q, want %q", c.in, got, c.want)
		}
	}
}

func TestElementRemoveAttr(t *testing.T)

{
	el := Doc().CreateElement("button")
	el.SetAttr("disabled", "")
	if !el.Call("hasAttribute", "disabled").Bool() {
		t.Fatal("SetAttr did not set disabled")
	}
	el.RemoveAttr("disabled")
	if el.Call("hasAttribute", "disabled").Bool() {
		t.Fatal("RemoveAttr left the attribute in place")
	}
}

func TestFromWrapsRawValue(t *testing.T)

{
	parent := Doc().CreateElement("div")
	parent.SetHTML(`<span data-id="7" class="a">x</span>`)
	raw := parent.Call("querySelector", "span")

	el := From(raw)
	if got := el.Data("id"); got != "7" {
		t.Fatalf("Data(id) = %q", got)
	}
	if !el.HasClass("a") {
		t.Fatal("HasClass(a) = false")
	}
	if c := el.Closest("div"); c.IsNull() {
		t.Fatal("Closest(div) returned null")
	}
}