diff --git a/spec/tests/test-hyperscript-behavioral.sx b/spec/tests/test-hyperscript-behavioral.sx index 1994060c..a1254c24 100644 --- a/spec/tests/test-hyperscript-behavioral.sx +++ b/spec/tests/test-hyperscript-behavioral.sx @@ -49,8 +49,8 @@ (hs-cleanup!) (let ((_el-bar (dom-create-element "div")) (_el-div (dom-create-element "div"))) (dom-set-attr _el-bar "id" "bar") - (dom-append (dom-body) _el-bar) (dom-set-attr _el-div "_" "on click add .foo to #bar") + (dom-append (dom-body) _el-bar) (dom-append (dom-body) _el-div) (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) @@ -59,22 +59,26 @@ )) (deftest "can add to query in me" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-p1 (dom-create-element "p"))) (dom-set-attr _el-div "_" "on click add .foo to

in me") + (dom-set-attr _el-p1 "id" "p1") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-p1) (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) - (assert (dom-has-class? (dom-query-by-id "p1") "foo")) + (assert (dom-has-class? _el-p1 "foo")) (assert (not (dom-has-class? _el-div "foo"))) )) (deftest "can add to children" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-p1 (dom-create-element "p"))) (dom-set-attr _el-div "_" "on click add .foo to my children") + (dom-set-attr _el-p1 "id" "p1") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-p1) (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) - (assert (dom-has-class? (dom-query-by-id "p1") "foo")) + (assert (dom-has-class? _el-p1 "foo")) (assert (not (dom-has-class? _el-div "foo"))) )) (deftest "can add non-class attributes" @@ -130,13 +134,13 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-div1 (dom-create-element "div")) (_el-div2 (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click add .rey to .bar when it matches .doh") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-add-class _el-div1 "bar") - (dom-append (dom-body) _el-div1) (dom-add-class _el-div2 "bar") (dom-add-class _el-div2 "doh") + (dom-append (dom-body) _el-div) + (dom-append (dom-body) _el-div1) (dom-append (dom-body) _el-div2) + (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) (assert (not (dom-has-class? _el-div1 "rey"))) (assert (dom-has-class? _el-div2 "rey")) @@ -145,25 +149,29 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-div1 (dom-create-element "div")) (_el-div2 (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click add @rey to .bar when it matches .doh") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-add-class _el-div1 "bar") - (dom-append (dom-body) _el-div1) (dom-add-class _el-div2 "bar") (dom-add-class _el-div2 "doh") + (dom-append (dom-body) _el-div) + (dom-append (dom-body) _el-div1) (dom-append (dom-body) _el-div2) + (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) (assert (not (dom-has-attr? _el-div1 "rey"))) (assert (dom-has-attr? _el-div2 "rey")) )) (deftest "can add to an HTMLCollection" (hs-cleanup!) - (let ((_el-div (dom-create-element "div")) (_el-bar (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-bar (dom-create-element "div")) (_el-c1 (dom-create-element "div")) (_el-c2 (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click add .foo to the children of #bar") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-bar "id" "bar") + (dom-set-attr _el-c1 "id" "c1") + (dom-set-attr _el-c2 "id" "c2") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-bar) + (dom-append _el-bar _el-c1) + (dom-append _el-bar _el-c2) + (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) ;; SKIP check: skip byId("c1").classList.contains("foo").should.equal(false) ;; SKIP check: skip byId("c2").classList.contains("foo").should.equal(false) @@ -175,10 +183,10 @@ (let ((_el-trigger (dom-create-element "div")) (_el-d2 (dom-create-element "div"))) (dom-set-attr _el-trigger "id" "trigger") (dom-set-attr _el-trigger "_" "on click add .foo to #d2 when asyncCheck()") - (dom-append (dom-body) _el-trigger) - (hs-activate! _el-trigger) (dom-set-attr _el-d2 "id" "d2") + (dom-append (dom-body) _el-trigger) (dom-append (dom-body) _el-d2) + (hs-activate! _el-trigger) (dom-dispatch (dom-query-by-id "trigger") "click" nil) (assert (dom-has-class? (dom-query-by-id "d2") "foo")) )) @@ -187,18 +195,18 @@ (let ((_el-trigger (dom-create-element "div")) (_el-d1 (dom-create-element "div")) (_el-d2 (dom-create-element "div")) (_el-none (dom-create-element "div"))) (dom-set-attr _el-trigger "id" "trigger") (dom-set-attr _el-trigger "_" "on click add .foo to .item when it matches .yes then if the result is empty show #none else hide #none") - (dom-append (dom-body) _el-trigger) - (hs-activate! _el-trigger) (dom-set-attr _el-d1 "id" "d1") (dom-add-class _el-d1 "item") (dom-add-class _el-d1 "yes") - (dom-append (dom-body) _el-d1) (dom-set-attr _el-d2 "id" "d2") (dom-add-class _el-d2 "item") - (dom-append (dom-body) _el-d2) (dom-set-attr _el-none "id" "none") (dom-set-attr _el-none "style" "display:none") + (dom-append (dom-body) _el-trigger) + (dom-append (dom-body) _el-d1) + (dom-append (dom-body) _el-d2) (dom-append (dom-body) _el-none) + (hs-activate! _el-trigger) (dom-dispatch (dom-query-by-id "trigger") "click" nil) (assert (not (dom-visible? (dom-query-by-id "none")))) )) @@ -207,13 +215,13 @@ (let ((_el-trigger (dom-create-element "div")) (_el-d1 (dom-create-element "div")) (_el-none (dom-create-element "div"))) (dom-set-attr _el-trigger "id" "trigger") (dom-set-attr _el-trigger "_" "on click add .foo to .item when it matches .nope then if the result is empty remove @hidden from #none") - (dom-append (dom-body) _el-trigger) - (hs-activate! _el-trigger) (dom-set-attr _el-d1 "id" "d1") (dom-add-class _el-d1 "item") - (dom-append (dom-body) _el-d1) (dom-set-attr _el-none "id" "none") + (dom-append (dom-body) _el-trigger) + (dom-append (dom-body) _el-d1) (dom-append (dom-body) _el-none) + (hs-activate! _el-trigger) (dom-dispatch (dom-query-by-id "trigger") "click" nil) (assert (not (dom-has-attr? (dom-query-by-id "none") "hidden"))) )) @@ -264,8 +272,8 @@ (let ((_el-bar (dom-create-element "div")) (_el-div (dom-create-element "div"))) (dom-set-attr _el-bar "id" "bar") (dom-add-class _el-bar "foo") - (dom-append (dom-body) _el-bar) (dom-set-attr _el-div "_" "on click remove .foo from #bar") + (dom-append (dom-body) _el-bar) (dom-append (dom-body) _el-div) (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) @@ -295,18 +303,22 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-that (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click remove #that") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-that "id" "that") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-that) + (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) (assert (nil? (dom-parent _el-that))) )) (deftest "can remove parent element" (hs-cleanup!) - (let ((_el-p1 (dom-create-element "div"))) + (let ((_el-p1 (dom-create-element "div")) (_el-b1 (dom-create-element "button"))) (dom-set-attr _el-p1 "id" "p1") + (dom-set-attr _el-b1 "id" "b1") + (dom-set-attr _el-b1 "_" "on click remove my.parentElement") (dom-append (dom-body) _el-p1) + (dom-append _el-p1 _el-b1) + (hs-activate! _el-b1) (dom-dispatch _el-p1 "click" nil) (assert (nil? (dom-parent _el-p1))) )) @@ -326,9 +338,17 @@ )) (deftest "can remove query refs from specific things" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-d1 (dom-create-element "div")) (_el-p (dom-create-element "p")) (_el-p3 (dom-create-element "p"))) + (dom-set-attr _el-d1 "id" "d1") + (dom-set-attr _el-d1 "_" "on click remove

from me") + (dom-set-inner-html _el-p "foo") + (dom-set-inner-html _el-p3 "doh") (dom-append (dom-body) _el-div) - (dom-dispatch _el-div "click" nil) + (dom-append _el-div _el-d1) + (dom-append _el-d1 _el-p) + (dom-append _el-div _el-p3) + (hs-activate! _el-d1) + (dom-dispatch _el-d1 "click" nil) ;; SKIP check: skip div.innerHTML.includes("foo").should.equal(true) ;; SKIP check: skip div.innerHTML.includes("bar").should.equal(true) ;; SKIP check: skip div.innerHTML.includes("doh").should.equal(true) @@ -339,17 +359,17 @@ (let ((_el-trigger (dom-create-element "div")) (_el-d1 (dom-create-element "div")) (_el-d2 (dom-create-element "div"))) (dom-set-attr _el-trigger "id" "trigger") (dom-set-attr _el-trigger "_" "on click remove .highlight from .item when it matches .old") - (dom-append (dom-body) _el-trigger) - (hs-activate! _el-trigger) (dom-set-attr _el-d1 "id" "d1") (dom-add-class _el-d1 "item") (dom-add-class _el-d1 "old") (dom-add-class _el-d1 "highlight") - (dom-append (dom-body) _el-d1) (dom-set-attr _el-d2 "id" "d2") (dom-add-class _el-d2 "item") (dom-add-class _el-d2 "highlight") + (dom-append (dom-body) _el-trigger) + (dom-append (dom-body) _el-d1) (dom-append (dom-body) _el-d2) + (hs-activate! _el-trigger) (dom-dispatch (dom-query-by-id "trigger") "click" nil) (assert (not (dom-has-class? (dom-query-by-id "d1") "highlight"))) (assert (dom-has-class? (dom-query-by-id "d2") "highlight")) @@ -418,8 +438,8 @@ (hs-cleanup!) (let ((_el-bar (dom-create-element "div")) (_el-div (dom-create-element "div"))) (dom-set-attr _el-bar "id" "bar") - (dom-append (dom-body) _el-bar) (dom-set-attr _el-div "_" "on click toggle .foo on #bar") + (dom-append (dom-body) _el-bar) (dom-append (dom-body) _el-div) (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) @@ -460,8 +480,8 @@ (hs-cleanup!) (let ((_el-d1 (dom-create-element "div")) (_el-div (dom-create-element "div"))) (dom-set-attr _el-d1 "id" "d1") - (dom-append (dom-body) _el-d1) (dom-set-attr _el-div "_" "on click toggle .foo until foo from #d1") + (dom-append (dom-body) _el-d1) (dom-append (dom-body) _el-div) (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) @@ -556,10 +576,10 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-d2 (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click toggle the *display of #d2") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-d2 "id" "d2") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-d2) + (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) (dom-dispatch _el-div "click" nil) ;; SKIP computed style: div2.display @@ -568,10 +588,10 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-d2 (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click toggle the *opacity of #d2") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-d2 "id" "d2") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-d2) + (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) (dom-dispatch _el-div "click" nil) ;; SKIP computed style: div2.opacity @@ -580,10 +600,10 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-d2 (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click toggle the *visibility of #d2") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-d2 "id" "d2") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-d2) + (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) (dom-dispatch _el-div "click" nil) ;; SKIP computed style: div2.visibility @@ -602,6 +622,8 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div"))) ;; HS source has bare quotes or embedded HTML + (dom-set-attr _el-div "data-state" "active") + ;; SKIP attr [@data-state (contains special chars) (dom-append (dom-body) _el-div) (dom-dispatch _el-div "click" nil) (assert= (dom-get-attr _el-div "data-state") "inactive") @@ -612,6 +634,9 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div"))) ;; HS source has bare quotes or embedded HTML + (dom-set-attr _el-div "enabled" "true") + ;; SKIP attr [@enabled (contains special chars) + ;; SKIP attr [@disabled (contains special chars) (dom-append (dom-body) _el-div) (dom-dispatch _el-div "click" nil) (assert= (dom-get-attr _el-div "disabled") "true") @@ -655,24 +680,25 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-d2 (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click toggle the *opacity of #d2") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-d2 "id" "d2") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-d2) + (hs-activate! _el-div) )) (deftest "can toggle visibility on other elt" (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-d2 (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click toggle the *visibility of #d2") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-d2 "id" "d2") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-d2) + (hs-activate! _el-div) )) (deftest "can toggle *display between two values" (hs-cleanup!) (let ((_el-div (dom-create-element "div"))) ;; HS source has bare quotes or embedded HTML + (dom-set-attr _el-div "style" "display:none") (dom-append (dom-body) _el-div) (dom-dispatch _el-div "click" nil) (assert= (dom-get-style _el-div "display") "flex") @@ -683,6 +709,7 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div"))) ;; HS source has bare quotes or embedded HTML + (dom-set-attr _el-div "style" "opacity:0") (dom-append (dom-body) _el-div) (dom-dispatch _el-div "click" nil) (assert= (dom-get-style _el-div "opacity") "0.5") @@ -736,30 +763,36 @@ )) (deftest "can set complex indirect properties lhs" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-d1 (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click set parentNode.innerHTML of #d1 to \"foo\"") + (dom-set-attr _el-d1 "id" "d1") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-d1) (hs-activate! _el-div) - (dom-dispatch _el-div "click" nil) - (assert= (dom-inner-html _el-div) "foo") + (dom-dispatch _el-d1 "click" nil) + (assert= (dom-inner-html _el-d1) "foo") )) (deftest "can set complex indirect properties rhs" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-d1 (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click set innerHTML of #d1.parentNode to \"foo\"") + (dom-set-attr _el-d1 "id" "d1") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-d1) (hs-activate! _el-div) - (dom-dispatch _el-div "click" nil) - (assert= (dom-inner-html _el-div) "foo") + (dom-dispatch _el-d1 "click" nil) + (assert= (dom-inner-html _el-d1) "foo") )) (deftest "can set chained indirect properties" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-d1 (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click set the innerHTML of the parentNode of #d1 to \"foo\"") + (dom-set-attr _el-d1 "id" "d1") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-d1) (hs-activate! _el-div) - (dom-dispatch _el-div "click" nil) - (assert= (dom-inner-html _el-div) "foo") + (dom-dispatch _el-d1 "click" nil) + (assert= (dom-inner-html _el-d1) "foo") )) (deftest "can set styles" (hs-cleanup!) @@ -806,10 +839,10 @@ (let ((_el-div (dom-create-element "div")) (_el-div1 (dom-create-element "div"))) (dom-add-class _el-div "divs") (dom-set-attr _el-div "_" "on click set .divs.innerHTML to \"foo\"") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-add-class _el-div1 "divs") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-div1) + (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) (assert= (dom-inner-html _el-div) "foo") (assert= (dom-inner-html _el-div1) "foo") @@ -829,10 +862,10 @@ (let ((_el-div (dom-create-element "div")) (_el-div2 (dom-create-element "div"))) (dom-add-class _el-div "divs") (dom-set-attr _el-div "_" "on click set #div2's @bar to 'foo'") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-div2 "id" "div2") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-div2) + (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) (assert= (dom-get-attr _el-div2 "bar") "foo") )) @@ -841,10 +874,10 @@ (let ((_el-div (dom-create-element "div")) (_el-div2 (dom-create-element "div"))) (dom-add-class _el-div "divs") (dom-set-attr _el-div "_" "on click set #div2's @bar to 'foo'") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-div2 "id" "div2") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-div2) + (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) (assert= (dom-get-attr _el-div2 "bar") "foo") )) @@ -853,10 +886,10 @@ (let ((_el-div (dom-create-element "div")) (_el-div2 (dom-create-element "div"))) (dom-add-class _el-div "divs") (dom-set-attr _el-div "_" "on click set @bar of #div2 to 'foo'") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-div2 "id" "div2") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-div2) + (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) (assert= (dom-get-attr _el-div2 "bar") "foo") )) @@ -875,10 +908,10 @@ (let ((_el-div (dom-create-element "div")) (_el-div2 (dom-create-element "div"))) (dom-add-class _el-div "divs") (dom-set-attr _el-div "_" "on click set #div2's *color to 'red'") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-div2 "id" "div2") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-div2) + (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) ;; SKIP check: skip d2.style["color"].should.equal("red") )) @@ -887,10 +920,10 @@ (let ((_el-div (dom-create-element "div")) (_el-div2 (dom-create-element "div"))) (dom-add-class _el-div "divs") (dom-set-attr _el-div "_" "on click set #div2's *color to 'red'") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-div2 "id" "div2") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-div2) + (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) ;; SKIP check: skip d2.style["color"].should.equal("red") )) @@ -899,10 +932,10 @@ (let ((_el-div (dom-create-element "div")) (_el-div2 (dom-create-element "div"))) (dom-add-class _el-div "divs") (dom-set-attr _el-div "_" "on click set *color of #div2 to 'red'") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-div2 "id" "div2") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-div2) + (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) ;; SKIP check: skip d2.style["color"].should.equal("red") )) @@ -1002,9 +1035,9 @@ (hs-cleanup!) (let ((_el-d1 (dom-create-element "div")) (_el-d2 (dom-create-element "div"))) (dom-set-attr _el-d1 "id" "d1") - (dom-append (dom-body) _el-d1) (dom-set-attr _el-d2 "id" "d2") (dom-set-attr _el-d2 "_" "on click put #d1 into #d2") + (dom-append (dom-body) _el-d1) (dom-append (dom-body) _el-d2) (hs-activate! _el-d2) (dom-dispatch _el-d2 "click" nil) @@ -1050,28 +1083,36 @@ )) (deftest "can set into class ref w/ flatmapped property" (hs-cleanup!) - (let ((_el-div (dom-create-element "div")) (_el-d1 (dom-create-element "div")) (_el-d2 (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-d1 (dom-create-element "div")) (_el-div2 (dom-create-element "div")) (_el-d2 (dom-create-element "div")) (_el-div4 (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click put \"foo\" into .divs.parentElement.innerHTML") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-d1 "id" "d1") - (dom-append (dom-body) _el-d1) + (dom-add-class _el-div2 "divs") (dom-set-attr _el-d2 "id" "d2") + (dom-add-class _el-div4 "divs") + (dom-append (dom-body) _el-div) + (dom-append (dom-body) _el-d1) + (dom-append _el-d1 _el-div2) (dom-append (dom-body) _el-d2) + (dom-append _el-d2 _el-div4) + (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) (assert= (dom-text-content _el-d1) "foo") (assert= (dom-text-content _el-d2) "foo") )) (deftest "can set into class ref w/ flatmapped property using of" (hs-cleanup!) - (let ((_el-div (dom-create-element "div")) (_el-d1 (dom-create-element "div")) (_el-d2 (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-d1 (dom-create-element "div")) (_el-div2 (dom-create-element "div")) (_el-d2 (dom-create-element "div")) (_el-div4 (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click put \"foo\" into innerHTML of parentElement of .divs") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-d1 "id" "d1") - (dom-append (dom-body) _el-d1) + (dom-add-class _el-div2 "divs") (dom-set-attr _el-d2 "id" "d2") + (dom-add-class _el-div4 "divs") + (dom-append (dom-body) _el-div) + (dom-append (dom-body) _el-d1) + (dom-append _el-d1 _el-div2) (dom-append (dom-body) _el-d2) + (dom-append _el-d2 _el-div4) + (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) (assert= (dom-text-content _el-d1) "foo") (assert= (dom-text-content _el-d2) "foo") @@ -1101,11 +1142,11 @@ (let ((_el-d2 (dom-create-element "div")) (_el-d1 (dom-create-element "div"))) (dom-set-attr _el-d2 "id" "d2") (dom-set-attr _el-d2 "_" "on click put #d1 before #d2") - (dom-append (dom-body) _el-d2) - (hs-activate! _el-d2) (dom-set-attr _el-d1 "id" "d1") (dom-set-inner-html _el-d1 "foo") + (dom-append (dom-body) _el-d2) (dom-append (dom-body) _el-d1) + (hs-activate! _el-d2) (dom-dispatch _el-d2 "click" nil) ;; SKIP check: skip d2.previousSibling.textContent.should.equal("foo") )) @@ -1114,9 +1155,9 @@ (let ((_el-d1 (dom-create-element "div")) (_el-d2 (dom-create-element "div"))) (dom-set-attr _el-d1 "id" "d1") (dom-set-inner-html _el-d1 "foo") - (dom-append (dom-body) _el-d1) (dom-set-attr _el-d2 "id" "d2") (dom-set-attr _el-d2 "_" "on click put #d1 after #d2") + (dom-append (dom-body) _el-d1) (dom-append (dom-body) _el-d2) (hs-activate! _el-d2) (dom-dispatch _el-d2 "click" nil) @@ -1169,10 +1210,10 @@ (let ((_el-div (dom-create-element "div")) (_el-div2 (dom-create-element "div"))) (dom-add-class _el-div "divs") (dom-set-attr _el-div "_" "on click put 'foo' into #div2's @bar") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-div2 "id" "div2") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-div2) + (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) (assert= (dom-get-attr _el-div2 "bar") "foo") )) @@ -1181,10 +1222,10 @@ (let ((_el-div (dom-create-element "div")) (_el-div2 (dom-create-element "div"))) (dom-add-class _el-div "divs") (dom-set-attr _el-div "_" "on click put 'foo' into @bar of #div2") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-div2 "id" "div2") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-div2) + (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) (assert= (dom-get-attr _el-div2 "bar") "foo") )) @@ -1213,10 +1254,10 @@ (let ((_el-div (dom-create-element "div")) (_el-div2 (dom-create-element "div"))) (dom-add-class _el-div "divs") (dom-set-attr _el-div "_" "on click put 'red' into #div2's *color") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-div2 "id" "div2") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-div2) + (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) ;; SKIP check: skip d2.style["color"].should.equal("red") )) @@ -1225,10 +1266,10 @@ (let ((_el-div (dom-create-element "div")) (_el-div2 (dom-create-element "div"))) (dom-add-class _el-div "divs") (dom-set-attr _el-div "_" "on click put 'red' into the *color of #div2") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-div2 "id" "div2") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-div2) + (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) ;; SKIP check: skip d2.style["color"].should.equal("red") )) @@ -1487,8 +1528,8 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-div1 (dom-create-element "div"))) (dom-add-class _el-div "hideme") - (dom-append (dom-body) _el-div) (dom-set-attr _el-div1 "_" "on click hide .hideme") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-div1) (hs-activate! _el-div1) (dom-dispatch _el-div "click" nil) @@ -1516,10 +1557,15 @@ )) (deftest "can filter hide via the when clause" (hs-cleanup!) - (let ((_el-trigger (dom-create-element "div"))) + (let ((_el-trigger (dom-create-element "div")) (_el-d1 (dom-create-element "div")) (_el-d2 (dom-create-element "div"))) (dom-set-attr _el-trigger "id" "trigger") (dom-set-attr _el-trigger "_" "on click hide

in me when it matches .hideable") + (dom-set-attr _el-d1 "id" "d1") + (dom-add-class _el-d1 "hideable") + (dom-set-attr _el-d2 "id" "d2") (dom-append (dom-body) _el-trigger) + (dom-append _el-trigger _el-d1) + (dom-append _el-trigger _el-d2) (hs-activate! _el-trigger) (dom-dispatch (dom-query-by-id "trigger") "click" nil) (assert= (dom-get-style (dom-query-by-id "d1") "display") "none") @@ -1758,9 +1804,9 @@ (let ((_el-script (dom-create-element "script")) (_el-d1 (dom-create-element "div"))) (dom-set-attr _el-script "type" "text/hyperscript") (dom-set-inner-html _el-script "def repeatForeverWithReturn() set retVal to 0 repeat forever set retVal to retVal + 1 if retVal == 5 then return retVal end end end") - (dom-append (dom-body) _el-script) (dom-set-attr _el-d1 "id" "d1") (dom-set-attr _el-d1 "_" "on click put repeatForeverWithReturn() into my.innerHTML") + (dom-append (dom-body) _el-script) (dom-append (dom-body) _el-d1) (hs-activate! _el-d1) (dom-dispatch _el-d1 "click" nil) @@ -1771,9 +1817,9 @@ (let ((_el-script (dom-create-element "script")) (_el-d1 (dom-create-element "div"))) (dom-set-attr _el-script "type" "text/hyperscript") (dom-set-inner-html _el-script "def repeatForeverWithReturn() set retVal to 0 repeat set retVal to retVal + 1 if retVal == 5 then return retVal end end end") - (dom-append (dom-body) _el-script) (dom-set-attr _el-d1 "id" "d1") (dom-set-attr _el-d1 "_" "on click put repeatForeverWithReturn() into my.innerHTML") + (dom-append (dom-body) _el-script) (dom-append (dom-body) _el-d1) (hs-activate! _el-d1) (dom-dispatch _el-d1 "click" nil) @@ -1811,9 +1857,9 @@ (let ((_el-script (dom-create-element "script")) (_el-d1 (dom-create-element "div"))) (dom-set-attr _el-script "type" "text/hyperscript") (dom-set-inner-html _el-script "def repeatWhileTest() set retVal to 0 repeat while retVal < 5 set retVal to retVal + 1 end return retVal end") - (dom-append (dom-body) _el-script) (dom-set-attr _el-d1 "id" "d1") (dom-set-attr _el-d1 "_" "on click put repeatWhileTest() into my.innerHTML") + (dom-append (dom-body) _el-script) (dom-append (dom-body) _el-d1) (hs-activate! _el-d1) (dom-dispatch _el-d1 "click" nil) @@ -1824,9 +1870,9 @@ (let ((_el-script (dom-create-element "script")) (_el-d1 (dom-create-element "div"))) (dom-set-attr _el-script "type" "text/hyperscript") (dom-set-inner-html _el-script "def repeatUntilTest() set retVal to 0 repeat until retVal == 5 set retVal to retVal + 1 end return retVal end") - (dom-append (dom-body) _el-script) (dom-set-attr _el-d1 "id" "d1") (dom-set-attr _el-d1 "_" "on click put repeatUntilTest() into my.innerHTML") + (dom-append (dom-body) _el-script) (dom-append (dom-body) _el-d1) (hs-activate! _el-d1) (dom-dispatch _el-d1 "click" nil) @@ -1836,9 +1882,9 @@ (hs-cleanup!) (let ((_el-untilTest (dom-create-element "div")) (_el-script (dom-create-element "script"))) (dom-set-attr _el-untilTest "id" "untilTest") - (dom-append (dom-body) _el-untilTest) (dom-set-attr _el-script "type" "text/hyperscript") (dom-set-inner-html _el-script "def repeatUntilTest() repeat until event click from #untilTest wait 2ms end return 42 end") + (dom-append (dom-body) _el-untilTest) (dom-append (dom-body) _el-script) (dom-dispatch _el-untilTest "click" nil) ;; SKIP check: skip value.should.equal(42) @@ -1848,9 +1894,9 @@ (let ((_el-script (dom-create-element "script")) (_el-d1 (dom-create-element "div"))) (dom-set-attr _el-script "type" "text/hyperscript") (dom-set-inner-html _el-script "def getArray() set window.called to (window.called or 0) + 1 return [1, 2, 3] end") - (dom-append (dom-body) _el-script) (dom-set-attr _el-d1 "id" "d1") (dom-set-attr _el-d1 "_" "on click for x in getArray() put x into my.innerHTML end") + (dom-append (dom-body) _el-script) (dom-append (dom-body) _el-d1) (hs-activate! _el-d1) (dom-dispatch _el-d1 "click" nil) @@ -1862,9 +1908,9 @@ (let ((_el-script (dom-create-element "script")) (_el-d1 (dom-create-element "div"))) (dom-set-attr _el-script "type" "text/hyperscript") (dom-set-inner-html _el-script "def sprayInto(elt) for x in [1, 2, 3] for y in [1, 2, 3] put x * y at end of elt end end end") - (dom-append (dom-body) _el-script) (dom-set-attr _el-d1 "id" "d1") (dom-set-attr _el-d1 "_" "on click call sprayInto(me)") + (dom-append (dom-body) _el-script) (dom-append (dom-body) _el-d1) (hs-activate! _el-d1) (dom-dispatch _el-d1 "click" nil) @@ -2045,8 +2091,8 @@ (hs-cleanup!) (let ((_el-d2 (dom-create-element "div")) (_el-div (dom-create-element "div"))) (dom-set-attr _el-d2 "id" "d2") - (dom-append (dom-body) _el-d2) (dom-set-attr _el-div "_" "on click add .foo then wait for foo from #d2 then add .bar") + (dom-append (dom-body) _el-d2) (dom-append (dom-body) _el-div) (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) @@ -2058,8 +2104,8 @@ (hs-cleanup!) (let ((_el-d2 (dom-create-element "div")) (_el-div (dom-create-element "div"))) (dom-set-attr _el-d2 "id" "d2") - (dom-append (dom-body) _el-d2) (dom-set-attr _el-div "_" "on click add .foo then wait for foo or 0ms then add .bar") + (dom-append (dom-body) _el-d2) (dom-append (dom-body) _el-div) (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) @@ -2071,8 +2117,8 @@ (hs-cleanup!) (let ((_el-d2 (dom-create-element "div")) (_el-div (dom-create-element "div"))) (dom-set-attr _el-d2 "id" "d2") - (dom-append (dom-body) _el-d2) (dom-set-attr _el-div "_" "on click add .foo then wait for foo or 0ms then add .bar") + (dom-append (dom-body) _el-d2) (dom-append (dom-body) _el-div) (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) @@ -2088,11 +2134,11 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-bar (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click send foo to #bar") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-bar "id" "bar") (dom-set-attr _el-bar "_" "on foo add .foo-sent") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-bar) + (hs-activate! _el-div) (hs-activate! _el-bar) (dom-dispatch _el-div "click" nil) (assert (dom-has-class? _el-bar "foo-sent")) @@ -2101,11 +2147,11 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-bar (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click log 0 send foo to #bar log 3") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-bar "id" "bar") (dom-set-attr _el-bar "_" "on foo add .foo-sent to sender log 1, me, sender") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-bar) + (hs-activate! _el-div) (hs-activate! _el-bar) (dom-dispatch _el-div "click" nil) (assert (dom-has-class? _el-div "foo-sent")) @@ -2114,11 +2160,11 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-bar (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click send foo(x:42) to #bar") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-bar "id" "bar") (dom-set-attr _el-bar "_" "on foo put event.detail.x into my.innerHTML") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-bar) + (hs-activate! _el-div) (hs-activate! _el-bar) (dom-dispatch _el-div "click" nil) (assert (not (dom-has-class? _el-bar "foo-sent"))) @@ -2128,11 +2174,11 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-bar (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click send foo.bar to #bar") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-bar "id" "bar") (dom-set-attr _el-bar "_" "on foo.bar add .foo-sent") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-bar) + (hs-activate! _el-div) (hs-activate! _el-bar) (dom-dispatch _el-div "click" nil) (assert (dom-has-class? _el-bar "foo-sent")) @@ -2141,11 +2187,11 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-bar (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click send foo.bar(x:42) to #bar") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-bar "id" "bar") (dom-set-attr _el-bar "_" "on foo.bar put event.detail.x into my.innerHTML") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-bar) + (hs-activate! _el-div) (hs-activate! _el-bar) (dom-dispatch _el-div "click" nil) (assert (not (dom-has-class? _el-bar "foo-sent"))) @@ -2155,11 +2201,11 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-bar (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click send foo:bar to #bar") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-bar "id" "bar") (dom-set-attr _el-bar "_" "on foo:bar add .foo-sent") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-bar) + (hs-activate! _el-div) (hs-activate! _el-bar) (dom-dispatch _el-div "click" nil) (assert (dom-has-class? _el-bar "foo-sent")) @@ -2168,11 +2214,11 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-bar (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click send foo:bar(x:42) to #bar") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-bar "id" "bar") (dom-set-attr _el-bar "_" "on foo:bar put event.detail.x into my.innerHTML") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-bar) + (hs-activate! _el-div) (hs-activate! _el-bar) (dom-dispatch _el-div "click" nil) (assert (not (dom-has-class? _el-bar "foo-sent"))) @@ -2182,11 +2228,11 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-bar (dom-create-element "div"))) (dom-set-attr _el-div "_" "def bar return #bar on click send foo to bar()") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-bar "id" "bar") (dom-set-attr _el-bar "_" "on foo add .foo-sent") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-bar) + (hs-activate! _el-div) (hs-activate! _el-bar) (dom-dispatch _el-div "click" nil) (assert (dom-has-class? _el-bar "foo-sent")) @@ -2200,13 +2246,13 @@ (let ((_el-div (dom-create-element "div")) (_el-div1 (dom-create-element "div")) (_el-div2 (dom-create-element "div"))) (dom-add-class _el-div "div") (dom-add-class _el-div "foo") - (dom-append (dom-body) _el-div) (dom-add-class _el-div1 "div") (dom-set-attr _el-div1 "_" "on click take .foo from .div") - (dom-append (dom-body) _el-div1) - (hs-activate! _el-div1) (dom-add-class _el-div2 "div") + (dom-append (dom-body) _el-div) + (dom-append (dom-body) _el-div1) (dom-append (dom-body) _el-div2) + (hs-activate! _el-div1) (dom-dispatch _el-div1 "click" nil) (assert (not (dom-has-class? _el-div "foo"))) (assert (dom-has-class? _el-div1 "foo")) @@ -2217,13 +2263,13 @@ (let ((_el-form (dom-create-element "form")) (_el-form1 (dom-create-element "form")) (_el-form2 (dom-create-element "form"))) (dom-add-class _el-form "div") (dom-add-class _el-form "foo") - (dom-append (dom-body) _el-form) (dom-add-class _el-form1 "div") (dom-set-attr _el-form1 "_" "on click take .foo from .div") - (dom-append (dom-body) _el-form1) - (hs-activate! _el-form1) (dom-add-class _el-form2 "div") + (dom-append (dom-body) _el-form) + (dom-append (dom-body) _el-form1) (dom-append (dom-body) _el-form2) + (hs-activate! _el-form1) (dom-dispatch (dom-query-by-id "f2") "click" nil) (assert (not (dom-has-class? (dom-query-by-id "f1") "foo"))) (assert (dom-has-class? (dom-query-by-id "f2") "foo")) @@ -2234,14 +2280,14 @@ (let ((_el-div (dom-create-element "div")) (_el-div1 (dom-create-element "div")) (_el-d3 (dom-create-element "div"))) (dom-add-class _el-div "div") (dom-add-class _el-div "foo") - (dom-append (dom-body) _el-div) (dom-add-class _el-div1 "div") (dom-set-attr _el-div1 "_" "on click take .foo from .div for #d3") - (dom-append (dom-body) _el-div1) - (hs-activate! _el-div1) (dom-set-attr _el-d3 "id" "d3") (dom-add-class _el-d3 "div") + (dom-append (dom-body) _el-div) + (dom-append (dom-body) _el-div1) (dom-append (dom-body) _el-d3) + (hs-activate! _el-div1) (dom-dispatch _el-div1 "click" nil) (assert (not (dom-has-class? _el-div "foo"))) (assert (not (dom-has-class? _el-div1 "foo"))) @@ -2249,27 +2295,37 @@ )) (deftest "a parent can take a class for other elements" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-d1 (dom-create-element "div")) (_el-d2 (dom-create-element "div")) (_el-d3 (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click take .foo from .div for event.target") + (dom-set-attr _el-d1 "id" "d1") + (dom-add-class _el-d1 "div") + (dom-add-class _el-d1 "foo") + (dom-set-attr _el-d2 "id" "d2") + (dom-add-class _el-d2 "div") + (dom-set-attr _el-d3 "id" "d3") + (dom-add-class _el-d3 "div") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-d1) + (dom-append _el-div _el-d2) + (dom-append _el-div _el-d3) (hs-activate! _el-div) - (dom-dispatch (dom-query-by-id "d2") "click" nil) - (assert (not (dom-has-class? _el-div "foo"))) - (assert (dom-has-class? (dom-query-by-id "d2") "foo")) - (assert (not (dom-has-class? (dom-query-by-id "d3") "foo"))) + (dom-dispatch _el-d2 "click" nil) + (assert (not (dom-has-class? _el-d1 "foo"))) + (assert (dom-has-class? _el-d2 "foo")) + (assert (not (dom-has-class? _el-d3 "foo"))) )) (deftest "can take an attribute from other elements" (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-div1 (dom-create-element "div")) (_el-div2 (dom-create-element "div"))) (dom-add-class _el-div "div") (dom-set-attr _el-div "data-foo" "bar") - (dom-append (dom-body) _el-div) (dom-add-class _el-div1 "div") (dom-set-attr _el-div1 "_" "on click take @data-foo from .div") - (dom-append (dom-body) _el-div1) - (hs-activate! _el-div1) (dom-add-class _el-div2 "div") + (dom-append (dom-body) _el-div) + (dom-append (dom-body) _el-div1) (dom-append (dom-body) _el-div2) + (hs-activate! _el-div1) (dom-dispatch _el-div1 "click" nil) (assert= (dom-get-attr _el-div "data-foo") "bar") (assert= (dom-get-attr _el-div1 "data-foo") "") @@ -2282,13 +2338,13 @@ (let ((_el-div (dom-create-element "div")) (_el-div1 (dom-create-element "div")) (_el-div2 (dom-create-element "div"))) (dom-add-class _el-div "div") (dom-set-attr _el-div "data-foo" "bar") - (dom-append (dom-body) _el-div) (dom-add-class _el-div1 "div") (dom-set-attr _el-div1 "_" "on click take @data-foo=baz from .div") - (dom-append (dom-body) _el-div1) - (hs-activate! _el-div1) (dom-add-class _el-div2 "div") + (dom-append (dom-body) _el-div) + (dom-append (dom-body) _el-div1) (dom-append (dom-body) _el-div2) + (hs-activate! _el-div1) (dom-dispatch _el-div1 "click" nil) (assert= (dom-get-attr _el-div "data-foo") "bar") (assert= (dom-get-attr _el-div1 "data-foo") "baz") @@ -2301,13 +2357,13 @@ (let ((_el-div (dom-create-element "div")) (_el-div1 (dom-create-element "div")) (_el-div2 (dom-create-element "div"))) (dom-add-class _el-div "div") (dom-set-attr _el-div "data-foo" "bar") - (dom-append (dom-body) _el-div) (dom-add-class _el-div1 "div") (dom-set-attr _el-div1 "_" "on click take @data-foo=baz with \"qux\" from .div") - (dom-append (dom-body) _el-div1) - (hs-activate! _el-div1) (dom-add-class _el-div2 "div") + (dom-append (dom-body) _el-div) + (dom-append (dom-body) _el-div1) (dom-append (dom-body) _el-div2) + (hs-activate! _el-div1) (dom-dispatch _el-div1 "click" nil) (assert= (dom-get-attr _el-div "data-foo") "qux") (assert= (dom-get-attr _el-div1 "data-foo") "baz") @@ -2320,14 +2376,14 @@ (let ((_el-div (dom-create-element "div")) (_el-div1 (dom-create-element "div")) (_el-div2 (dom-create-element "div"))) (dom-add-class _el-div "div") (dom-set-attr _el-div "data-foo" "bar") - (dom-append (dom-body) _el-div) (dom-add-class _el-div1 "div") (dom-set-attr _el-div1 "_" "on click take @data-foo=baz with my @data-foo from .div") (dom-set-attr _el-div1 "data-foo" "qux") - (dom-append (dom-body) _el-div1) - (hs-activate! _el-div1) (dom-add-class _el-div2 "div") + (dom-append (dom-body) _el-div) + (dom-append (dom-body) _el-div1) (dom-append (dom-body) _el-div2) + (hs-activate! _el-div1) (dom-dispatch _el-div1 "click" nil) (assert= (dom-get-attr _el-div "data-foo") "qux") (assert= (dom-get-attr _el-div1 "data-foo") "baz") @@ -2339,14 +2395,14 @@ (let ((_el-div (dom-create-element "div")) (_el-div1 (dom-create-element "div")) (_el-d3 (dom-create-element "div"))) (dom-add-class _el-div "div") (dom-set-attr _el-div "data-foo" "bar") - (dom-append (dom-body) _el-div) (dom-add-class _el-div1 "div") (dom-set-attr _el-div1 "_" "on click take @data-foo from .div for #d3") - (dom-append (dom-body) _el-div1) - (hs-activate! _el-div1) (dom-set-attr _el-d3 "id" "d3") (dom-add-class _el-d3 "div") + (dom-append (dom-body) _el-div) + (dom-append (dom-body) _el-div1) (dom-append (dom-body) _el-d3) + (hs-activate! _el-div1) (dom-dispatch _el-div1 "click" nil) (assert= (dom-get-attr _el-div "data-foo") "bar") (assert= (dom-get-attr _el-d3 "data-foo") "") @@ -2356,13 +2412,23 @@ )) (deftest "a parent can take an attribute for other elements" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-d1 (dom-create-element "div")) (_el-d2 (dom-create-element "div")) (_el-d3 (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click take @data-foo from .div for event.target") + (dom-set-attr _el-d1 "id" "d1") + (dom-add-class _el-d1 "div") + (dom-set-attr _el-d1 "data-foo" "bar") + (dom-set-attr _el-d2 "id" "d2") + (dom-add-class _el-d2 "div") + (dom-set-attr _el-d3 "id" "d3") + (dom-add-class _el-d3 "div") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-d1) + (dom-append _el-div _el-d2) + (dom-append _el-div _el-d3) (hs-activate! _el-div) - (dom-dispatch (dom-query-by-id "d2") "click" nil) - (assert= (dom-get-attr _el-div "data-foo") "bar") - (assert= (dom-get-attr (dom-query-by-id "d2") "data-foo") "") + (dom-dispatch _el-d2 "click" nil) + (assert= (dom-get-attr _el-d1 "data-foo") "bar") + (assert= (dom-get-attr _el-d2 "data-foo") "") ;; SKIP check: skip assert.isNull(d2.getAttribute("data-foo") ;; SKIP check: skip assert.isNull(d3.getAttribute("data-foo") ;; SKIP check: skip assert.isNull(d1.getAttribute("data-foo") @@ -2372,14 +2438,14 @@ (let ((_el-div (dom-create-element "div")) (_el-div1 (dom-create-element "div")) (_el-div2 (dom-create-element "div"))) (dom-add-class _el-div "div") (dom-add-class _el-div "foo") - (dom-append (dom-body) _el-div) (dom-add-class _el-div1 "div") (dom-set-attr _el-div1 "_" "on click take .foo .bar") - (dom-append (dom-body) _el-div1) - (hs-activate! _el-div1) (dom-add-class _el-div2 "div") (dom-add-class _el-div2 "bar") + (dom-append (dom-body) _el-div) + (dom-append (dom-body) _el-div1) (dom-append (dom-body) _el-div2) + (hs-activate! _el-div1) (dom-dispatch _el-div1 "click" nil) (assert (not (dom-has-class? _el-div "foo"))) (assert (dom-has-class? _el-div1 "foo")) @@ -2394,14 +2460,14 @@ (dom-add-class _el-div "div1") (dom-add-class _el-div "foo") (dom-add-class _el-div "bar") - (dom-append (dom-body) _el-div) (dom-add-class _el-div1 "div") (dom-set-attr _el-div1 "_" "on click take .foo .bar from .div1") - (dom-append (dom-body) _el-div1) - (hs-activate! _el-div1) (dom-add-class _el-div2 "div") (dom-add-class _el-div2 "bar") + (dom-append (dom-body) _el-div) + (dom-append (dom-body) _el-div1) (dom-append (dom-body) _el-div2) + (hs-activate! _el-div1) (dom-dispatch _el-div1 "click" nil) (assert (not (dom-has-class? _el-div "foo"))) (assert (dom-has-class? _el-div1 "foo")) @@ -2464,10 +2530,10 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-foo (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click transition element #foo width from 0px to 100px") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-foo "id" "foo") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-foo) + (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) (assert= (dom-get-style _el-foo "width") "100px") )) @@ -2475,10 +2541,10 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-foo (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click transition #foo width from 0px to 100px") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-foo "id" "foo") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-foo) + (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) (assert= (dom-get-style _el-foo "width") "100px") )) @@ -2486,10 +2552,10 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-foo (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click transition #foo's width from 0px to 100px") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-foo "id" "foo") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-foo) + (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) (assert= (dom-get-style _el-foo "width") "100px") )) @@ -2497,10 +2563,10 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-foo (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click get #foo then transition its width from 0px to 100px") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-foo "id" "foo") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-foo) + (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) (assert= (dom-get-style _el-foo "width") "100px") )) @@ -2508,10 +2574,10 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-foo (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click transition element #foo width from 0px to 100px using \"width 2s ease-in\"") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-foo "id" "foo") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-foo) + (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) (assert= (dom-get-style _el-foo "width") "100px") )) @@ -2519,10 +2585,10 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-foo (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click transition element #foo width from 0px to 100px over 2s") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-foo "id" "foo") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-foo) + (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) (assert= (dom-get-style _el-foo "width") "100px") )) @@ -2568,37 +2634,37 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-foo (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click transition *width of #foo from 0px to 100px") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-foo "id" "foo") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-foo) + (hs-activate! _el-div) )) (deftest "can transition on another element with possessive" (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-foo (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click transition #foo's *width from 0px to 100px") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-foo "id" "foo") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-foo) + (hs-activate! _el-div) )) (deftest "can transition on another element with it" (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-foo (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click get #foo then transition its *width from 0px to 100px") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-foo "id" "foo") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-foo) + (hs-activate! _el-div) )) (deftest "can transition with a custom transition string" (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-foo (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click transition #foo's *width from 0px to 100px using \"width 2s ease-in\"") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-foo "id" "foo") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-foo) + (hs-activate! _el-div) )) (deftest "can transition a single property on form using style ref" (hs-cleanup!) @@ -3237,9 +3303,12 @@ )) (deftest "append preserves existing content rather than overwriting it" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-btn1 (dom-create-element "button"))) (dom-set-attr _el-div "_" "on click append 'New Content' to me") + (dom-set-attr _el-btn1 "id" "btn1") + (dom-set-inner-html _el-btn1 "Click Me") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-btn1) (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) (dom-dispatch _el-div "click" nil) @@ -3285,10 +3354,10 @@ (let ((_el-d1 (dom-create-element "div")) (_el-d2 (dom-create-element "div"))) (dom-set-attr _el-d1 "id" "d1") (dom-set-attr _el-d1 "_" "on click add .foo then tell #d2 then add .bar") - (dom-append (dom-body) _el-d1) - (hs-activate! _el-d1) (dom-set-attr _el-d2 "id" "d2") + (dom-append (dom-body) _el-d1) (dom-append (dom-body) _el-d2) + (hs-activate! _el-d1) (dom-dispatch _el-d1 "click" nil) (assert (not (dom-has-class? _el-d1 "bar"))) (assert (dom-has-class? _el-d1 "foo")) @@ -3300,10 +3369,10 @@ (let ((_el-d1 (dom-create-element "div")) (_el-d2 (dom-create-element "div"))) (dom-set-attr _el-d1 "id" "d1") (dom-set-attr _el-d1 "_" "on click add .foo then tell #d2 then add .bar to me") - (dom-append (dom-body) _el-d1) - (hs-activate! _el-d1) (dom-set-attr _el-d2 "id" "d2") + (dom-append (dom-body) _el-d1) (dom-append (dom-body) _el-d2) + (hs-activate! _el-d1) (dom-dispatch _el-d1 "click" nil) (assert (dom-has-class? _el-d1 "bar")) (assert (dom-has-class? _el-d1 "foo")) @@ -3312,30 +3381,36 @@ )) (deftest "works with an array" (hs-cleanup!) - (let ((_el-d1 (dom-create-element "div"))) + (let ((_el-d1 (dom-create-element "div")) (_el-p1 (dom-create-element "p")) (_el-p2 (dom-create-element "p")) (_el-d2 (dom-create-element "div"))) (dom-set-attr _el-d1 "id" "d1") (dom-set-attr _el-d1 "_" "on click add .foo then tell

in me then add .bar") + (dom-set-attr _el-p1 "id" "p1") + (dom-set-attr _el-p2 "id" "p2") + (dom-set-attr _el-d2 "id" "d2") (dom-append (dom-body) _el-d1) + (dom-append _el-d1 _el-p1) + (dom-append _el-d1 _el-p2) + (dom-append _el-d1 _el-d2) (hs-activate! _el-d1) (dom-dispatch _el-d1 "click" nil) (assert (not (dom-has-class? _el-d1 "bar"))) (assert (dom-has-class? _el-d1 "foo")) (assert (not (dom-has-class? (dom-query-by-id "div2") "bar"))) (assert (not (dom-has-class? (dom-query-by-id "div2") "foo"))) - (assert (dom-has-class? (dom-query-by-id "p1") "bar")) - (assert (not (dom-has-class? (dom-query-by-id "p1") "foo"))) - (assert (dom-has-class? (dom-query-by-id "p2") "bar")) - (assert (not (dom-has-class? (dom-query-by-id "p2") "foo"))) + (assert (dom-has-class? _el-p1 "bar")) + (assert (not (dom-has-class? _el-p1 "foo"))) + (assert (dom-has-class? _el-p2 "bar")) + (assert (not (dom-has-class? _el-p2 "foo"))) )) (deftest "restores a proper implicit me symbol" (hs-cleanup!) (let ((_el-d1 (dom-create-element "div")) (_el-d2 (dom-create-element "div"))) (dom-set-attr _el-d1 "id" "d1") (dom-set-attr _el-d1 "_" "on click tell #d2 then add .bar end then add .foo") - (dom-append (dom-body) _el-d1) - (hs-activate! _el-d1) (dom-set-attr _el-d2 "id" "d2") + (dom-append (dom-body) _el-d1) (dom-append (dom-body) _el-d2) + (hs-activate! _el-d1) (dom-dispatch _el-d1 "click" nil) (assert (not (dom-has-class? _el-d1 "bar"))) (assert (dom-has-class? _el-d1 "foo")) @@ -3347,10 +3422,10 @@ (let ((_el-d1 (dom-create-element "div")) (_el-d2 (dom-create-element "div"))) (dom-set-attr _el-d1 "id" "d1") (dom-set-attr _el-d1 "_" "on click tell null then add .bar end then add .foo") - (dom-append (dom-body) _el-d1) - (hs-activate! _el-d1) (dom-set-attr _el-d2 "id" "d2") + (dom-append (dom-body) _el-d1) (dom-append (dom-body) _el-d2) + (hs-activate! _el-d1) (dom-dispatch _el-d1 "click" nil) (assert (not (dom-has-class? _el-d1 "bar"))) (assert (dom-has-class? _el-d1 "foo")) @@ -3362,10 +3437,10 @@ (let ((_el-d1 (dom-create-element "div")) (_el-d2 (dom-create-element "div"))) (dom-set-attr _el-d1 "id" "d1") (dom-set-attr _el-d1 "_" "on click tell #d2 then add .bar to you") - (dom-append (dom-body) _el-d1) - (hs-activate! _el-d1) (dom-set-attr _el-d2 "id" "d2") + (dom-append (dom-body) _el-d1) (dom-append (dom-body) _el-d2) + (hs-activate! _el-d1) (dom-dispatch _el-d1 "click" nil) (assert (not (dom-has-class? _el-d1 "bar"))) (assert (dom-has-class? _el-d2 "bar")) @@ -3375,11 +3450,11 @@ (let ((_el-d1 (dom-create-element "div")) (_el-d2 (dom-create-element "div"))) (dom-set-attr _el-d1 "id" "d1") (dom-set-attr _el-d1 "_" "on click tell #d2 then put your innerText into me") - (dom-append (dom-body) _el-d1) - (hs-activate! _el-d1) (dom-set-attr _el-d2 "id" "d2") (dom-set-inner-html _el-d2 "foo") + (dom-append (dom-body) _el-d1) (dom-append (dom-body) _el-d2) + (hs-activate! _el-d1) (dom-dispatch _el-d1 "click" nil) ;; SKIP check: skip div1.innerText.should.equal("") ;; SKIP check: skip div2.innerText.should.equal("foo") @@ -3390,11 +3465,11 @@ (let ((_el-d1 (dom-create-element "div")) (_el-d2 (dom-create-element "div"))) (dom-set-attr _el-d1 "id" "d1") (dom-set-attr _el-d1 "_" "on click tell #d2 then put @foo into me") - (dom-append (dom-body) _el-d1) - (hs-activate! _el-d1) (dom-set-attr _el-d2 "id" "d2") (dom-set-attr _el-d2 "foo" "bar") + (dom-append (dom-body) _el-d1) (dom-append (dom-body) _el-d2) + (hs-activate! _el-d1) (dom-dispatch _el-d1 "click" nil) ;; SKIP check: skip div1.innerText.should.equal("") ;; SKIP check: skip div2.innerText.should.equal("") @@ -3402,20 +3477,26 @@ )) (deftest "yourself attribute also works" (hs-cleanup!) - (let ((_el-d1 (dom-create-element "div"))) + (let ((_el-d1 (dom-create-element "div")) (_el-d2 (dom-create-element "div"))) (dom-set-attr _el-d1 "id" "d1") (dom-set-attr _el-d1 "_" "on click tell #d2 remove yourself") + (dom-set-attr _el-d2 "id" "d2") (dom-append (dom-body) _el-d1) + (dom-append _el-d1 _el-d2) (hs-activate! _el-d1) (dom-dispatch _el-d1 "click" nil) (assert= (dom-inner-html _el-d1) "") )) (deftest "tell terminates with a feature" (hs-cleanup!) - (let ((_el-d1 (dom-create-element "div"))) + (let ((_el-d1 (dom-create-element "div")) (_el-d2 (dom-create-element "div")) (_el-d3 (dom-create-element "div"))) (dom-set-attr _el-d1 "id" "d1") (dom-set-attr _el-d1 "_" "on click tell #d2 remove yourself on click tell #d3 remove yourself") + (dom-set-attr _el-d2 "id" "d2") + (dom-set-attr _el-d3 "id" "d3") (dom-append (dom-body) _el-d1) + (dom-append _el-d1 _el-d2) + (dom-append _el-d1 _el-d3) (hs-activate! _el-d1) (dom-dispatch _el-d1 "click" nil) (assert= (dom-inner-html _el-d1) "") @@ -3428,11 +3509,11 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-d1 (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click send example.event to #d1") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-d1 "id" "d1") (dom-set-attr _el-d1 "_" "on example.event add .called") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-d1) + (hs-activate! _el-div) (hs-activate! _el-d1) (dom-dispatch _el-div "click" nil) (assert (dom-has-class? _el-div "called")) @@ -3441,11 +3522,11 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-d1 (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click send example:event to #d1") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-d1 "id" "d1") (dom-set-attr _el-d1 "_" "on example:event add .called") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-d1) + (hs-activate! _el-div) (hs-activate! _el-d1) (dom-dispatch _el-div "click" nil) (assert (dom-has-class? _el-div "called")) @@ -3454,11 +3535,11 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-d1 (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click send \"a-b\" to #d1") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-d1 "id" "d1") (dom-set-attr _el-d1 "_" "on \"a-b\" add .called") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-d1) + (hs-activate! _el-div) (hs-activate! _el-d1) (dom-dispatch _el-div "click" nil) (assert (dom-has-class? _el-div "called")) @@ -3467,8 +3548,8 @@ (hs-cleanup!) (let ((_el-bar (dom-create-element "div")) (_el-div (dom-create-element "div"))) (dom-set-attr _el-bar "id" "bar") - (dom-append (dom-body) _el-bar) (dom-set-attr _el-div "_" "on click from #bar add .clicked") + (dom-append (dom-body) _el-bar) (dom-append (dom-body) _el-div) (hs-activate! _el-div) (dom-dispatch _el-bar "click" nil) @@ -3478,8 +3559,8 @@ (hs-cleanup!) (let ((_el-bar (dom-create-element "div")) (_el-div (dom-create-element "div"))) (dom-set-attr _el-bar "id" "bar") - (dom-append (dom-body) _el-bar) (dom-set-attr _el-div "_" "on click from #bar set #bar.innerHTML to #bar.innerHTML + \"a\"") + (dom-append (dom-body) _el-bar) (dom-append (dom-body) _el-div) (hs-activate! _el-div) (dom-dispatch _el-bar "click" nil) @@ -3521,11 +3602,11 @@ (let ((_el-d1 (dom-create-element "div")) (_el-d2 (dom-create-element "div"))) (dom-set-attr _el-d1 "id" "d1") (dom-set-attr _el-d1 "_" "on click send custom(foo:\"fromBar\") to #d2") - (dom-append (dom-body) _el-d1) - (hs-activate! _el-d1) (dom-set-attr _el-d2 "id" "d2") (dom-set-attr _el-d2 "_" "on custom(foo) call me.classList.add(foo)") + (dom-append (dom-body) _el-d1) (dom-append (dom-body) _el-d2) + (hs-activate! _el-d1) (hs-activate! _el-d2) (dom-dispatch _el-d1 "click" nil) (assert (dom-has-class? _el-d1 "fromBar")) @@ -3535,11 +3616,11 @@ (let ((_el-d1 (dom-create-element "div")) (_el-d2 (dom-create-element "div"))) (dom-set-attr _el-d1 "id" "d1") (dom-set-attr _el-d1 "_" "on click send fromBar to #d2") - (dom-append (dom-body) _el-d1) - (hs-activate! _el-d1) (dom-set-attr _el-d2 "id" "d2") (dom-set-attr _el-d2 "_" "on fromBar(type) call me.classList.add(type)") + (dom-append (dom-body) _el-d1) (dom-append (dom-body) _el-d2) + (hs-activate! _el-d1) (hs-activate! _el-d2) (dom-dispatch _el-d1 "click" nil) (assert (dom-has-class? _el-d1 "fromBar")) @@ -3558,8 +3639,8 @@ (let ((_el-script (dom-create-element "script")) (_el-loadedDemo (dom-create-element "div"))) (dom-set-attr _el-script "type" "text/hyperscript") (dom-set-inner-html _el-script "on load put \"Loaded\" into #loadedDemo.innerHTML") - (dom-append (dom-body) _el-script) (dom-set-attr _el-loadedDemo "id" "loadedDemo") + (dom-append (dom-body) _el-script) (dom-append (dom-body) _el-loadedDemo) ;; SKIP check: skip byId("loadedDemo").innerText.should.equal("Loaded") )) @@ -3577,13 +3658,13 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-div1 (dom-create-element "div")) (_el-div2 (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click[buttons==0] log event then put \"Clicked\" into my.innerHTML") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-div1 "_" "on click[buttons==1] log event then put \"Clicked\" into my.innerHTML") - (dom-append (dom-body) _el-div1) - (hs-activate! _el-div1) (dom-set-attr _el-div2 "_" "on click[buttons==1 and buttons==0] log event then put \"Clicked\" into my.innerHTML") + (dom-append (dom-body) _el-div) + (dom-append (dom-body) _el-div1) (dom-append (dom-body) _el-div2) + (hs-activate! _el-div) + (hs-activate! _el-div1) (hs-activate! _el-div2) (dom-dispatch _el-div "click" nil) (dom-dispatch _el-div "click" nil) @@ -3744,9 +3825,13 @@ )) (deftest "can listen for events in another element (lazy)" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-d1 (dom-create-element "div")) (_el-d2 (dom-create-element "div"))) (dom-set-attr _el-div "_" "on click in #d1 put it into window.tmp") + (dom-set-attr _el-d1 "id" "d1") + (dom-set-attr _el-d2 "id" "d2") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-d1) + (dom-append _el-div _el-d2) (hs-activate! _el-div) (dom-dispatch _el-div "click" nil) ;; SKIP check: skip div1.should.equal(window.tmp) @@ -3885,8 +3970,8 @@ (hs-cleanup!) (let ((_el-d1 (dom-create-element "div")) (_el-div (dom-create-element "div"))) (dom-set-attr _el-d1 "id" "d1") - (dom-append (dom-body) _el-d1) (dom-set-attr _el-div "_" "on mutation of attributes from #d1 put \"Mutated\" into me") + (dom-append (dom-body) _el-d1) (dom-append (dom-body) _el-div) (hs-activate! _el-div) (dom-set-attr _el-d1 "foo" "bar") @@ -3897,15 +3982,15 @@ (let ((_el-script (dom-create-element "script")) (_el-div (dom-create-element "div")) (_el-div2 (dom-create-element "div")) (_el-div3 (dom-create-element "div"))) (dom-set-attr _el-script "type" "text/hyperscript") (dom-set-inner-html _el-script "behavior DemoBehavior on foo wait 10ms then set my innerHTML to 'behavior'") - (dom-append (dom-body) _el-script) (dom-set-attr _el-div "_" "install DemoBehavior") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-div2 "_" "install DemoBehavior") - (dom-append (dom-body) _el-div2) - (hs-activate! _el-div2) (dom-set-attr _el-div3 "_" "install DemoBehavior") + (dom-append (dom-body) _el-script) + (dom-append (dom-body) _el-div) + (dom-append (dom-body) _el-div2) (dom-append (dom-body) _el-div3) + (hs-activate! _el-div) + (hs-activate! _el-div2) (hs-activate! _el-div3) (dom-dispatch _el-div "foo" nil) (dom-dispatch _el-div2 "foo" nil) @@ -3928,8 +4013,8 @@ (let ((_el-script (dom-create-element "script")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-script "type" "text/hyperscript") (dom-set-inner-html _el-script "def throwBar() throw 'bar' end") - (dom-append (dom-body) _el-script) (dom-set-attr _el-button "_" "on click throwBar() catch e put e into me") + (dom-append (dom-body) _el-script) (dom-append (dom-body) _el-button) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) @@ -4070,10 +4155,10 @@ (hs-cleanup!) (let ((_el-d1 (dom-create-element "div")) (_el-d2 (dom-create-element "div")) (_el-div (dom-create-element "div"))) (dom-set-attr _el-d1 "id" "d1") - (dom-append (dom-body) _el-d1) (dom-set-attr _el-d2 "id" "d2") - (dom-append (dom-body) _el-d2) (dom-set-attr _el-div "_" "on click from #d1 or click from #d2 then increment @count then put @count into me") + (dom-append (dom-body) _el-d1) + (dom-append (dom-body) _el-d2) (dom-append (dom-body) _el-div) (hs-activate! _el-div) (dom-dispatch _el-d1 "click" nil) @@ -4165,12 +4250,12 @@ (let ((_el-script (dom-create-element "script")) (_el-div (dom-create-element "div")) (_el-d1 (dom-create-element "div"))) (dom-set-attr _el-script "type" "text/hyperscript") (dom-set-inner-html _el-script "def foo() add .called to #d1 end") - (dom-append (dom-body) _el-script) (dom-set-attr _el-div "_" "on click call foo()") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-d1 "id" "d1") + (dom-append (dom-body) _el-script) + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-d1) + (hs-activate! _el-div) (dom-dispatch _el-script "click" nil) (assert (dom-has-class? _el-div "called")) )) @@ -4179,12 +4264,12 @@ (let ((_el-script (dom-create-element "script")) (_el-div (dom-create-element "div")) (_el-d1 (dom-create-element "div"))) (dom-set-attr _el-script "type" "text/hyperscript") (dom-set-inner-html _el-script "def foo(str) put str into #d1.innerHTML end") - (dom-append (dom-body) _el-script) (dom-set-attr _el-div "_" "on click call foo(\"called\")") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-d1 "id" "d1") + (dom-append (dom-body) _el-script) + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-d1) + (hs-activate! _el-div) (dom-dispatch _el-script "click" nil) (assert= (dom-inner-html _el-div) "called") )) @@ -4193,12 +4278,12 @@ (let ((_el-script (dom-create-element "script")) (_el-div (dom-create-element "div")) (_el-d1 (dom-create-element "div"))) (dom-set-attr _el-script "type" "text/hyperscript") (dom-set-inner-html _el-script "def utils.foo() add .called to #d1 end") - (dom-append (dom-body) _el-script) (dom-set-attr _el-div "_" "on click call utils.foo()") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-d1 "id" "d1") + (dom-append (dom-body) _el-script) + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-d1) + (hs-activate! _el-div) (dom-dispatch _el-script "click" nil) (assert (dom-has-class? _el-div "called")) )) @@ -4207,12 +4292,12 @@ (let ((_el-script (dom-create-element "script")) (_el-div (dom-create-element "div")) (_el-d1 (dom-create-element "div"))) (dom-set-attr _el-script "type" "text/hyperscript") (dom-set-inner-html _el-script "def foo() log meend") - (dom-append (dom-body) _el-script) (dom-set-attr _el-div "_" "on click call foo() then add .called to #d1") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-d1 "id" "d1") + (dom-append (dom-body) _el-script) + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-d1) + (hs-activate! _el-div) (dom-dispatch _el-script "click" nil) (assert (dom-has-class? _el-div "called")) )) @@ -4221,12 +4306,12 @@ (let ((_el-script (dom-create-element "script")) (_el-div (dom-create-element "div")) (_el-d1 (dom-create-element "div"))) (dom-set-attr _el-script "type" "text/hyperscript") (dom-set-inner-html _el-script "def foo() wait 1ms log meend") - (dom-append (dom-body) _el-script) (dom-set-attr _el-div "_" "on click call foo() then add .called to #d1") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-d1 "id" "d1") + (dom-append (dom-body) _el-script) + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-d1) + (hs-activate! _el-div) (dom-dispatch _el-script "click" nil) (assert (dom-has-class? _el-div "called")) )) @@ -4235,12 +4320,12 @@ (let ((_el-script (dom-create-element "script")) (_el-div (dom-create-element "div")) (_el-d1 (dom-create-element "div"))) (dom-set-attr _el-script "type" "text/hyperscript") (dom-set-inner-html _el-script "def foo() return \"foo\"end") - (dom-append (dom-body) _el-script) (dom-set-attr _el-div "_" "on click call foo() then put it into #d1.innerText") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-d1 "id" "d1") + (dom-append (dom-body) _el-script) + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-d1) + (hs-activate! _el-div) (dom-dispatch _el-script "click" nil) ;; SKIP check: skip div.innerText.should.equal("") ;; SKIP check: skip div.innerText.should.equal("foo") @@ -4257,12 +4342,12 @@ (let ((_el-script (dom-create-element "script")) (_el-div (dom-create-element "div")) (_el-d1 (dom-create-element "div"))) (dom-set-attr _el-script "type" "text/hyperscript") (dom-set-inner-html _el-script "def foo() wait 1ms return \"foo\"end") - (dom-append (dom-body) _el-script) (dom-set-attr _el-div "_" "on click call foo() then put it into #d1.innerText") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-d1 "id" "d1") + (dom-append (dom-body) _el-script) + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-d1) + (hs-activate! _el-div) (dom-dispatch _el-script "click" nil) ;; SKIP check: skip div.innerText.should.equal("") ;; SKIP check: skip div.innerText.should.equal("foo") @@ -4342,26 +4427,50 @@ )) (deftest "can install a function on an element and use in children w/ no leak" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-d1 (dom-create-element "div")) (_el-d2 (dom-create-element "div")) (_el-d3 (dom-create-element "div"))) (dom-set-attr _el-div "_" "def func() put 42 into #d3") + (dom-set-attr _el-d1 "id" "d1") + (dom-set-attr _el-d1 "_" "on click call func()") + (dom-set-attr _el-d2 "id" "d2") + (dom-set-attr _el-d3 "id" "d3") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-d1) + (dom-append _el-div _el-d2) + (dom-append _el-div _el-d3) (hs-activate! _el-div) + (hs-activate! _el-d1) ;; SKIP check: skip byId("d3").innerText.should.equal("42") )) (deftest "can install a function on an element and use in children w/ return value" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-d1 (dom-create-element "div")) (_el-d2 (dom-create-element "div")) (_el-d3 (dom-create-element "div"))) (dom-set-attr _el-div "_" "def func() return 42") + (dom-set-attr _el-d1 "id" "d1") + (dom-set-attr _el-d1 "_" "on click put func() into me") + (dom-set-attr _el-d2 "id" "d2") + (dom-set-attr _el-d3 "id" "d3") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-d1) + (dom-append _el-div _el-d2) + (dom-append _el-div _el-d3) (hs-activate! _el-div) + (hs-activate! _el-d1) ;; SKIP check: skip byId("d1").innerText.should.equal("42") )) (deftest "can install a function on an element and use me symbol correctly" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-d1 (dom-create-element "div")) (_el-d2 (dom-create-element "div")) (_el-d3 (dom-create-element "div"))) (dom-set-attr _el-div "_" "def func() put 42 into me") + (dom-set-attr _el-d1 "id" "d1") + (dom-set-attr _el-d1 "_" "on click call func()") + (dom-set-attr _el-d2 "id" "d2") + (dom-set-attr _el-d3 "id" "d3") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-d1) + (dom-append _el-div _el-d2) + (dom-append _el-div _el-d3) (hs-activate! _el-div) + (hs-activate! _el-d1) ;; SKIP check: skip div.innerText.should.equal("42") )) (deftest "finally blocks run normally" @@ -4427,10 +4536,10 @@ (let ((_el-button (dom-create-element "button")) (_el-out (dom-create-element "div"))) (dom-set-attr _el-button "_" "on click ask \"What is your name?\" then put it into #out") (dom-set-inner-html _el-button "Ask") - (dom-append (dom-body) _el-button) - (hs-activate! _el-button) (dom-set-attr _el-out "id" "out") + (dom-append (dom-body) _el-button) (dom-append (dom-body) _el-out) + (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) (assert= (dom-text-content (dom-query-by-id "out")) "Alice") )) @@ -4439,10 +4548,10 @@ (let ((_el-button (dom-create-element "button")) (_el-out (dom-create-element "div"))) (dom-set-attr _el-button "_" "on click ask \"Name?\" then put it into #out") (dom-set-inner-html _el-button "Ask") - (dom-append (dom-body) _el-button) - (hs-activate! _el-button) (dom-set-attr _el-out "id" "out") + (dom-append (dom-body) _el-button) (dom-append (dom-body) _el-out) + (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) (assert= (dom-text-content (dom-query-by-id "out")) "null") )) @@ -4451,10 +4560,10 @@ (let ((_el-button (dom-create-element "button")) (_el-out (dom-create-element "div"))) (dom-set-attr _el-button "_" "on click answer \"Hello!\" then put \"done\" into #out") (dom-set-inner-html _el-button "Go") - (dom-append (dom-body) _el-button) - (hs-activate! _el-button) (dom-set-attr _el-out "id" "out") + (dom-append (dom-body) _el-button) (dom-append (dom-body) _el-out) + (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) (assert= (dom-text-content (dom-query-by-id "out")) "done") )) @@ -4463,10 +4572,10 @@ (let ((_el-button (dom-create-element "button")) (_el-out (dom-create-element "div"))) (dom-set-attr _el-button "_" "on click answer \"Save?\" with \"Yes\" or \"No\" then put it into #out") (dom-set-inner-html _el-button "Go") - (dom-append (dom-body) _el-button) - (hs-activate! _el-button) (dom-set-attr _el-out "id" "out") + (dom-append (dom-body) _el-button) (dom-append (dom-body) _el-out) + (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) (assert= (dom-text-content (dom-query-by-id "out")) "Yes") )) @@ -4475,10 +4584,10 @@ (let ((_el-button (dom-create-element "button")) (_el-out (dom-create-element "div"))) (dom-set-attr _el-button "_" "on click answer \"Save?\" with \"Yes\" or \"No\" then put it into #out") (dom-set-inner-html _el-button "Go") - (dom-append (dom-body) _el-button) - (hs-activate! _el-button) (dom-set-attr _el-out "id" "out") + (dom-append (dom-body) _el-button) (dom-append (dom-body) _el-out) + (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) (assert= (dom-text-content (dom-query-by-id "out")) "No") )) @@ -4488,11 +4597,13 @@ (defsuite "hs-upstream-dialog" (deftest "show opens a dialog as modal" (hs-cleanup!) - (let ((_el-d (dom-create-element "dialog")) (_el-button (dom-create-element "button"))) + (let ((_el-d (dom-create-element "dialog")) (_el-p (dom-create-element "p")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-d "id" "d") - (dom-append (dom-body) _el-d) + (dom-set-inner-html _el-p "Hello") (dom-set-attr _el-button "_" "on click show #d") (dom-set-inner-html _el-button "Open") + (dom-append (dom-body) _el-d) + (dom-append _el-d _el-p) (dom-append (dom-body) _el-button) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) @@ -4500,27 +4611,42 @@ )) (deftest "hide closes a dialog" (hs-cleanup!) - (let ((_el-d (dom-create-element "dialog"))) + (let ((_el-d (dom-create-element "dialog")) (_el-p (dom-create-element "p")) (_el-close (dom-create-element "button"))) (dom-set-attr _el-d "id" "d") + (dom-set-inner-html _el-p "Hello") + (dom-set-attr _el-close "id" "close") + (dom-set-attr _el-close "_" "on click hide #d") + (dom-set-inner-html _el-close "Close") (dom-append (dom-body) _el-d) + (dom-append _el-d _el-p) + (dom-append _el-d _el-close) + (hs-activate! _el-close) (dom-dispatch (dom-query-by-id "close") "click" nil) (assert (not (dom-has-attr? (dom-query-by-id "d") "open"))) )) (deftest "show on already-open dialog is a no-op" (hs-cleanup!) - (let ((_el-d (dom-create-element "dialog"))) + (let ((_el-d (dom-create-element "dialog")) (_el-p (dom-create-element "p")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-d "id" "d") + (dom-set-inner-html _el-p "Hello") + (dom-set-attr _el-button "_" "on click show #d") + (dom-set-inner-html _el-button "Show Again") (dom-append (dom-body) _el-d) - (dom-dispatch (dom-query "button") "click" nil) + (dom-append _el-d _el-p) + (dom-append _el-d _el-button) + (hs-activate! _el-button) + (dom-dispatch _el-button "click" nil) (assert (dom-has-attr? (dom-query-by-id "d") "open")) )) (deftest "open opens a dialog" (hs-cleanup!) - (let ((_el-d (dom-create-element "dialog")) (_el-button (dom-create-element "button"))) + (let ((_el-d (dom-create-element "dialog")) (_el-p (dom-create-element "p")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-d "id" "d") - (dom-append (dom-body) _el-d) + (dom-set-inner-html _el-p "Hello") (dom-set-attr _el-button "_" "on click open #d") (dom-set-inner-html _el-button "Open") + (dom-append (dom-body) _el-d) + (dom-append _el-d _el-p) (dom-append (dom-body) _el-button) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) @@ -4528,19 +4654,30 @@ )) (deftest "close closes a dialog" (hs-cleanup!) - (let ((_el-d (dom-create-element "dialog"))) + (let ((_el-d (dom-create-element "dialog")) (_el-p (dom-create-element "p")) (_el-close (dom-create-element "button"))) (dom-set-attr _el-d "id" "d") + (dom-set-inner-html _el-p "Hello") + (dom-set-attr _el-close "id" "close") + (dom-set-attr _el-close "_" "on click close #d") + (dom-set-inner-html _el-close "Close") (dom-append (dom-body) _el-d) + (dom-append _el-d _el-p) + (dom-append _el-d _el-close) + (hs-activate! _el-close) (dom-dispatch (dom-query-by-id "close") "click" nil) (assert (not (dom-has-attr? (dom-query-by-id "d") "open"))) )) (deftest "open opens a details element" (hs-cleanup!) - (let ((_el-d (dom-create-element "details")) (_el-button (dom-create-element "button"))) + (let ((_el-d (dom-create-element "details")) (_el-summary (dom-create-element "summary")) (_el-p (dom-create-element "p")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-d "id" "d") - (dom-append (dom-body) _el-d) + (dom-set-inner-html _el-summary "More") + (dom-set-inner-html _el-p "Content") (dom-set-attr _el-button "_" "on click open #d") (dom-set-inner-html _el-button "Open") + (dom-append (dom-body) _el-d) + (dom-append _el-d _el-summary) + (dom-append _el-d _el-p) (dom-append (dom-body) _el-button) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) @@ -4548,11 +4685,15 @@ )) (deftest "close closes a details element" (hs-cleanup!) - (let ((_el-d (dom-create-element "details")) (_el-button (dom-create-element "button"))) + (let ((_el-d (dom-create-element "details")) (_el-summary (dom-create-element "summary")) (_el-p (dom-create-element "p")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-d "id" "d") - (dom-append (dom-body) _el-d) + (dom-set-inner-html _el-summary "More") + (dom-set-inner-html _el-p "Content") (dom-set-attr _el-button "_" "on click close #d") (dom-set-inner-html _el-button "Close") + (dom-append (dom-body) _el-d) + (dom-append _el-d _el-summary) + (dom-append _el-d _el-p) (dom-append (dom-body) _el-button) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) @@ -4560,20 +4701,29 @@ )) (deftest "open shows a popover" (hs-cleanup!) - (let ((_el-p (dom-create-element "div")) (_el-button (dom-create-element "button"))) + (let ((_el-p (dom-create-element "div")) (_el-p1 (dom-create-element "p")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-p "id" "p") - (dom-append (dom-body) _el-p) + (dom-set-inner-html _el-p1 "Popover content") (dom-set-attr _el-button "_" "on click open #p") (dom-set-inner-html _el-button "Open") + (dom-append (dom-body) _el-p) + (dom-append _el-p _el-p1) (dom-append (dom-body) _el-button) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) )) (deftest "close hides a popover" (hs-cleanup!) - (let ((_el-p (dom-create-element "div"))) + (let ((_el-p (dom-create-element "div")) (_el-p1 (dom-create-element "p")) (_el-close (dom-create-element "button"))) (dom-set-attr _el-p "id" "p") + (dom-set-inner-html _el-p1 "Popover content") + (dom-set-attr _el-close "id" "close") + (dom-set-attr _el-close "_" "on click close #p") + (dom-set-inner-html _el-close "Close") (dom-append (dom-body) _el-p) + (dom-append _el-p _el-p1) + (dom-append _el-p _el-close) + (hs-activate! _el-close) (dom-dispatch (dom-query-by-id "close") "click" nil) )) (deftest "open on implicit me" @@ -4581,11 +4731,11 @@ (let ((_el-d (dom-create-element "dialog")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-d "id" "d") (dom-set-attr _el-d "_" "on myOpen open") - (dom-append (dom-body) _el-d) - (hs-activate! _el-d) (dom-set-attr _el-button "_" "on click send myOpen to #d") (dom-set-inner-html _el-button "Open") + (dom-append (dom-body) _el-d) (dom-append (dom-body) _el-button) + (hs-activate! _el-d) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) (assert (dom-has-attr? (dom-query-by-id "d") "open")) @@ -4596,10 +4746,14 @@ (defsuite "hs-upstream-empty" (deftest "can empty an element" (hs-cleanup!) - (let ((_el-d1 (dom-create-element "div")) (_el-button (dom-create-element "button"))) + (let ((_el-d1 (dom-create-element "div")) (_el-p (dom-create-element "p")) (_el-p2 (dom-create-element "p")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-d1 "id" "d1") - (dom-append (dom-body) _el-d1) + (dom-set-inner-html _el-p "hello") + (dom-set-inner-html _el-p2 "world") (dom-set-attr _el-button "_" "on click empty #d1") + (dom-append (dom-body) _el-d1) + (dom-append _el-d1 _el-p) + (dom-append _el-d1 _el-p2) (dom-append (dom-body) _el-button) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) @@ -4617,12 +4771,16 @@ )) (deftest "can empty multiple elements" (hs-cleanup!) - (let ((_el-div (dom-create-element "div")) (_el-div1 (dom-create-element "div")) (_el-button (dom-create-element "button"))) + (let ((_el-div (dom-create-element "div")) (_el-p (dom-create-element "p")) (_el-div2 (dom-create-element "div")) (_el-p3 (dom-create-element "p")) (_el-button (dom-create-element "button"))) (dom-add-class _el-div "clearme") - (dom-append (dom-body) _el-div) - (dom-add-class _el-div1 "clearme") - (dom-append (dom-body) _el-div1) + (dom-set-inner-html _el-p "a") + (dom-add-class _el-div2 "clearme") + (dom-set-inner-html _el-p3 "b") (dom-set-attr _el-button "_" "on click empty .clearme") + (dom-append (dom-body) _el-div) + (dom-append _el-div _el-p) + (dom-append (dom-body) _el-div2) + (dom-append _el-div2 _el-p3) (dom-append (dom-body) _el-button) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) @@ -4660,9 +4818,9 @@ (dom-set-attr _el-t1 "id" "t1") (dom-set-attr _el-t1 "type" "text") (dom-set-attr _el-t1 "value" "hello") - (dom-append (dom-body) _el-t1) (dom-set-attr _el-button "_" "on click empty #t1") (dom-set-inner-html _el-button "Empty") + (dom-append (dom-body) _el-t1) (dom-append (dom-body) _el-button) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) @@ -4673,9 +4831,9 @@ (let ((_el-ta1 (dom-create-element "textarea")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-ta1 "id" "ta1") (dom-set-inner-html _el-ta1 "some text") - (dom-append (dom-body) _el-ta1) (dom-set-attr _el-button "_" "on click empty #ta1") (dom-set-inner-html _el-button "Empty") + (dom-append (dom-body) _el-ta1) (dom-append (dom-body) _el-button) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) @@ -4686,9 +4844,9 @@ (let ((_el-cb1 (dom-create-element "input")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-cb1 "id" "cb1") (dom-set-attr _el-cb1 "type" "checkbox") - (dom-append (dom-body) _el-cb1) (dom-set-attr _el-button "_" "on click empty #cb1") (dom-set-inner-html _el-button "Empty") + (dom-append (dom-body) _el-cb1) (dom-append (dom-body) _el-button) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) @@ -4696,22 +4854,38 @@ )) (deftest "can empty a select" (hs-cleanup!) - (let ((_el-sel1 (dom-create-element "select")) (_el-button (dom-create-element "button"))) + (let ((_el-sel1 (dom-create-element "select")) (_el-option (dom-create-element "option")) (_el-option2 (dom-create-element "option")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-sel1 "id" "sel1") - (dom-append (dom-body) _el-sel1) + (dom-set-attr _el-option "value" "a") + (dom-set-inner-html _el-option "A") + (dom-set-attr _el-option2 "value" "b") + (dom-set-inner-html _el-option2 "B") (dom-set-attr _el-button "_" "on click empty #sel1") (dom-set-inner-html _el-button "Empty") + (dom-append (dom-body) _el-sel1) + (dom-append _el-sel1 _el-option) + (dom-append _el-sel1 _el-option2) (dom-append (dom-body) _el-button) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) )) (deftest "can empty a form (clears all inputs)" (hs-cleanup!) - (let ((_el-f1 (dom-create-element "form")) (_el-button (dom-create-element "button"))) + (let ((_el-f1 (dom-create-element "form")) (_el-t2 (dom-create-element "input")) (_el-ta2 (dom-create-element "textarea")) (_el-cb2 (dom-create-element "input")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-f1 "id" "f1") - (dom-append (dom-body) _el-f1) + (dom-set-attr _el-t2 "id" "t2") + (dom-set-attr _el-t2 "type" "text") + (dom-set-attr _el-t2 "value" "val") + (dom-set-attr _el-ta2 "id" "ta2") + (dom-set-inner-html _el-ta2 "text") + (dom-set-attr _el-cb2 "id" "cb2") + (dom-set-attr _el-cb2 "type" "checkbox") (dom-set-attr _el-button "_" "on click empty #f1") (dom-set-inner-html _el-button "Empty") + (dom-append (dom-body) _el-f1) + (dom-append _el-f1 _el-t2) + (dom-append _el-f1 _el-ta2) + (dom-append _el-f1 _el-cb2) (dom-append (dom-body) _el-button) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) @@ -4725,9 +4899,9 @@ (dom-set-attr _el-t3 "id" "t3") (dom-set-attr _el-t3 "type" "text") (dom-set-attr _el-t3 "value" "hello") - (dom-append (dom-body) _el-t3) (dom-set-attr _el-button "_" "on click clear #t3") (dom-set-inner-html _el-button "Clear") + (dom-append (dom-body) _el-t3) (dom-append (dom-body) _el-button) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) @@ -4735,10 +4909,12 @@ )) (deftest "clear works on elements" (hs-cleanup!) - (let ((_el-d2 (dom-create-element "div")) (_el-button (dom-create-element "button"))) + (let ((_el-d2 (dom-create-element "div")) (_el-p (dom-create-element "p")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-d2 "id" "d2") - (dom-append (dom-body) _el-d2) + (dom-set-inner-html _el-p "content") (dom-set-attr _el-button "_" "on click clear #d2") + (dom-append (dom-body) _el-d2) + (dom-append _el-d2 _el-p) (dom-append (dom-body) _el-button) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) @@ -4752,8 +4928,8 @@ (hs-cleanup!) (let ((_el-i1 (dom-create-element "input")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-i1 "id" "i1") - (dom-append (dom-body) _el-i1) (dom-set-attr _el-button "_" "on click focus #i1") + (dom-append (dom-body) _el-i1) (dom-append (dom-body) _el-button) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) @@ -4804,11 +4980,11 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-target (dom-create-element "div")) (_el-div2 (dom-create-element "div"))) (dom-set-attr _el-div "style" "height: 2000px") - (dom-append (dom-body) _el-div) (dom-set-attr _el-target "id" "target") (dom-set-inner-html _el-target "Target") - (dom-append (dom-body) _el-target) (dom-set-attr _el-div2 "_" "on click go to #target") + (dom-append (dom-body) _el-div) + (dom-append (dom-body) _el-target) (dom-append (dom-body) _el-div2) (hs-activate! _el-div2) (dom-dispatch (dom-query "div:nth-of-type(3)") "click" nil) @@ -4817,11 +4993,11 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-target (dom-create-element "div")) (_el-div2 (dom-create-element "div"))) (dom-set-attr _el-div "style" "height: 2000px") - (dom-append (dom-body) _el-div) (dom-set-attr _el-target "id" "target") (dom-set-inner-html _el-target "Target") - (dom-append (dom-body) _el-target) (dom-set-attr _el-div2 "_" "on click go to the top of #target") + (dom-append (dom-body) _el-div) + (dom-append (dom-body) _el-target) (dom-append (dom-body) _el-div2) (hs-activate! _el-div2) (dom-dispatch (dom-query "div:nth-of-type(3)") "click" nil) @@ -4832,11 +5008,17 @@ (defsuite "hs-upstream-halt" (deftest "halts event propagation and default" (hs-cleanup!) - (let ((_el-outer (dom-create-element "div"))) + (let ((_el-outer (dom-create-element "div")) (_el-inner (dom-create-element "a"))) (dom-set-attr _el-outer "id" "outer") (dom-set-attr _el-outer "_" "on click add .outer-clicked") + (dom-set-attr _el-inner "id" "inner") + (dom-set-attr _el-inner "_" "on click halt") + (dom-set-attr _el-inner "href" "#shouldnot") + (dom-set-inner-html _el-inner "click me") (dom-append (dom-body) _el-outer) + (dom-append _el-outer _el-inner) (hs-activate! _el-outer) + (hs-activate! _el-inner) (dom-dispatch (dom-query-by-id "inner") "click" nil) (assert (not (dom-has-class? (dom-query-by-id "outer") "outer-clicked"))) )) @@ -4852,21 +5034,30 @@ )) (deftest "halt the event stops propagation but continues execution" (hs-cleanup!) - (let ((_el-outer (dom-create-element "div"))) + (let ((_el-outer (dom-create-element "div")) (_el-inner (dom-create-element "div"))) (dom-set-attr _el-outer "id" "outer") (dom-set-attr _el-outer "_" "on click add .outer-clicked") + (dom-set-attr _el-inner "id" "inner") + (dom-set-attr _el-inner "_" "on click halt the event then add .continued") + (dom-set-inner-html _el-inner "click me") (dom-append (dom-body) _el-outer) + (dom-append _el-outer _el-inner) (hs-activate! _el-outer) + (hs-activate! _el-inner) (dom-dispatch (dom-query-by-id "inner") "click" nil) (assert (not (dom-has-class? (dom-query-by-id "outer") "outer-clicked"))) (assert (dom-has-class? (dom-query-by-id "inner") "continued")) )) (deftest "halt the event's stops propagation but continues execution" (hs-cleanup!) - (let ((_el-outer (dom-create-element "div"))) + (let ((_el-outer (dom-create-element "div")) (_el-inner (dom-create-element "div"))) (dom-set-attr _el-outer "id" "outer") (dom-set-attr _el-outer "_" "on click add .outer-clicked") + (dom-set-attr _el-inner "id" "inner") + ;; HS source has bare quotes or embedded HTML + (dom-set-inner-html _el-inner "click me") (dom-append (dom-body) _el-outer) + (dom-append _el-outer _el-inner) (hs-activate! _el-outer) (dom-dispatch (dom-query-by-id "inner") "click" nil) (assert (not (dom-has-class? (dom-query-by-id "outer") "outer-clicked"))) @@ -4874,11 +5065,16 @@ )) (deftest "halt bubbling only stops propagation, not default" (hs-cleanup!) - (let ((_el-outer (dom-create-element "div"))) + (let ((_el-outer (dom-create-element "div")) (_el-inner (dom-create-element "div"))) (dom-set-attr _el-outer "id" "outer") (dom-set-attr _el-outer "_" "on click add .outer-clicked") + (dom-set-attr _el-inner "id" "inner") + (dom-set-attr _el-inner "_" "on click halt bubbling then add .continued") + (dom-set-inner-html _el-inner "click me") (dom-append (dom-body) _el-outer) + (dom-append _el-outer _el-inner) (hs-activate! _el-outer) + (hs-activate! _el-inner) (dom-dispatch (dom-query-by-id "inner") "click" nil) (assert (not (dom-has-class? (dom-query-by-id "outer") "outer-clicked"))) (assert (not (dom-has-class? (dom-query-by-id "inner") "continued"))) @@ -4887,11 +5083,16 @@ (error "NOT IMPLEMENTED: test HTML could not be parsed into SX")) (deftest "halt default only prevents default, not propagation" (hs-cleanup!) - (let ((_el-outer (dom-create-element "div"))) + (let ((_el-outer (dom-create-element "div")) (_el-inner (dom-create-element "div"))) (dom-set-attr _el-outer "id" "outer") (dom-set-attr _el-outer "_" "on click add .outer-clicked") + (dom-set-attr _el-inner "id" "inner") + (dom-set-attr _el-inner "_" "on click halt default") + (dom-set-inner-html _el-inner "click me") (dom-append (dom-body) _el-outer) + (dom-append _el-outer _el-inner) (hs-activate! _el-outer) + (hs-activate! _el-inner) (dom-dispatch (dom-query-by-id "inner") "click" nil) (assert (dom-has-class? (dom-query-by-id "outer") "outer-clicked")) )) @@ -4904,8 +5105,9 @@ (let ((_el-target (dom-create-element "div")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-target "id" "target") (dom-set-inner-html _el-target "old") - (dom-append (dom-body) _el-target) ;; HS source has bare quotes or embedded HTML + (dom-set-inner-html _el-button "go") + (dom-append (dom-body) _el-target) (dom-append (dom-body) _el-button) (dom-dispatch _el-button "click" nil) (assert= (dom-text-content (dom-query-by-id "target")) "new") @@ -4915,9 +5117,10 @@ (let ((_el-target (dom-create-element "div")) (_el-go (dom-create-element "button"))) (dom-set-attr _el-target "id" "target") (dom-set-inner-html _el-target "old") - (dom-append (dom-body) _el-target) (dom-set-attr _el-go "id" "go") ;; HS source has bare quotes or embedded HTML + (dom-set-inner-html _el-go "go") + (dom-append (dom-body) _el-target) (dom-append (dom-body) _el-go) (dom-dispatch (dom-query-by-id "go") "click" nil) (assert= (dom-text-content (dom-query-by-id "target")) "new") @@ -4928,40 +5131,59 @@ (dom-set-attr _el-target "id" "target") (dom-add-class _el-target "old") (dom-set-inner-html _el-target "content") - (dom-append (dom-body) _el-target) ;; HS source has bare quotes or embedded HTML + (dom-set-inner-html _el-button "go") + (dom-append (dom-body) _el-target) (dom-append (dom-body) _el-button) (dom-dispatch _el-button "click" nil) (assert (dom-has-class? (dom-query-by-id "target") "new")) )) (deftest "morph adds new children" (hs-cleanup!) - (let ((_el-target (dom-create-element "div")) (_el-target1 (dom-create-element "button"))) + (let ((_el-target (dom-create-element "div")) (_el-span (dom-create-element "span")) (_el-target2 (dom-create-element "button")) (_el-span3 (dom-create-element "span")) (_el-span4 (dom-create-element "span"))) (dom-set-attr _el-target "id" "target") - (dom-append (dom-body) _el-target) - (dom-set-attr _el-target1 "id" "target") + (dom-set-inner-html _el-span "first") + (dom-set-attr _el-target2 "id" "target") ;; HS source has bare quotes or embedded HTML - (dom-append (dom-body) _el-target1) + (dom-set-inner-html _el-span3 "first") + (dom-set-inner-html _el-span4 "second") + (dom-append (dom-body) _el-target) + (dom-append _el-target _el-span) + (dom-append (dom-body) _el-target2) + (dom-append _el-target2 _el-span3) + (dom-append _el-target2 _el-span4) (dom-dispatch (dom-query-by-id "go") "click" nil) )) (deftest "morph removes old children" (hs-cleanup!) - (let ((_el-target (dom-create-element "div")) (_el-target1 (dom-create-element "button"))) + (let ((_el-target (dom-create-element "div")) (_el-span (dom-create-element "span")) (_el-span2 (dom-create-element "span")) (_el-target3 (dom-create-element "button")) (_el-span4 (dom-create-element "span"))) (dom-set-attr _el-target "id" "target") - (dom-append (dom-body) _el-target) - (dom-set-attr _el-target1 "id" "target") + (dom-set-inner-html _el-span "first") + (dom-set-inner-html _el-span2 "second") + (dom-set-attr _el-target3 "id" "target") ;; HS source has bare quotes or embedded HTML - (dom-append (dom-body) _el-target1) + (dom-set-inner-html _el-span4 "first") + (dom-append (dom-body) _el-target) + (dom-append _el-target _el-span) + (dom-append _el-target _el-span2) + (dom-append (dom-body) _el-target3) + (dom-append _el-target3 _el-span4) (dom-dispatch (dom-query-by-id "go") "click" nil) )) (deftest "morph initializes hyperscript on new elements" (hs-cleanup!) - (let ((_el-target (dom-create-element "div")) (_el-target1 (dom-create-element "button"))) + (let ((_el-target (dom-create-element "div")) (_el-p (dom-create-element "p")) (_el-target2 (dom-create-element "button")) (_el-inner (dom-create-element "p"))) (dom-set-attr _el-target "id" "target") - (dom-append (dom-body) _el-target) - (dom-set-attr _el-target1 "id" "target") + (dom-set-inner-html _el-p "old") + (dom-set-attr _el-target2 "id" "target") ;; HS source has bare quotes or embedded HTML - (dom-append (dom-body) _el-target1) + (dom-set-attr _el-inner "id" "inner") + ;; HS source has bare quotes or embedded HTML + (dom-set-inner-html _el-inner "new") + (dom-append (dom-body) _el-target) + (dom-append _el-target _el-p) + (dom-append (dom-body) _el-target2) + (dom-append _el-target2 _el-inner) (dom-dispatch (dom-query-by-id "go") "click" nil) (assert= (dom-text-content (dom-query-by-id "inner")) "new") (dom-dispatch (dom-query-by-id "inner") "click" nil) @@ -4969,29 +5191,46 @@ )) (deftest "morph cleans up removed hyperscript elements" (hs-cleanup!) - (let ((_el-target (dom-create-element "div")) (_el-button (dom-create-element "button"))) + (let ((_el-target (dom-create-element "div")) (_el-child (dom-create-element "div")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-target "id" "target") - (dom-append (dom-body) _el-target) + (dom-set-attr _el-child "id" "child") + (dom-set-attr _el-child "_" "on click put \"alive\" into me") + (dom-set-inner-html _el-child "child") ;; HS source has bare quotes or embedded HTML + (dom-set-inner-html _el-button "go") + (dom-append (dom-body) _el-target) + (dom-append _el-target _el-child) (dom-append (dom-body) _el-button) + (hs-activate! _el-child) (dom-dispatch _el-button "click" nil) )) (deftest "morph reorders children by id" (hs-cleanup!) - (let ((_el-target (dom-create-element "div")) (_el-button (dom-create-element "button"))) + (let ((_el-target (dom-create-element "div")) (_el-a (dom-create-element "div")) (_el-b (dom-create-element "div")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-target "id" "target") - (dom-append (dom-body) _el-target) + (dom-set-attr _el-a "id" "a") + (dom-set-inner-html _el-a "A") + (dom-set-attr _el-b "id" "b") + (dom-set-inner-html _el-b "B") ;; HS source has bare quotes or embedded HTML + (dom-set-inner-html _el-button "go") + (dom-append (dom-body) _el-target) + (dom-append _el-target _el-a) + (dom-append _el-target _el-b) (dom-append (dom-body) _el-button) (dom-dispatch _el-button "click" nil) )) (deftest "morph preserves matched child identity" (hs-cleanup!) - (let ((_el-target (dom-create-element "div")) (_el-go (dom-create-element "button"))) + (let ((_el-target (dom-create-element "div")) (_el-child (dom-create-element "div")) (_el-go (dom-create-element "button"))) (dom-set-attr _el-target "id" "target") - (dom-append (dom-body) _el-target) + (dom-set-attr _el-child "id" "child") + (dom-set-inner-html _el-child "old") (dom-set-attr _el-go "id" "go") ;; HS source has bare quotes or embedded HTML + (dom-set-inner-html _el-go "go") + (dom-append (dom-body) _el-target) + (dom-append _el-target _el-child) (dom-append (dom-body) _el-go) (dom-dispatch (dom-query-by-id "go") "click" nil) )) @@ -5000,10 +5239,10 @@ (let ((_el-target (dom-create-element "div")) (_el-go (dom-create-element "button"))) (dom-set-attr _el-target "id" "target") (dom-set-inner-html _el-target "original") - (dom-append (dom-body) _el-target) (dom-set-attr _el-go "id" "go") (dom-set-attr _el-go "_" "on click set content to \"

morphed
\" then morph #target to content") (dom-set-inner-html _el-go "go") + (dom-append (dom-body) _el-target) (dom-append (dom-body) _el-go) (hs-activate! _el-go) (dom-dispatch (dom-query-by-id "go") "click" nil) @@ -5015,17 +5254,36 @@ (defsuite "hs-upstream-reset" (deftest "can reset a form" (hs-cleanup!) - (let ((_el-f1 (dom-create-element "form"))) + (let ((_el-f1 (dom-create-element "form")) (_el-t1 (dom-create-element "input")) (_el-button (dom-create-element "button")) (_el-rst (dom-create-element "button"))) (dom-set-attr _el-f1 "id" "f1") + (dom-set-attr _el-t1 "id" "t1") + (dom-set-attr _el-t1 "type" "text") + (dom-set-attr _el-t1 "value" "original") + (dom-set-attr _el-button "_" "on click set #t1's value to 'changed'") + (dom-set-attr _el-button "type" "button") + (dom-set-inner-html _el-button "Change") + (dom-set-attr _el-rst "id" "rst") + (dom-set-attr _el-rst "_" "on click reset #f1") + (dom-set-attr _el-rst "type" "button") + (dom-set-inner-html _el-rst "Reset") (dom-append (dom-body) _el-f1) + (dom-append _el-f1 _el-t1) + (dom-append _el-f1 _el-button) + (dom-append _el-f1 _el-rst) + (hs-activate! _el-button) + (hs-activate! _el-rst) (dom-dispatch (dom-query-by-id "rst") "click" nil) (assert= (dom-get-prop (dom-query-by-id "t1") "value") "original") )) (deftest "reset with no target resets me (form)" (hs-cleanup!) - (let ((_el-form (dom-create-element "form"))) + (let ((_el-form (dom-create-element "form")) (_el-t2 (dom-create-element "input"))) (dom-set-attr _el-form "_" "on custom reset") + (dom-set-attr _el-t2 "id" "t2") + (dom-set-attr _el-t2 "type" "text") + (dom-set-attr _el-t2 "value" "default") (dom-append (dom-body) _el-form) + (dom-append _el-form _el-t2) (hs-activate! _el-form) (dom-dispatch _el-form "custom" nil) (assert= (dom-get-prop (dom-query-by-id "t2") "value") "default") @@ -5036,9 +5294,9 @@ (dom-set-attr _el-t3 "id" "t3") (dom-set-attr _el-t3 "type" "text") (dom-set-attr _el-t3 "value" "hello") - (dom-append (dom-body) _el-t3) (dom-set-attr _el-button "_" "on click reset #t3") (dom-set-inner-html _el-button "Reset") + (dom-append (dom-body) _el-t3) (dom-append (dom-body) _el-button) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) @@ -5049,9 +5307,9 @@ (let ((_el-cb1 (dom-create-element "input")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-cb1 "id" "cb1") (dom-set-attr _el-cb1 "type" "checkbox") - (dom-append (dom-body) _el-cb1) (dom-set-attr _el-button "_" "on click reset #cb1") (dom-set-inner-html _el-button "Reset") + (dom-append (dom-body) _el-cb1) (dom-append (dom-body) _el-button) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) @@ -5062,9 +5320,9 @@ (let ((_el-cb2 (dom-create-element "input")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-cb2 "id" "cb2") (dom-set-attr _el-cb2 "type" "checkbox") - (dom-append (dom-body) _el-cb2) (dom-set-attr _el-button "_" "on click reset #cb2") (dom-set-inner-html _el-button "Reset") + (dom-append (dom-body) _el-cb2) (dom-append (dom-body) _el-button) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) @@ -5075,9 +5333,9 @@ (let ((_el-ta1 (dom-create-element "textarea")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-ta1 "id" "ta1") (dom-set-inner-html _el-ta1 "original text") - (dom-append (dom-body) _el-ta1) (dom-set-attr _el-button "_" "on click reset #ta1") (dom-set-inner-html _el-button "Reset") + (dom-append (dom-body) _el-ta1) (dom-append (dom-body) _el-button) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) @@ -5085,11 +5343,20 @@ )) (deftest "can reset a select" (hs-cleanup!) - (let ((_el-sel1 (dom-create-element "select")) (_el-button (dom-create-element "button"))) + (let ((_el-sel1 (dom-create-element "select")) (_el-option (dom-create-element "option")) (_el-option2 (dom-create-element "option")) (_el-option3 (dom-create-element "option")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-sel1 "id" "sel1") - (dom-append (dom-body) _el-sel1) + (dom-set-attr _el-option "value" "a") + (dom-set-inner-html _el-option "A") + (dom-set-attr _el-option2 "value" "b") + (dom-set-inner-html _el-option2 "B") + (dom-set-attr _el-option3 "value" "c") + (dom-set-inner-html _el-option3 "C") (dom-set-attr _el-button "_" "on click reset #sel1") (dom-set-inner-html _el-button "Reset") + (dom-append (dom-body) _el-sel1) + (dom-append _el-sel1 _el-option) + (dom-append _el-sel1 _el-option2) + (dom-append _el-sel1 _el-option3) (dom-append (dom-body) _el-button) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) @@ -5101,13 +5368,13 @@ (dom-add-class _el-input "resettable") (dom-set-attr _el-input "type" "text") (dom-set-attr _el-input "value" "one") - (dom-append (dom-body) _el-input) (dom-add-class _el-input1 "resettable") (dom-set-attr _el-input1 "type" "text") (dom-set-attr _el-input1 "value" "two") - (dom-append (dom-body) _el-input1) (dom-set-attr _el-button "_" "on click reset .resettable") (dom-set-inner-html _el-button "Reset") + (dom-append (dom-body) _el-input) + (dom-append (dom-body) _el-input1) (dom-append (dom-body) _el-button) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) @@ -5120,11 +5387,11 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-target (dom-create-element "div")) (_el-div2 (dom-create-element "div"))) (dom-set-attr _el-div "style" "height: 2000px") - (dom-append (dom-body) _el-div) (dom-set-attr _el-target "id" "target") (dom-set-inner-html _el-target "Target") - (dom-append (dom-body) _el-target) (dom-set-attr _el-div2 "_" "on click scroll to #target") + (dom-append (dom-body) _el-div) + (dom-append (dom-body) _el-target) (dom-append (dom-body) _el-div2) (hs-activate! _el-div2) (dom-dispatch (dom-query "div:nth-of-type(3)") "click" nil) @@ -5133,12 +5400,12 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-target (dom-create-element "div")) (_el-div2 (dom-create-element "div"))) (dom-set-attr _el-div "style" "height: 2000px") - (dom-append (dom-body) _el-div) (dom-set-attr _el-target "id" "target") (dom-set-attr _el-target "style" "height: 200px") (dom-set-inner-html _el-target "Target") - (dom-append (dom-body) _el-target) (dom-set-attr _el-div2 "_" "on click scroll to the top of #target") + (dom-append (dom-body) _el-div) + (dom-append (dom-body) _el-target) (dom-append (dom-body) _el-div2) (hs-activate! _el-div2) (dom-dispatch (dom-query "div:nth-of-type(3)") "click" nil) @@ -5147,8 +5414,8 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-div1 (dom-create-element "div"))) (dom-set-attr _el-div "style" "height: 5000px") - (dom-append (dom-body) _el-div) (dom-set-attr _el-div1 "_" "on click scroll down by 300px") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-div1) (hs-activate! _el-div1) (dom-dispatch (dom-query "div:nth-of-type(2)") "click" nil) @@ -5157,8 +5424,8 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-div1 (dom-create-element "div"))) (dom-set-attr _el-div "style" "height: 5000px") - (dom-append (dom-body) _el-div) (dom-set-attr _el-div1 "_" "on click scroll up by 100px") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-div1) (hs-activate! _el-div1) (dom-dispatch (dom-query "div:nth-of-type(2)") "click" nil) @@ -5167,47 +5434,59 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-div1 (dom-create-element "div"))) (dom-set-attr _el-div "style" "height: 5000px") - (dom-append (dom-body) _el-div) (dom-set-attr _el-div1 "_" "on click scroll by 200px") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-div1) (hs-activate! _el-div1) (dom-dispatch (dom-query "div:nth-of-type(2)") "click" nil) )) (deftest "can scroll container by amount" (hs-cleanup!) - (let ((_el-box (dom-create-element "div")) (_el-go (dom-create-element "button"))) + (let ((_el-box (dom-create-element "div")) (_el-div (dom-create-element "div")) (_el-go (dom-create-element "button"))) (dom-set-attr _el-box "id" "box") (dom-set-attr _el-box "style" "height: 100px; overflow: auto") - (dom-append (dom-body) _el-box) + (dom-set-attr _el-div "style" "height: 1000px") + (dom-set-inner-html _el-div "tall") (dom-set-attr _el-go "id" "go") (dom-set-attr _el-go "_" "on click scroll #box down by 200px") (dom-set-inner-html _el-go "go") + (dom-append (dom-body) _el-box) + (dom-append _el-box _el-div) (dom-append (dom-body) _el-go) (hs-activate! _el-go) (dom-dispatch (dom-query-by-id "go") "click" nil) )) (deftest "can scroll to element in container" (hs-cleanup!) - (let ((_el-box (dom-create-element "div")) (_el-go (dom-create-element "button"))) + (let ((_el-box (dom-create-element "div")) (_el-div (dom-create-element "div")) (_el-item (dom-create-element "div")) (_el-go (dom-create-element "button"))) (dom-set-attr _el-box "id" "box") (dom-set-attr _el-box "style" "height: 100px; overflow: auto") - (dom-append (dom-body) _el-box) + (dom-set-attr _el-div "style" "height: 500px") + (dom-set-inner-html _el-div "spacer") + (dom-set-attr _el-item "id" "item") + (dom-set-inner-html _el-item "target") (dom-set-attr _el-go "id" "go") (dom-set-attr _el-go "_" "on click scroll to #item in #box") (dom-set-inner-html _el-go "go") + (dom-append (dom-body) _el-box) + (dom-append _el-box _el-div) + (dom-append _el-box _el-item) (dom-append (dom-body) _el-go) (hs-activate! _el-go) (dom-dispatch (dom-query-by-id "go") "click" nil) )) (deftest "can scroll left by amount" (hs-cleanup!) - (let ((_el-box (dom-create-element "div")) (_el-go (dom-create-element "button"))) + (let ((_el-box (dom-create-element "div")) (_el-div (dom-create-element "div")) (_el-go (dom-create-element "button"))) (dom-set-attr _el-box "id" "box") (dom-set-attr _el-box "style" "width: 100px; overflow: auto; white-space: nowrap") - (dom-append (dom-body) _el-box) + (dom-set-attr _el-div "style" "width: 5000px; height: 50px") + (dom-set-inner-html _el-div "wide") (dom-set-attr _el-go "id" "go") (dom-set-attr _el-go "_" "on click scroll #box right by 300px") (dom-set-inner-html _el-go "go") + (dom-append (dom-body) _el-box) + (dom-append _el-box _el-div) (dom-append (dom-body) _el-go) (hs-activate! _el-go) (dom-dispatch (dom-query-by-id "go") "click" nil) @@ -5221,9 +5500,9 @@ (let ((_el-inp (dom-create-element "input")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-inp "id" "inp") (dom-set-attr _el-inp "value" "hello world") - (dom-append (dom-body) _el-inp) (dom-set-attr _el-button "_" "on click select #inp") (dom-set-inner-html _el-button "Select") + (dom-append (dom-body) _el-inp) (dom-append (dom-body) _el-button) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) @@ -5233,9 +5512,9 @@ (let ((_el-ta (dom-create-element "textarea")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-ta "id" "ta") (dom-set-inner-html _el-ta "some text") - (dom-append (dom-body) _el-ta) (dom-set-attr _el-button "_" "on click select #ta") (dom-set-inner-html _el-button "Select") + (dom-append (dom-body) _el-ta) (dom-append (dom-body) _el-button) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) @@ -5255,13 +5534,13 @@ (let ((_el-text (dom-create-element "p")) (_el-button (dom-create-element "button")) (_el-out (dom-create-element "div"))) (dom-set-attr _el-text "id" "text") (dom-set-inner-html _el-text "Hello World") - (dom-append (dom-body) _el-text) (dom-set-attr _el-button "_" "on click put the selection into #out") (dom-set-inner-html _el-button "Get") - (dom-append (dom-body) _el-button) - (hs-activate! _el-button) (dom-set-attr _el-out "id" "out") + (dom-append (dom-body) _el-text) + (dom-append (dom-body) _el-button) (dom-append (dom-body) _el-out) + (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) (assert= (dom-text-content (dom-query-by-id "out")) "Hello") )) @@ -5284,14 +5563,14 @@ (let ((_el-d1 (dom-create-element "div")) (_el-a (dom-create-element "span")) (_el-b (dom-create-element "span"))) (dom-set-attr _el-d1 "id" "d1") (dom-set-attr _el-d1 "_" "on click set #a.textContent to \"hello\" then set #b.textContent to \"world\" then swap #a.textContent with #b.textContent") - (dom-append (dom-body) _el-d1) - (hs-activate! _el-d1) (dom-set-attr _el-a "id" "a") (dom-set-inner-html _el-a "x") - (dom-append (dom-body) _el-a) (dom-set-attr _el-b "id" "b") (dom-set-inner-html _el-b "y") + (dom-append (dom-body) _el-d1) + (dom-append (dom-body) _el-a) (dom-append (dom-body) _el-b) + (hs-activate! _el-d1) (dom-dispatch (dom-query-by-id "d1") "click" nil) (assert= (dom-text-content (dom-query-by-id "a")) "world") (assert= (dom-text-content (dom-query-by-id "b")) "hello") @@ -5311,11 +5590,11 @@ (let ((_el-d1 (dom-create-element "div")) (_el-target (dom-create-element "span"))) (dom-set-attr _el-d1 "id" "d1") (dom-set-attr _el-d1 "_" "on click set x to \"old\" then set #target.dataset.val to \"new\" then swap x with #target.dataset.val then put x into me") - (dom-append (dom-body) _el-d1) - (hs-activate! _el-d1) (dom-set-attr _el-target "id" "target") (dom-set-attr _el-target "data-val" "x") + (dom-append (dom-body) _el-d1) (dom-append (dom-body) _el-target) + (hs-activate! _el-d1) (dom-dispatch (dom-query-by-id "d1") "click" nil) (assert= (dom-text-content (dom-query-by-id "d1")) "new") (assert= (dom-get-attr (dom-query-by-id "target") "data-val") "old") @@ -5330,8 +5609,8 @@ (dom-set-attr _el-name-input "id" "name-input") (dom-set-attr _el-name-input "type" "text") (dom-set-attr _el-name-input "value" "Alice") - (dom-append (dom-body) _el-name-input) (dom-set-attr _el-span "_" "bind $name and #name-input.value end then when $name changes put it into me") + (dom-append (dom-body) _el-name-input) (dom-append (dom-body) _el-span) (hs-activate! _el-span) )) @@ -5355,8 +5634,8 @@ (dom-set-attr _el-city-input "id" "city-input") (dom-set-attr _el-city-input "type" "text") (dom-set-attr _el-city-input "value" "Paris") - (dom-append (dom-body) _el-city-input) (dom-set-attr _el-span "_" "bind $city to #city-input.value end then when $city changes put it into me") + (dom-append (dom-body) _el-city-input) (dom-append (dom-body) _el-span) (hs-activate! _el-span) )) @@ -5367,18 +5646,18 @@ (dom-set-attr _el-input "type" "text") (dom-set-attr _el-input "value" "hello") (dom-append (dom-body) _el-input) - (hs-activate! _el-input) (dom-append (dom-body) _el-span) + (hs-activate! _el-input) )) (deftest "shorthand on checkbox binds to checked" (hs-cleanup!) (let ((_el-input (dom-create-element "input")) (_el-span (dom-create-element "span"))) (dom-set-attr _el-input "_" "bind $isDarkMode to me") (dom-set-attr _el-input "type" "checkbox") - (dom-append (dom-body) _el-input) - (hs-activate! _el-input) (dom-set-attr _el-span "_" "when $isDarkMode changes put it into me") + (dom-append (dom-body) _el-input) (dom-append (dom-body) _el-span) + (hs-activate! _el-input) (hs-activate! _el-span) )) (deftest "shorthand on textarea binds to value" @@ -5386,20 +5665,29 @@ (let ((_el-textarea (dom-create-element "textarea")) (_el-span (dom-create-element "span"))) (dom-set-attr _el-textarea "_" "bind $bio to me") (dom-set-inner-html _el-textarea "Hello world") - (dom-append (dom-body) _el-textarea) - (hs-activate! _el-textarea) (dom-set-attr _el-span "_" "when $bio changes put it into me") + (dom-append (dom-body) _el-textarea) (dom-append (dom-body) _el-span) + (hs-activate! _el-textarea) (hs-activate! _el-span) )) (deftest "shorthand on select binds to value" (hs-cleanup!) - (let ((_el-select (dom-create-element "select")) (_el-span (dom-create-element "span"))) + (let ((_el-select (dom-create-element "select")) (_el-option (dom-create-element "option")) (_el-option2 (dom-create-element "option")) (_el-option3 (dom-create-element "option")) (_el-span (dom-create-element "span"))) (dom-set-attr _el-select "_" "bind $country to me") - (dom-append (dom-body) _el-select) - (hs-activate! _el-select) + (dom-set-attr _el-option "value" "us") + (dom-set-inner-html _el-option "United States") + (dom-set-attr _el-option2 "value" "uk") + (dom-set-inner-html _el-option2 "United Kingdom") + (dom-set-attr _el-option3 "value" "fr") + (dom-set-inner-html _el-option3 "France") (dom-set-attr _el-span "_" "when $country changes put it into me") + (dom-append (dom-body) _el-select) + (dom-append _el-select _el-option) + (dom-append _el-select _el-option2) + (dom-append _el-select _el-option3) (dom-append (dom-body) _el-span) + (hs-activate! _el-select) (hs-activate! _el-span) )) (deftest "unsupported element: bind to plain div errors" @@ -5409,10 +5697,10 @@ (let ((_el-input (dom-create-element "input")) (_el-span (dom-create-element "span"))) (dom-set-attr _el-input "_" "bind $price to me") (dom-set-attr _el-input "type" "number") - (dom-append (dom-body) _el-input) - (hs-activate! _el-input) (dom-set-attr _el-span "_" "when $price changes put it into me") + (dom-append (dom-body) _el-input) (dom-append (dom-body) _el-span) + (hs-activate! _el-input) (hs-activate! _el-span) )) (deftest "boolean bind to attribute uses presence/absence" @@ -5452,19 +5740,24 @@ (dom-set-attr _el-input "_" "bind $searchTerm to me") (dom-set-attr _el-input "type" "text") (dom-set-attr _el-input "value" "original") - (dom-append (dom-body) _el-input) - (hs-activate! _el-input) (dom-set-attr _el-span "_" "when $searchTerm changes put it into me") + (dom-append (dom-body) _el-input) (dom-append (dom-body) _el-span) + (hs-activate! _el-input) (hs-activate! _el-span) )) (deftest "form.reset() syncs variable back to default value" (hs-cleanup!) - (let ((_el-test-form (dom-create-element "form")) (_el-span (dom-create-element "span"))) + (let ((_el-test-form (dom-create-element "form")) (_el-input (dom-create-element "input")) (_el-span (dom-create-element "span"))) (dom-set-attr _el-test-form "id" "test-form") - (dom-append (dom-body) _el-test-form) + (dom-set-attr _el-input "_" "bind $formField to me") + (dom-set-attr _el-input "type" "text") + (dom-set-attr _el-input "value" "default") (dom-set-attr _el-span "_" "when $formField changes put it into me") + (dom-append (dom-body) _el-test-form) + (dom-append _el-test-form _el-input) (dom-append (dom-body) _el-span) + (hs-activate! _el-input) (hs-activate! _el-span) )) (deftest "clicking a radio sets the variable to its value" @@ -5474,22 +5767,22 @@ (dom-set-attr _el-input "type" "radio") (dom-set-attr _el-input "name" "color") (dom-set-attr _el-input "value" "red") - (dom-append (dom-body) _el-input) - (hs-activate! _el-input) (dom-set-attr _el-input1 "_" "bind $color to me") (dom-set-attr _el-input1 "type" "radio") (dom-set-attr _el-input1 "name" "color") (dom-set-attr _el-input1 "value" "blue") - (dom-append (dom-body) _el-input1) - (hs-activate! _el-input1) (dom-set-attr _el-input2 "_" "bind $color to me") (dom-set-attr _el-input2 "type" "radio") (dom-set-attr _el-input2 "name" "color") (dom-set-attr _el-input2 "value" "green") - (dom-append (dom-body) _el-input2) - (hs-activate! _el-input2) (dom-set-attr _el-span "_" "when $color changes put it into me") + (dom-append (dom-body) _el-input) + (dom-append (dom-body) _el-input1) + (dom-append (dom-body) _el-input2) (dom-append (dom-body) _el-span) + (hs-activate! _el-input) + (hs-activate! _el-input1) + (hs-activate! _el-input2) (hs-activate! _el-span) (dom-dispatch (dom-query "input[value="blue"]") "click" nil) (dom-dispatch (dom-query "input[value="green"]") "click" nil) @@ -5501,19 +5794,19 @@ (dom-set-attr _el-input "type" "radio") (dom-set-attr _el-input "name" "size") (dom-set-attr _el-input "value" "small") - (dom-append (dom-body) _el-input) - (hs-activate! _el-input) (dom-set-attr _el-input1 "_" "bind $size to me") (dom-set-attr _el-input1 "type" "radio") (dom-set-attr _el-input1 "name" "size") (dom-set-attr _el-input1 "value" "medium") - (dom-append (dom-body) _el-input1) - (hs-activate! _el-input1) (dom-set-attr _el-input2 "_" "bind $size to me") (dom-set-attr _el-input2 "type" "radio") (dom-set-attr _el-input2 "name" "size") (dom-set-attr _el-input2 "value" "large") + (dom-append (dom-body) _el-input) + (dom-append (dom-body) _el-input1) (dom-append (dom-body) _el-input2) + (hs-activate! _el-input) + (hs-activate! _el-input1) (hs-activate! _el-input2) )) (deftest "initial value checks the correct radio on load" @@ -5523,19 +5816,19 @@ (dom-set-attr _el-input "type" "radio") (dom-set-attr _el-input "name" "fruit") (dom-set-attr _el-input "value" "apple") - (dom-append (dom-body) _el-input) - (hs-activate! _el-input) (dom-set-attr _el-input1 "_" "bind $fruit to me") (dom-set-attr _el-input1 "type" "radio") (dom-set-attr _el-input1 "name" "fruit") (dom-set-attr _el-input1 "value" "banana") - (dom-append (dom-body) _el-input1) - (hs-activate! _el-input1) (dom-set-attr _el-input2 "_" "bind $fruit to me") (dom-set-attr _el-input2 "type" "radio") (dom-set-attr _el-input2 "name" "fruit") (dom-set-attr _el-input2 "value" "cherry") + (dom-append (dom-body) _el-input) + (dom-append (dom-body) _el-input1) (dom-append (dom-body) _el-input2) + (hs-activate! _el-input) + (hs-activate! _el-input1) (hs-activate! _el-input2) )) (deftest "variable drives class: setting variable adds/removes class" @@ -5632,8 +5925,8 @@ (dom-set-attr _el-of-input "id" "of-input") (dom-set-attr _el-of-input "type" "text") (dom-set-attr _el-of-input "value" "initial") - (dom-append (dom-body) _el-of-input) (dom-set-attr _el-div "_" "bind $search to value of #of-input") + (dom-append (dom-body) _el-of-input) (dom-append (dom-body) _el-div) (hs-activate! _el-div) )) @@ -5642,9 +5935,9 @@ (let ((_el-dark-toggle (dom-create-element "input")) (_el-div (dom-create-element "div"))) (dom-set-attr _el-dark-toggle "id" "dark-toggle") (dom-set-attr _el-dark-toggle "type" "checkbox") - (dom-append (dom-body) _el-dark-toggle) (dom-set-attr _el-div "_" "bind .dark and #dark-toggle's checked") (dom-set-inner-html _el-div "test") + (dom-append (dom-body) _el-dark-toggle) (dom-append (dom-body) _el-div) (hs-activate! _el-div) )) @@ -5654,8 +5947,8 @@ (dom-set-attr _el-title-input "id" "title-input") (dom-set-attr _el-title-input "type" "text") (dom-set-attr _el-title-input "value" "Hello") - (dom-append (dom-body) _el-title-input) (dom-set-attr _el-h1 "_" "bind @data-title and #title-input's value") + (dom-append (dom-body) _el-title-input) (dom-append (dom-body) _el-h1) (hs-activate! _el-h1) )) @@ -5665,9 +5958,9 @@ (dom-set-attr _el-slider "id" "slider") (dom-set-attr _el-slider "type" "range") (dom-set-attr _el-slider "value" "50") - (dom-append (dom-body) _el-slider) (dom-set-attr _el-input "_" "bind my value and #slider's value") (dom-set-attr _el-input "type" "number") + (dom-append (dom-body) _el-slider) (dom-append (dom-body) _el-input) (hs-activate! _el-input) )) @@ -5677,8 +5970,8 @@ (dom-set-attr _el-name-field "id" "name-field") (dom-set-attr _el-name-field "type" "text") (dom-set-attr _el-name-field "value" "") - (dom-append (dom-body) _el-name-field) (dom-set-attr _el-div "_" "bind $name to #name-field") + (dom-append (dom-body) _el-name-field) (dom-append (dom-body) _el-div) (hs-activate! _el-div) )) @@ -5687,8 +5980,8 @@ (let ((_el-agree-cb (dom-create-element "input")) (_el-div (dom-create-element "div"))) (dom-set-attr _el-agree-cb "id" "agree-cb") (dom-set-attr _el-agree-cb "type" "checkbox") - (dom-append (dom-body) _el-agree-cb) (dom-set-attr _el-div "_" "bind $agreed to #agree-cb") + (dom-append (dom-body) _el-agree-cb) (dom-append (dom-body) _el-div) (hs-activate! _el-div) )) @@ -5697,8 +5990,8 @@ (let ((_el-qty-input (dom-create-element "input")) (_el-div (dom-create-element "div"))) (dom-set-attr _el-qty-input "id" "qty-input") (dom-set-attr _el-qty-input "type" "number") - (dom-append (dom-body) _el-qty-input) (dom-set-attr _el-div "_" "bind $qty to #qty-input") + (dom-append (dom-body) _el-qty-input) (dom-append (dom-body) _el-div) (hs-activate! _el-div) )) @@ -5708,9 +6001,9 @@ (dom-set-attr _el-range-slider "id" "range-slider") (dom-set-attr _el-range-slider "type" "range") (dom-set-attr _el-range-slider "value" "50") - (dom-append (dom-body) _el-range-slider) (dom-set-attr _el-input "_" "bind me to #range-slider") (dom-set-attr _el-input "type" "number") + (dom-append (dom-body) _el-range-slider) (dom-append (dom-body) _el-input) (hs-activate! _el-input) )) @@ -5755,19 +6048,28 @@ (dom-set-attr _el-input "type" "radio") (dom-set-attr _el-input "name" "color") (dom-set-attr _el-input "value" "red") - (dom-append (dom-body) _el-input) - (hs-activate! _el-input) (dom-set-attr _el-input1 "_" "bind $color to me") (dom-set-attr _el-input1 "type" "radio") (dom-set-attr _el-input1 "name" "color") (dom-set-attr _el-input1 "value" "blue") + (dom-append (dom-body) _el-input) (dom-append (dom-body) _el-input1) + (hs-activate! _el-input) (hs-activate! _el-input1) )) (deftest "form reset listener is removed on cleanup" (hs-cleanup!) - (let ((_el-form (dom-create-element "form"))) + (let ((_el-form (dom-create-element "form")) (_el-binput (dom-create-element "input")) (_el-button (dom-create-element "button"))) + (dom-set-attr _el-binput "id" "binput") + (dom-set-attr _el-binput "_" "bind $val to me") + (dom-set-attr _el-binput "type" "text") + (dom-set-attr _el-binput "value" "initial") + (dom-set-attr _el-button "type" "reset") + (dom-set-inner-html _el-button "Reset") (dom-append (dom-body) _el-form) + (dom-append _el-form _el-binput) + (dom-append _el-form _el-button) + (hs-activate! _el-binput) )) ) @@ -5814,14 +6116,14 @@ (let ((_el-w (dom-create-element "span")) (_el-h (dom-create-element "span")) (_el-div (dom-create-element "div"))) (dom-set-attr _el-w "id" "w") (dom-set-attr _el-w "_" "when $doubleWidth changes put it into me") - (dom-append (dom-body) _el-w) - (hs-activate! _el-w) (dom-set-attr _el-h "id" "h") (dom-set-attr _el-h "_" "when $doubleHeight changes put it into me") - (dom-append (dom-body) _el-h) - (hs-activate! _el-h) (dom-set-attr _el-div "_" "live then set $doubleWidth to ($width * 2) then set $doubleHeight to ($height * 2) then end") + (dom-append (dom-body) _el-w) + (dom-append (dom-body) _el-h) (dom-append (dom-body) _el-div) + (hs-activate! _el-w) + (hs-activate! _el-h) (hs-activate! _el-div) )) (deftest "separate live statements create independent effects" @@ -5829,14 +6131,14 @@ (let ((_el-w (dom-create-element "span")) (_el-h (dom-create-element "span")) (_el-div (dom-create-element "div"))) (dom-set-attr _el-w "id" "w") (dom-set-attr _el-w "_" "when $doubleWidth changes put it into me") - (dom-append (dom-body) _el-w) - (hs-activate! _el-w) (dom-set-attr _el-h "id" "h") (dom-set-attr _el-h "_" "when $doubleHeight changes put it into me") - (dom-append (dom-body) _el-h) - (hs-activate! _el-h) (dom-set-attr _el-div "_" "live set $doubleWidth to ($width * 2) end then live set $doubleHeight to ($height * 2)") + (dom-append (dom-body) _el-w) + (dom-append (dom-body) _el-h) (dom-append (dom-body) _el-div) + (hs-activate! _el-w) + (hs-activate! _el-h) (hs-activate! _el-div) )) (deftest "block form cascades inter-dependent commands" @@ -5896,10 +6198,10 @@ (dom-set-attr _el-input "_" "bind $username to me end then live set my @data-mirror to $username") (dom-set-attr _el-input "type" "text") (dom-set-attr _el-input "value" "alice") - (dom-append (dom-body) _el-input) - (hs-activate! _el-input) (dom-set-attr _el-span "_" "when $username changes put it into me") + (dom-append (dom-body) _el-input) (dom-append (dom-body) _el-span) + (hs-activate! _el-input) (hs-activate! _el-span) )) (deftest "reactive effects are stopped on cleanup" @@ -5947,21 +6249,25 @@ )) (deftest "property change on object in array triggers live re-render" (hs-cleanup!) - (let ((_el-people-tmpl (dom-create-element "template")) (_el-div (dom-create-element "div"))) + (let ((_el-people-tmpl (dom-create-element "template")) (_el-span (dom-create-element "span")) (_el-div (dom-create-element "div"))) (dom-set-attr _el-people-tmpl "id" "people-tmpl") - (dom-set-inner-html _el-people-tmpl "#for p in people\\n\\n#end") - (dom-append (dom-body) _el-people-tmpl) + (dom-set-inner-html _el-people-tmpl "#for p in people\\n") + (dom-set-inner-html _el-span "\\${p.name}") (dom-set-attr _el-div "_" "live render #people-tmpl with people: $people then put it into my.innerHTML end") + (dom-append (dom-body) _el-people-tmpl) + (dom-append _el-people-tmpl _el-span) (dom-append (dom-body) _el-div) (hs-activate! _el-div) )) (deftest "push object then modify its property both trigger live" (hs-cleanup!) - (let ((_el-items-tmpl (dom-create-element "template")) (_el-div (dom-create-element "div"))) + (let ((_el-items-tmpl (dom-create-element "template")) (_el-span (dom-create-element "span")) (_el-div (dom-create-element "div"))) (dom-set-attr _el-items-tmpl "id" "items-tmpl") - (dom-set-inner-html _el-items-tmpl "#for item in items\\n\\n#end") - (dom-append (dom-body) _el-items-tmpl) + (dom-set-inner-html _el-items-tmpl "#for item in items\\n") + (dom-set-inner-html _el-span "\\${item.label}") (dom-set-attr _el-div "_" "live render #items-tmpl with items: $items then put it into my.innerHTML end") + (dom-append (dom-body) _el-items-tmpl) + (dom-append _el-items-tmpl _el-span) (dom-append (dom-body) _el-div) (hs-activate! _el-div) )) @@ -5989,8 +6295,8 @@ (dom-set-attr _el-prop-input "id" "prop-input") (dom-set-attr _el-prop-input "type" "text") (dom-set-attr _el-prop-input "value" "start") - (dom-append (dom-body) _el-prop-input) (dom-set-attr _el-output "_" "when #prop-input's value changes put it into me") + (dom-append (dom-body) _el-prop-input) (dom-append (dom-body) _el-output) (hs-activate! _el-output) )) @@ -6011,10 +6317,10 @@ (dom-set-attr _el-box "id" "box") (dom-set-attr _el-box "_" "on resize put detail.width into #out") (dom-set-attr _el-box "style" "width:100px; height:100px") - (dom-append (dom-body) _el-box) - (hs-activate! _el-box) (dom-set-attr _el-out "id" "out") + (dom-append (dom-body) _el-box) (dom-append (dom-body) _el-out) + (hs-activate! _el-box) )) (deftest "provides height in detail" (hs-cleanup!) @@ -6022,19 +6328,19 @@ (dom-set-attr _el-box "id" "box") (dom-set-attr _el-box "_" "on resize put detail.height into #out") (dom-set-attr _el-box "style" "width:100px; height:100px") - (dom-append (dom-body) _el-box) - (hs-activate! _el-box) (dom-set-attr _el-out "id" "out") + (dom-append (dom-body) _el-box) (dom-append (dom-body) _el-out) + (hs-activate! _el-box) )) (deftest "works with from clause" (hs-cleanup!) (let ((_el-box (dom-create-element "div")) (_el-out (dom-create-element "div"))) (dom-set-attr _el-box "id" "box") (dom-set-attr _el-box "style" "width:100px; height:100px") - (dom-append (dom-body) _el-box) (dom-set-attr _el-out "id" "out") (dom-set-attr _el-out "_" "on resize from #box put detail.width into me") + (dom-append (dom-body) _el-box) (dom-append (dom-body) _el-out) (hs-activate! _el-out) )) @@ -6073,11 +6379,11 @@ (let ((_el-d1 (dom-create-element "div")) (_el-d2 (dom-create-element "div"))) (dom-set-attr _el-d1 "id" "d1") (dom-set-attr _el-d1 "_" "when $shared changes put 'first' into me") - (dom-append (dom-body) _el-d1) - (hs-activate! _el-d1) (dom-set-attr _el-d2 "id" "d2") (dom-set-attr _el-d2 "_" "when $shared changes put 'second' into me") + (dom-append (dom-body) _el-d1) (dom-append (dom-body) _el-d2) + (hs-activate! _el-d1) (hs-activate! _el-d2) )) (deftest "executes multiple commands" @@ -6123,8 +6429,8 @@ (dom-set-attr _el-reactive-input "id" "reactive-input") (dom-set-attr _el-reactive-input "type" "text") (dom-set-attr _el-reactive-input "value" "start") - (dom-append (dom-body) _el-reactive-input) (dom-set-attr _el-span "_" "when #reactive-input.value changes put it into me") + (dom-append (dom-body) _el-reactive-input) (dom-append (dom-body) _el-span) (hs-activate! _el-span) )) @@ -6134,8 +6440,8 @@ (dom-set-attr _el-prog-input "id" "prog-input") (dom-set-attr _el-prog-input "type" "text") (dom-set-attr _el-prog-input "value" "initial") - (dom-append (dom-body) _el-prog-input) (dom-set-attr _el-span "_" "when #prog-input.value changes put it into me") + (dom-append (dom-body) _el-prog-input) (dom-append (dom-body) _el-span) (hs-activate! _el-span) )) @@ -6157,11 +6463,11 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-output (dom-create-element "div"))) (dom-set-attr _el-div "_" "when $source changes set $derived to (it * 2)") - (dom-append (dom-body) _el-div) - (hs-activate! _el-div) (dom-set-attr _el-output "id" "output") (dom-set-attr _el-output "_" "when $derived changes put it into me") + (dom-append (dom-body) _el-div) (dom-append (dom-body) _el-output) + (hs-activate! _el-div) (hs-activate! _el-output) )) (deftest "supports multiple when features on the same element" @@ -6201,12 +6507,12 @@ (dom-set-attr _el-d1 "id" "d1") (dom-set-attr _el-d1 "_" "init set :value to 'A' end then when :value changes put it into me end then on click set :value to 'A-clicked'") (dom-set-inner-html _el-d1 "A") - (dom-append (dom-body) _el-d1) - (hs-activate! _el-d1) (dom-set-attr _el-d2 "id" "d2") (dom-set-attr _el-d2 "_" "init set :value to 'B' end then when :value changes put it into me end then on click set :value to 'B-clicked'") (dom-set-inner-html _el-d2 "B") + (dom-append (dom-body) _el-d1) (dom-append (dom-body) _el-d2) + (hs-activate! _el-d1) (hs-activate! _el-d2) (dom-dispatch (dom-query-by-id "d1") "click" nil) (assert= (dom-text-content (dom-query-by-id "d1")) "A-clicked") @@ -6221,8 +6527,8 @@ (dom-set-attr _el-nan-input "id" "nan-input") (dom-set-attr _el-nan-input "type" "text") (dom-set-attr _el-nan-input "value" "not a number") - (dom-append (dom-body) _el-nan-input) (dom-set-attr _el-span "_" "when (#nan-input.value * 1) changes put it into me") + (dom-append (dom-body) _el-nan-input) (dom-append (dom-body) _el-span) (hs-activate! _el-span) )) @@ -6245,8 +6551,8 @@ (let ((_el-cb-input (dom-create-element "input")) (_el-span (dom-create-element "span"))) (dom-set-attr _el-cb-input "id" "cb-input") (dom-set-attr _el-cb-input "type" "checkbox") - (dom-append (dom-body) _el-cb-input) (dom-set-attr _el-span "_" "when #cb-input.checked changes put it into me") + (dom-append (dom-body) _el-cb-input) (dom-append (dom-body) _el-span) (hs-activate! _el-span) )) @@ -6264,8 +6570,8 @@ (dom-set-attr _el-of-input "id" "of-input") (dom-set-attr _el-of-input "type" "text") (dom-set-attr _el-of-input "value" "init") - (dom-append (dom-body) _el-of-input) (dom-set-attr _el-span "_" "when (value of #of-input) changes put it into me") + (dom-append (dom-body) _el-of-input) (dom-append (dom-body) _el-span) (hs-activate! _el-span) )) @@ -6337,14 +6643,14 @@ (let ((_el-d-b (dom-create-element "span")) (_el-d-c (dom-create-element "span")) (_el-div (dom-create-element "div"))) (dom-set-attr _el-d-b "id" "d-b") (dom-set-attr _el-d-b "_" "when $a changes set $b to (it * 2)") - (dom-append (dom-body) _el-d-b) - (hs-activate! _el-d-b) (dom-set-attr _el-d-c "id" "d-c") (dom-set-attr _el-d-c "_" "when $a changes set $c to (it * 3)") - (dom-append (dom-body) _el-d-c) - (hs-activate! _el-d-c) (dom-set-attr _el-div "_" "live increment :runs then put ($ (runs:)' into me") + (dom-append (dom-body) _el-d-b) + (dom-append (dom-body) _el-d-c) (dom-append (dom-body) _el-div) + (hs-activate! _el-d-b) + (hs-activate! _el-d-c) (hs-activate! _el-div) )) (deftest "error in one effect does not break other effects in the same batch" @@ -6371,11 +6677,14 @@ )) (deftest "element moved in DOM retains reactivity" (hs-cleanup!) - (let ((_el-container-a (dom-create-element "div")) (_el-container-b (dom-create-element "div"))) + (let ((_el-container-a (dom-create-element "div")) (_el-span (dom-create-element "span")) (_el-container-b (dom-create-element "div"))) (dom-set-attr _el-container-a "id" "container-a") - (dom-append (dom-body) _el-container-a) + (dom-set-attr _el-span "_" "when $movable changes put it into me") (dom-set-attr _el-container-b "id" "container-b") + (dom-append (dom-body) _el-container-a) + (dom-append _el-container-a _el-span) (dom-append (dom-body) _el-container-b) + (hs-activate! _el-span) )) (deftest "rapid detach/reattach in same sync block does not kill effect" (hs-cleanup!) @@ -6392,11 +6701,11 @@ (let ((_el-button (dom-create-element "button")) (_el-out (dom-create-element "div"))) (dom-set-attr _el-button "_" "on click call failAsync() then put 'should not reach' into #out then") (dom-set-inner-html _el-button "Go") - (dom-append (dom-body) _el-button) - (hs-activate! _el-button) (dom-set-attr _el-out "id" "out") (dom-set-inner-html _el-out "original") + (dom-append (dom-body) _el-button) (dom-append (dom-body) _el-out) + (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) (assert= (dom-text-content (dom-query-by-id "out")) "original") )) @@ -6405,10 +6714,10 @@ (let ((_el-button (dom-create-element "button")) (_el-out (dom-create-element "div"))) (dom-set-attr _el-button "_" "on click call failAsync() then put 'unreachable' into #out then catch e then put e.message into #out then") (dom-set-inner-html _el-button "Go") - (dom-append (dom-body) _el-button) - (hs-activate! _el-button) (dom-set-attr _el-out "id" "out") + (dom-append (dom-body) _el-button) (dom-append (dom-body) _el-out) + (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) (assert= (dom-text-content (dom-query-by-id "out")) "boom") )) @@ -6418,89 +6727,160 @@ (defsuite "hs-upstream-dom-scope" (deftest "isolated stops ^var resolution" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-div1 (dom-create-element "div")) (_el-span (dom-create-element "span"))) (dom-set-attr _el-div "_" "init set ^color to 'red'") + (dom-set-attr _el-div1 "dom-scope" "isolated") + (dom-set-attr _el-span "_" "init if ^color is not undefined put 'leaked' into me else put 'blocked' into me") + (dom-set-inner-html _el-span "waiting") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-div1) + (dom-append _el-div1 _el-span) (hs-activate! _el-div) + (hs-activate! _el-span) )) (deftest "closest jumps to matching ancestor" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-div1 (dom-create-element "div")) (_el-span (dom-create-element "span"))) (dom-add-class _el-div "outer") (dom-set-attr _el-div "_" "init set ^val to 'from-outer'") + (dom-set-attr _el-div1 "_" "init set ^val to 'from-inner'") + (dom-set-attr _el-div1 "dom-scope" "isolated") + (dom-set-attr _el-span "_" "init put ^val into me") + (dom-set-attr _el-span "dom-scope" "closest .outer") + (dom-set-inner-html _el-span "none") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-div1) + (dom-append _el-div1 _el-span) (hs-activate! _el-div) + (hs-activate! _el-div1) + (hs-activate! _el-span) )) (deftest "closest with no match stops resolution" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-span (dom-create-element "span"))) (dom-set-attr _el-div "_" "init set ^val to 'found'") + (dom-set-attr _el-span "_" "init if ^val is not undefined put 'leaked' into me else put 'blocked' into me") + (dom-set-attr _el-span "dom-scope" "closest .nonexistent") + (dom-set-inner-html _el-span "waiting") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-span) (hs-activate! _el-div) + (hs-activate! _el-span) )) (deftest "parent of jumps past matching ancestor to its parent" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-div1 (dom-create-element "div")) (_el-span (dom-create-element "span"))) (dom-add-class _el-div "outer") (dom-set-attr _el-div "_" "init set ^val to 'from-outer'") + (dom-add-class _el-div1 "middle") + (dom-set-attr _el-div1 "_" "init set ^val to 'from-middle'") + (dom-set-attr _el-div1 "dom-scope" "isolated") + (dom-set-attr _el-span "_" "init put ^val into me") + (dom-set-attr _el-span "dom-scope" "parent of .middle") + (dom-set-inner-html _el-span "none") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-div1) + (dom-append _el-div1 _el-span) (hs-activate! _el-div) + (hs-activate! _el-div1) + (hs-activate! _el-span) )) (deftest "isolated allows setting ^var on the isolated element itself" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-div1 (dom-create-element "div")) (_el-span (dom-create-element "span"))) (dom-set-attr _el-div "_" "init set ^outer to 'leaked'") + (dom-set-attr _el-div1 "_" "init set ^inner to 'contained'") + (dom-set-attr _el-div1 "dom-scope" "isolated") + (dom-set-attr _el-span "_" "init put ^inner into me") + (dom-set-inner-html _el-span "none") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-div1) + (dom-append _el-div1 _el-span) (hs-activate! _el-div) + (hs-activate! _el-div1) + (hs-activate! _el-span) )) (deftest "child reads ^var set by parent" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-span (dom-create-element "span"))) (dom-set-attr _el-div "_" "init set ^count to 42") + (dom-set-attr _el-span "_" "on click put ^count into me") + (dom-set-inner-html _el-span "0") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-span) (hs-activate! _el-div) - (dom-dispatch (dom-query "span") "click" nil) - (assert= (dom-text-content (dom-query "span")) "42") + (hs-activate! _el-span) + (dom-dispatch _el-span "click" nil) + (assert= (dom-text-content _el-span) "42") )) (deftest "child writes ^var and parent sees it" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-button (dom-create-element "button")) (_el-span (dom-create-element "span"))) (dom-set-attr _el-div "_" "init set ^count to 0") + (dom-set-attr _el-button "_" "on click set ^count to 99") + (dom-set-inner-html _el-button "set") + (dom-set-attr _el-span "_" "on click put ^count into me") + (dom-set-inner-html _el-span "0") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-button) + (dom-append _el-div _el-span) (hs-activate! _el-div) - (dom-dispatch (dom-query "button") "click" nil) - (dom-dispatch (dom-query "span") "click" nil) - (assert= (dom-text-content (dom-query "span")) "99") + (hs-activate! _el-button) + (hs-activate! _el-span) + (dom-dispatch _el-button "click" nil) + (dom-dispatch _el-span "click" nil) + (assert= (dom-text-content _el-span) "99") )) (deftest "deeply nested child reads ^var from grandparent" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-div1 (dom-create-element "div")) (_el-div2 (dom-create-element "div")) (_el-span (dom-create-element "span"))) (dom-set-attr _el-div "_" "init set ^name to 'alice'") + (dom-set-attr _el-span "_" "on click put ^name into me") + (dom-set-inner-html _el-span "empty") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-div1) + (dom-append _el-div1 _el-div2) + (dom-append _el-div2 _el-span) (hs-activate! _el-div) - (dom-dispatch (dom-query "span") "click" nil) - (assert= (dom-text-content (dom-query "span")) "alice") + (hs-activate! _el-span) + (dom-dispatch _el-span "click" nil) + (assert= (dom-text-content _el-span) "alice") )) (deftest "closest ancestor wins (shadowing)" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-div1 (dom-create-element "div")) (_el-span (dom-create-element "span"))) (dom-set-attr _el-div "_" "init set ^color to 'red'") + (dom-set-attr _el-div1 "_" "init set ^color to 'blue'") + (dom-set-attr _el-span "_" "on click put ^color into me") + (dom-set-inner-html _el-span "empty") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-div1) + (dom-append _el-div1 _el-span) (hs-activate! _el-div) - (dom-dispatch (dom-query "span") "click" nil) - (assert= (dom-text-content (dom-query "span")) "blue") + (hs-activate! _el-div1) + (hs-activate! _el-span) + (dom-dispatch _el-span "click" nil) + (assert= (dom-text-content _el-span) "blue") )) (deftest "sibling subtrees have independent ^vars" (hs-cleanup!) - (let ((_el-a (dom-create-element "div")) (_el-b (dom-create-element "div"))) + (let ((_el-a (dom-create-element "div")) (_el-span (dom-create-element "span")) (_el-b (dom-create-element "div")) (_el-span3 (dom-create-element "span"))) (dom-set-attr _el-a "id" "a") (dom-set-attr _el-a "_" "init set ^val to 'A'") - (dom-append (dom-body) _el-a) - (hs-activate! _el-a) + (dom-set-attr _el-span "_" "on click put ^val into me") + (dom-set-inner-html _el-span "empty") (dom-set-attr _el-b "id" "b") (dom-set-attr _el-b "_" "init set ^val to 'B'") + (dom-set-attr _el-span3 "_" "on click put ^val into me") + (dom-set-inner-html _el-span3 "empty") + (dom-append (dom-body) _el-a) + (dom-append _el-a _el-span) (dom-append (dom-body) _el-b) + (dom-append _el-b _el-span3) + (hs-activate! _el-a) + (hs-activate! _el-span) (hs-activate! _el-b) + (hs-activate! _el-span3) (dom-dispatch (dom-query "#a span") "click" nil) (assert= (dom-text-content (dom-query "#a span")) "A") (dom-dispatch (dom-query "#b span") "click" nil) @@ -6508,73 +6888,111 @@ )) (deftest "write to ^var not found anywhere creates on current element" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-button (dom-create-element "button")) (_el-span (dom-create-element "span"))) + (dom-set-attr _el-button "_" "on click set ^newvar to 'created' then put ^newvar into next ") + (dom-set-inner-html _el-button "go") + (dom-set-inner-html _el-span "empty") (dom-append (dom-body) _el-div) - (dom-dispatch (dom-query "button") "click" nil) - (assert= (dom-text-content (dom-query "span")) "created") + (dom-append _el-div _el-button) + (dom-append _el-div _el-span) + (hs-activate! _el-button) + (dom-dispatch _el-button "click" nil) + (assert= (dom-text-content _el-span) "created") )) (deftest "child write updates the ancestor, not a local copy" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-button (dom-create-element "button")) (_el-span (dom-create-element "span"))) (dom-set-attr _el-div "_" "init set ^shared to 0") + (dom-set-attr _el-button "_" "on click set ^shared to 10") + (dom-set-inner-html _el-button "set") + (dom-set-attr _el-span "_" "on click put ^shared into me") + (dom-set-inner-html _el-span "0") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-button) + (dom-append _el-div _el-span) (hs-activate! _el-div) - (dom-dispatch (dom-query "button") "click" nil) - (dom-dispatch (dom-query "span") "click" nil) - (assert= (dom-text-content (dom-query "span")) "10") + (hs-activate! _el-button) + (hs-activate! _el-span) + (dom-dispatch _el-button "click" nil) + (dom-dispatch _el-span "click" nil) + (assert= (dom-text-content _el-span) "10") )) (deftest "increment works on inherited var" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-div "_" "init set ^count to 0") + (dom-set-attr _el-button "_" "on click put ^count into me") + (dom-set-inner-html _el-button "0") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-button) (hs-activate! _el-div) - (dom-dispatch (dom-query "button") "click" nil) - (dom-dispatch (dom-query "button") "click" nil) - (dom-dispatch (dom-query "button") "click" nil) + (hs-activate! _el-button) + (dom-dispatch _el-button "click" nil) + (dom-dispatch _el-button "click" nil) + (dom-dispatch _el-button "click" nil) (dom-dispatch (dom-query "span") "click" nil) (assert= (dom-text-content (dom-query "span")) "3") )) (deftest "dom keyword works as scope modifier" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-span (dom-create-element "span"))) (dom-set-attr _el-div "_" "init set dom count to 42") + (dom-set-attr _el-span "_" "on click put dom count into me") + (dom-set-inner-html _el-span "0") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-span) (hs-activate! _el-div) - (dom-dispatch (dom-query "span") "click" nil) - (assert= (dom-text-content (dom-query "span")) "42") + (hs-activate! _el-span) + (dom-dispatch _el-span "click" nil) + (assert= (dom-text-content _el-span) "42") )) (deftest "set ^var on explicit element" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-button (dom-create-element "button")) (_el-span (dom-create-element "span"))) (dom-add-class _el-div "store") + (dom-set-attr _el-button "_" "on click set ^data on closest .store to 'hello'") + (dom-set-inner-html _el-button "set") + (dom-set-attr _el-span "_" "on click put ^data on closest .store into me") + (dom-set-inner-html _el-span "read") (dom-append (dom-body) _el-div) - (dom-dispatch (dom-query "button") "click" nil) - (dom-dispatch (dom-query "span") "click" nil) - (assert= (dom-text-content (dom-query "span")) "hello") + (dom-append _el-div _el-button) + (dom-append _el-div _el-span) + (hs-activate! _el-button) + (hs-activate! _el-span) + (dom-dispatch _el-button "click" nil) + (dom-dispatch _el-span "click" nil) + (assert= (dom-text-content _el-span) "hello") )) (deftest "on clause targets a specific ancestor" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-div1 (dom-create-element "div")) (_el-span (dom-create-element "span"))) (dom-add-class _el-div "outer") (dom-set-attr _el-div "_" "init set ^outerVal to 'outer'") + (dom-add-class _el-div1 "inner") + (dom-set-attr _el-div1 "_" "init set ^innerVal to 'inner'") + (dom-set-attr _el-span "_" "on click put ^outerVal on closest .outer into me") + (dom-set-inner-html _el-span "read") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-div1) + (dom-append _el-div1 _el-span) (hs-activate! _el-div) - (dom-dispatch (dom-query "span") "click" nil) - (assert= (dom-text-content (dom-query "span")) "outer") + (hs-activate! _el-div1) + (hs-activate! _el-span) + (dom-dispatch _el-span "click" nil) + (assert= (dom-text-content _el-span) "outer") )) (deftest "on clause with id reference" (hs-cleanup!) (let ((_el-state-holder (dom-create-element "div")) (_el-button (dom-create-element "button")) (_el-span (dom-create-element "span"))) (dom-set-attr _el-state-holder "id" "state-holder") - (dom-append (dom-body) _el-state-holder) (dom-set-attr _el-button "_" "on click set ^count on #state-holder to 99") (dom-set-inner-html _el-button "set") - (dom-append (dom-body) _el-button) - (hs-activate! _el-button) (dom-set-attr _el-span "_" "on click put ^count on #state-holder into me") (dom-set-inner-html _el-span "read") + (dom-append (dom-body) _el-state-holder) + (dom-append (dom-body) _el-button) (dom-append (dom-body) _el-span) + (hs-activate! _el-button) (hs-activate! _el-span) (dom-dispatch _el-button "click" nil) (dom-dispatch _el-span "click" nil) @@ -6582,40 +7000,72 @@ )) (deftest "when reacts to ^var changes" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-div "_" "init set ^count to 0") + (dom-set-attr _el-button "_" "when ^count changes put it into me") + (dom-set-inner-html _el-button "0") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-button) (hs-activate! _el-div) - (dom-dispatch (dom-query "button") "click" nil) + (hs-activate! _el-button) + (dom-dispatch _el-button "click" nil) (assert= (dom-text-content (dom-query "output")) "1") - (dom-dispatch (dom-query "button") "click" nil) + (dom-dispatch _el-button "click" nil) (assert= (dom-text-content (dom-query "output")) "2") )) (deftest "always reacts to ^var changes" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-div "_" "init set ^name to 'alice'") + (dom-set-attr _el-button "_" "on click set ^name to 'bob'") + (dom-set-inner-html _el-button "rename") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-button) (hs-activate! _el-div) - (dom-dispatch (dom-query "button") "click" nil) + (hs-activate! _el-button) + (dom-dispatch _el-button "click" nil) )) (deftest "multiple children react to same ^var" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-button (dom-create-element "button")) (_el-a (dom-create-element "span")) (_el-b (dom-create-element "span"))) (dom-set-attr _el-div "_" "init set ^color to 'red'") + (dom-set-attr _el-button "_" "on click set ^color to 'blue'") + (dom-set-inner-html _el-button "change") + (dom-set-attr _el-a "id" "a") + (dom-set-attr _el-a "_" "when ^color changes put it into me") + (dom-set-attr _el-b "id" "b") + (dom-set-attr _el-b "_" "when ^color changes put it into me") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-button) + (dom-append _el-div _el-a) + (dom-append _el-div _el-b) (hs-activate! _el-div) - (dom-dispatch (dom-query "button") "click" nil) + (hs-activate! _el-button) + (hs-activate! _el-a) + (hs-activate! _el-b) + (dom-dispatch _el-button "click" nil) (assert= (dom-text-content (dom-query-by-id "a")) "blue") (assert= (dom-text-content (dom-query-by-id "b")) "blue") )) (deftest "sibling subtrees react independently with ^var" (hs-cleanup!) - (let ((_el-a (dom-create-element "div"))) + (let ((_el-a (dom-create-element "div")) (_el-button (dom-create-element "button")) (_el-b (dom-create-element "div")) (_el-button3 (dom-create-element "button"))) (dom-set-attr _el-a "id" "a") (dom-set-attr _el-a "_" "init set ^val to 0") + (dom-set-attr _el-button "_" "when ^val changes put it into me") + (dom-set-inner-html _el-button "0") + (dom-set-attr _el-b "id" "b") + (dom-set-attr _el-b "_" "init set ^val to 0") + (dom-set-attr _el-button3 "_" "when ^val changes put it into me") + (dom-set-inner-html _el-button3 "0") (dom-append (dom-body) _el-a) + (dom-append _el-a _el-button) + (dom-append _el-button _el-b) + (dom-append _el-b _el-button3) (hs-activate! _el-a) + (hs-activate! _el-button) + (hs-activate! _el-b) + (hs-activate! _el-button3) (dom-dispatch (dom-query "#a button") "click" nil) (dom-dispatch (dom-query "#a button") "click" nil) (assert= (dom-text-content (dom-query "#a output")) "2") @@ -6626,38 +7076,83 @@ )) (deftest "bind works with ^var" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-input (dom-create-element "input")) (_el-output (dom-create-element "output"))) (dom-set-attr _el-div "_" "init set ^search to ''") + (dom-set-attr _el-input "_" "bind ^search and my value") + (dom-set-attr _el-input "type" "text") + (dom-set-attr _el-output "_" "when ^search changes put it into me") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-input) + (dom-append _el-div _el-output) (hs-activate! _el-div) + (hs-activate! _el-input) + (hs-activate! _el-output) )) (deftest "derived ^var chains reactively" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-span (dom-create-element "span")) (_el-span2 (dom-create-element "span")) (_el-output (dom-create-element "output")) (_el-price-btn (dom-create-element "button")) (_el-qty-btn (dom-create-element "button"))) (dom-set-attr _el-div "_" "init set ^price to 10 then set ^qty to 2 then set ^total to 20") + (dom-set-attr _el-span "_" "when ^price changes set ^total to (^price * ^qty)") + (dom-set-attr _el-span2 "_" "when ^qty changes set ^total to (^price * ^qty)") + (dom-set-attr _el-output "_" "when ^total changes put it into me") + (dom-set-attr _el-price-btn "id" "price-btn") + (dom-set-attr _el-price-btn "_" "on click set ^price to 25") + (dom-set-inner-html _el-price-btn "set price") + (dom-set-attr _el-qty-btn "id" "qty-btn") + (dom-set-attr _el-qty-btn "_" "on click set ^qty to 5") + (dom-set-inner-html _el-qty-btn "set qty") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-span) + (dom-append _el-div _el-span2) + (dom-append _el-div _el-output) + (dom-append _el-div _el-price-btn) + (dom-append _el-div _el-qty-btn) (hs-activate! _el-div) + (hs-activate! _el-span) + (hs-activate! _el-span2) + (hs-activate! _el-output) + (hs-activate! _el-price-btn) + (hs-activate! _el-qty-btn) (dom-dispatch (dom-query-by-id "price-btn") "click" nil) (dom-dispatch (dom-query-by-id "qty-btn") "click" nil) )) (deftest "effect stops when element is removed" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-output (dom-create-element "output")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-div "_" "init set ^msg to 'hello'") + (dom-set-attr _el-output "_" "when ^msg changes put it into me") + (dom-set-attr _el-button "_" "on click set ^msg to 'updated'") + (dom-set-inner-html _el-button "update") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-output) + (dom-append _el-div _el-button) (hs-activate! _el-div) - (dom-dispatch (dom-query "button") "click" nil) + (hs-activate! _el-output) + (hs-activate! _el-button) + (dom-dispatch _el-button "click" nil) )) (deftest "dedup prevents re-fire on same ^var value" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-output (dom-create-element "output")) (_el-button (dom-create-element "button")) (_el-diff (dom-create-element "button"))) (dom-set-attr _el-div "_" "init set ^val to 'same'") + (dom-set-attr _el-output "_" "when ^val changes increment :runs then put :runs into me") + (dom-set-attr _el-button "_" "on click set ^val to 'same'") + (dom-set-inner-html _el-button "same") + (dom-set-attr _el-diff "id" "diff") + (dom-set-attr _el-diff "_" "on click set ^val to 'different'") + (dom-set-inner-html _el-diff "diff") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-output) + (dom-append _el-div _el-button) + (dom-append _el-div _el-diff) (hs-activate! _el-div) + (hs-activate! _el-output) + (hs-activate! _el-button) + (hs-activate! _el-diff) (dom-dispatch (dom-query "button:text("same")") "click" nil) - (assert= (dom-text-content (dom-query "output")) "1") + (assert= (dom-text-content _el-output) "1") (dom-dispatch (dom-query-by-id "diff") "click" nil) - (assert= (dom-text-content (dom-query "output")) "2") + (assert= (dom-text-content _el-output) "2") )) ) @@ -6685,71 +7180,105 @@ (defsuite "hs-upstream-liveTemplate" (deftest "renders static content after the template" (hs-cleanup!) - (let ((_el-template (dom-create-element "template"))) + (let ((_el-template (dom-create-element "template")) (_el-span (dom-create-element "span"))) + (dom-set-inner-html _el-span "Hello World") (dom-append (dom-body) _el-template) + (dom-append _el-template _el-span) )) (deftest "renders template expressions" (hs-cleanup!) - (let ((_el-template (dom-create-element "template"))) + (let ((_el-template (dom-create-element "template")) (_el-span (dom-create-element "span"))) + (dom-set-inner-html _el-span "Hello ${\"\\x24\"}{$ltName}!") (dom-append (dom-body) _el-template) + (dom-append _el-template _el-span) )) (deftest "applies init script from _ attribute" (hs-cleanup!) - (let ((_el-template (dom-create-element "template"))) + (let ((_el-template (dom-create-element "template")) (_el-span (dom-create-element "span"))) (dom-set-attr _el-template "_" "init set ^msg to 'initialized'") + (dom-set-inner-html _el-span "${\"\\x24\"}{^msg}") (dom-append (dom-body) _el-template) + (dom-append _el-template _el-span) (hs-activate! _el-template) )) (deftest "reactively updates when dependencies change" (hs-cleanup!) - (let ((_el-template (dom-create-element "template"))) + (let ((_el-template (dom-create-element "template")) (_el-button (dom-create-element "button")) (_el-span (dom-create-element "span"))) (dom-set-attr _el-template "_" "init set ^count to 0") + (dom-set-attr _el-button "_" "on click increment ^count") + (dom-set-inner-html _el-button "+") + (dom-set-inner-html _el-span "Count: ${\"\\x24\"}{^count}") (dom-append (dom-body) _el-template) + (dom-append _el-template _el-button) + (dom-append _el-template _el-span) (hs-activate! _el-template) + (hs-activate! _el-button) (dom-dispatch (dom-query "[data-live-template] button") "click" nil) )) (deftest "processes hyperscript on inner elements" (hs-cleanup!) - (let ((_el-template (dom-create-element "template"))) + (let ((_el-template (dom-create-element "template")) (_el-button (dom-create-element "button")) (_el-output (dom-create-element "output"))) (dom-set-attr _el-template "_" "init set ^val to 0") + (dom-set-attr _el-button "_" "on click increment ^val then put ^val into the next ") + (dom-set-inner-html _el-button "+") + (dom-set-inner-html _el-output "0") (dom-append (dom-body) _el-template) + (dom-append _el-template _el-button) + (dom-append _el-template _el-output) (hs-activate! _el-template) + (hs-activate! _el-button) (dom-dispatch (dom-query "[data-live-template] button") "click" nil) )) (deftest "supports #for loops" (hs-cleanup!) - (let ((_el-template (dom-create-element "template"))) + (let ((_el-template (dom-create-element "template")) (_el-ul (dom-create-element "ul")) (_el-li (dom-create-element "li"))) (dom-set-attr _el-template "_" "init set ^items to ['a', 'b', 'c']") + (dom-set-inner-html _el-ul "#for item in ^items") + (dom-set-inner-html _el-li "${\"\\x24\"}{item}") (dom-append (dom-body) _el-template) + (dom-append _el-template _el-ul) + (dom-append _el-ul _el-li) (hs-activate! _el-template) )) (deftest "supports #if conditionals" (hs-cleanup!) - (let ((_el-template (dom-create-element "template"))) + (let ((_el-template (dom-create-element "template")) (_el-span (dom-create-element "span"))) (dom-set-attr _el-template "_" "init set ^show to true") - (dom-set-inner-html _el-template "#if ^show#end") + (dom-set-inner-html _el-template "#if ^show") + (dom-set-inner-html _el-span "visible") (dom-append (dom-body) _el-template) + (dom-append _el-template _el-span) (hs-activate! _el-template) )) (deftest "reacts to global state without init script" (hs-cleanup!) - (let ((_el-template (dom-create-element "template"))) + (let ((_el-template (dom-create-element "template")) (_el-p (dom-create-element "p"))) + (dom-set-inner-html _el-p "Hello, ${\"\\x24\"}{$ltGlobal}!") (dom-append (dom-body) _el-template) + (dom-append _el-template _el-p) )) (deftest "wrapper has display:contents" (hs-cleanup!) - (let ((_el-template (dom-create-element "template"))) + (let ((_el-template (dom-create-element "template")) (_el-span (dom-create-element "span"))) + (dom-set-inner-html _el-span "test") (dom-append (dom-body) _el-template) + (dom-append _el-template _el-span) )) (deftest "multiple live templates are independent" (hs-cleanup!) - (let ((_el-template (dom-create-element "template")) (_el-template1 (dom-create-element "template"))) + (let ((_el-template (dom-create-element "template")) (_el-span (dom-create-element "span")) (_el-template2 (dom-create-element "template")) (_el-span3 (dom-create-element "span"))) (dom-set-attr _el-template "_" "init set ^x to 'first'") + (dom-add-class _el-span "a") + (dom-set-inner-html _el-span "${\"\\x24\"}{^x}") + (dom-set-attr _el-template2 "_" "init set ^x to 'second'") + (dom-add-class _el-span3 "b") + (dom-set-inner-html _el-span3 "${\"\\x24\"}{^x}") (dom-append (dom-body) _el-template) + (dom-append _el-template _el-span) + (dom-append (dom-body) _el-template2) + (dom-append _el-template2 _el-span3) (hs-activate! _el-template) - (dom-set-attr _el-template1 "_" "init set ^x to 'second'") - (dom-append (dom-body) _el-template1) - (hs-activate! _el-template1) + (hs-activate! _el-template2) )) ) @@ -6760,8 +7289,9 @@ (let ((_el-target (dom-create-element "div")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-target "id" "target") (dom-set-inner-html _el-target "old") - (dom-append (dom-body) _el-target) ;; HS source has bare quotes or embedded HTML + (dom-set-inner-html _el-button "go") + (dom-append (dom-body) _el-target) (dom-append (dom-body) _el-button) (dom-dispatch _el-button "click" nil) (assert= (dom-text-content (dom-query-by-id "target")) "new") @@ -6771,37 +7301,55 @@ (let ((_el-target (dom-create-element "div")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-target "id" "target") (dom-set-inner-html _el-target "old") - (dom-append (dom-body) _el-target) (dom-set-attr _el-button "_" "on click make a then put \"moved\" into it then set #target to it") (dom-set-inner-html _el-button "go") + (dom-append (dom-body) _el-target) (dom-append (dom-body) _el-button) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) )) (deftest "set .class replaces all matching elements" (hs-cleanup!) - (let ((_el-list (dom-create-element "ul")) (_el-button (dom-create-element "button"))) + (let ((_el-list (dom-create-element "ul")) (_el-li (dom-create-element "li")) (_el-li2 (dom-create-element "li")) (_el-li3 (dom-create-element "li")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-list "id" "list") - (dom-append (dom-body) _el-list) + (dom-add-class _el-li "item") + (dom-set-inner-html _el-li "a") + (dom-add-class _el-li2 "item") + (dom-set-inner-html _el-li2 "b") + (dom-add-class _el-li3 "item") + (dom-set-inner-html _el-li3 "c") ;; HS source has bare quotes or embedded HTML + (dom-set-inner-html _el-button "go") + (dom-append (dom-body) _el-list) + (dom-append _el-list _el-li) + (dom-append _el-list _el-li2) + (dom-append _el-list _el-li3) (dom-append (dom-body) _el-button) (dom-dispatch _el-button "click" nil) )) (deftest "set replaces all matching elements" (hs-cleanup!) - (let ((_el-box (dom-create-element "div")) (_el-button (dom-create-element "button"))) + (let ((_el-box (dom-create-element "div")) (_el-p (dom-create-element "p")) (_el-p2 (dom-create-element "p")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-box "id" "box") - (dom-append (dom-body) _el-box) + (dom-set-inner-html _el-p "one") + (dom-set-inner-html _el-p2 "two") ;; HS source has bare quotes or embedded HTML + (dom-set-inner-html _el-button "go") + (dom-append (dom-body) _el-box) + (dom-append _el-box _el-p) + (dom-append _el-box _el-p2) (dom-append (dom-body) _el-button) (dom-dispatch _el-button "click" nil) )) (deftest "set closest replaces ancestor" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-button (dom-create-element "button"))) (dom-add-class _el-div "wrapper") + ;; HS source has bare quotes or embedded HTML + (dom-set-inner-html _el-button "go") (dom-append (dom-body) _el-div) - (dom-dispatch (dom-query "button") "click" nil) + (dom-append _el-div _el-button) + (dom-dispatch _el-button "click" nil) (assert= (dom-text-content (dom-query ".wrapper")) "replaced") )) (deftest "hyperscript in replacement content is initialized" @@ -6809,9 +7357,10 @@ (let ((_el-target (dom-create-element "div")) (_el-target1 (dom-create-element "button"))) (dom-set-attr _el-target "id" "target") (dom-set-inner-html _el-target "old") - (dom-append (dom-body) _el-target) (dom-set-attr _el-target1 "id" "target") ;; HS source has bare quotes or embedded HTML + (dom-set-inner-html _el-target1 "new'\\\">go") + (dom-append (dom-body) _el-target) (dom-append (dom-body) _el-target1) (dom-dispatch (dom-query-by-id "go") "click" nil) (assert= (dom-text-content (dom-query-by-id "target")) "new") @@ -6820,11 +7369,17 @@ )) (deftest "swap #a with #b swaps DOM positions" (hs-cleanup!) - (let ((_el-container (dom-create-element "div")) (_el-button (dom-create-element "button"))) + (let ((_el-container (dom-create-element "div")) (_el-a (dom-create-element "div")) (_el-b (dom-create-element "div")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-container "id" "container") - (dom-append (dom-body) _el-container) + (dom-set-attr _el-a "id" "a") + (dom-set-inner-html _el-a "A") + (dom-set-attr _el-b "id" "b") + (dom-set-inner-html _el-b "B") (dom-set-attr _el-button "_" "on click swap #a with #b") (dom-set-inner-html _el-button "go") + (dom-append (dom-body) _el-container) + (dom-append _el-container _el-a) + (dom-append _el-container _el-b) (dom-append (dom-body) _el-button) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) @@ -6834,9 +7389,9 @@ (let ((_el-target (dom-create-element "div")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-target "id" "target") (dom-set-inner-html _el-target "old") - (dom-append (dom-body) _el-target) (dom-set-attr _el-button "_" "on click put \"new\" into #target") (dom-set-inner-html _el-button "go") + (dom-append (dom-body) _el-target) (dom-append (dom-body) _el-button) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) @@ -6854,15 +7409,23 @@ ) (deftest "works with DOM elements" (hs-cleanup!) - (let ((_el-list (dom-create-element "ul")) (_el-button (dom-create-element "button")) (_el-out (dom-create-element "div"))) + (let ((_el-list (dom-create-element "ul")) (_el-li (dom-create-element "li")) (_el-li2 (dom-create-element "li")) (_el-li3 (dom-create-element "li")) (_el-button (dom-create-element "button")) (_el-out (dom-create-element "div"))) (dom-set-attr _el-list "id" "list") - (dom-append (dom-body) _el-list) + (dom-add-class _el-li "yes") + (dom-set-inner-html _el-li "A") + (dom-set-inner-html _el-li2 "B") + (dom-add-class _el-li3 "yes") + (dom-set-inner-html _el-li3 "C") (dom-set-attr _el-button "_" "on click set items to
  • in #list then set matches to items where it matches .yes then put matches mapped to its textContent into #out") (dom-set-inner-html _el-button "Go") - (dom-append (dom-body) _el-button) - (hs-activate! _el-button) (dom-set-attr _el-out "id" "out") + (dom-append (dom-body) _el-list) + (dom-append _el-list _el-li) + (dom-append _el-list _el-li2) + (dom-append _el-list _el-li3) + (dom-append (dom-body) _el-button) (dom-append (dom-body) _el-out) + (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) (assert= (dom-text-content (dom-query-by-id "out")) "AC") )) @@ -6895,78 +7458,180 @@ ) (deftest "where binds after in without parens" (hs-cleanup!) - (let ((_el-container (dom-create-element "div"))) + (let ((_el-container (dom-create-element "div")) (_el-span (dom-create-element "span")) (_el-span2 (dom-create-element "span")) (_el-span3 (dom-create-element "span"))) (dom-set-attr _el-container "id" "container") + (dom-add-class _el-span "a") + (dom-set-inner-html _el-span "A") + (dom-add-class _el-span2 "b") + (dom-set-inner-html _el-span2 "B") + (dom-add-class _el-span3 "a") + (dom-set-inner-html _el-span3 "C") (dom-append (dom-body) _el-container) + (dom-append _el-container _el-span) + (dom-append _el-container _el-span2) + (dom-append _el-container _el-span3) )) (deftest "sorted by binds after in without parens" (hs-cleanup!) - (let ((_el-list (dom-create-element "ul"))) + (let ((_el-list (dom-create-element "ul")) (_el-li (dom-create-element "li")) (_el-li2 (dom-create-element "li")) (_el-li3 (dom-create-element "li"))) (dom-set-attr _el-list "id" "list") + (dom-set-inner-html _el-li "C") + (dom-set-inner-html _el-li2 "A") + (dom-set-inner-html _el-li3 "B") (dom-append (dom-body) _el-list) + (dom-append _el-list _el-li) + (dom-append _el-list _el-li2) + (dom-append _el-list _el-li3) )) (deftest "where binds after property access" (error "NOT IMPLEMENTED: test HTML could not be parsed into SX")) (deftest "where after in with mapped to" (hs-cleanup!) - (let ((_el-items (dom-create-element "ul"))) + (let ((_el-items (dom-create-element "ul")) (_el-li (dom-create-element "li")) (_el-li2 (dom-create-element "li")) (_el-li3 (dom-create-element "li"))) (dom-set-attr _el-items "id" "items") + (dom-add-class _el-li "yes") + (dom-set-inner-html _el-li "A") + (dom-set-inner-html _el-li2 "B") + (dom-add-class _el-li3 "yes") + (dom-set-inner-html _el-li3 "C") (dom-append (dom-body) _el-items) + (dom-append _el-items _el-li) + (dom-append _el-items _el-li2) + (dom-append _el-items _el-li3) )) (deftest "where binds after in on closest" (hs-cleanup!) - (let ((_el-box (dom-create-element "div")) (_el-button (dom-create-element "button")) (_el-b2 (dom-create-element "button"))) + (let ((_el-box (dom-create-element "div")) (_el-span (dom-create-element "span")) (_el-span2 (dom-create-element "span")) (_el-span3 (dom-create-element "span")) (_el-button (dom-create-element "button")) (_el-b2 (dom-create-element "button"))) (dom-set-attr _el-box "id" "box") - (dom-append (dom-body) _el-box) + (dom-add-class _el-span "a") + (dom-set-inner-html _el-span "A") + (dom-add-class _el-span2 "b") + (dom-set-inner-html _el-span2 "B") + (dom-add-class _el-span3 "a") + (dom-set-inner-html _el-span3 "C") ;; HS source has bare quotes or embedded HTML - (dom-append (dom-body) _el-button) (dom-set-attr _el-b2 "id" "b2") ;; HS source has bare quotes or embedded HTML + (dom-append (dom-body) _el-box) + (dom-append _el-box _el-span) + (dom-append _el-box _el-span2) + (dom-append _el-box _el-span3) + (dom-append (dom-body) _el-button) (dom-append (dom-body) _el-b2) (dom-dispatch (dom-query-by-id "b2") "click" nil) (assert= (dom-text-content (dom-query-by-id "b2")) "2") )) (deftest "where in init followed by on feature" (hs-cleanup!) - (let ((_el-box (dom-create-element "div")) (_el-button (dom-create-element "button"))) + (let ((_el-box (dom-create-element "div")) (_el-span (dom-create-element "span")) (_el-span2 (dom-create-element "span")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-box "id" "box") - (dom-append (dom-body) _el-box) + (dom-add-class _el-span "a") + (dom-set-inner-html _el-span "A") + (dom-add-class _el-span2 "b") + (dom-set-inner-html _el-span2 "B") ;; HS source has bare quotes or embedded HTML + (dom-append (dom-body) _el-box) + (dom-append _el-box _el-span) + (dom-append _el-box _el-span2) (dom-append (dom-body) _el-button) (dom-dispatch _el-button "click" nil) (assert= (dom-text-content _el-button) "1") )) (deftest "where in component init followed by on feature" (hs-cleanup!) - (let ((_el-box (dom-create-element "div")) (_el-template (dom-create-element "template")) (_el-test-where-comp (dom-create-element "test-where-comp"))) + (let ((_el-box (dom-create-element "div")) (_el-span (dom-create-element "span")) (_el-span2 (dom-create-element "span")) (_el-template (dom-create-element "template")) (_el-slot (dom-create-element "slot")) (_el-test-where-comp (dom-create-element "test-where-comp"))) (dom-set-attr _el-box "id" "box") - (dom-append (dom-body) _el-box) + (dom-add-class _el-span "a") + (dom-set-inner-html _el-span "A") + (dom-add-class _el-span2 "b") + (dom-set-inner-html _el-span2 "B") (dom-set-attr _el-template "_" "set :items to in #box where it matches .a then on click put :items.length into me") (dom-set-attr _el-template "component" "test-where-comp") - (dom-append (dom-body) _el-template) - (hs-activate! _el-template) (dom-set-inner-html _el-test-where-comp "go") + (dom-append (dom-body) _el-box) + (dom-append _el-box _el-span) + (dom-append _el-box _el-span2) + (dom-append (dom-body) _el-template) + (dom-append _el-template _el-slot) (dom-append (dom-body) _el-test-where-comp) + (hs-activate! _el-template) (dom-dispatch _el-test-where-comp "click" nil) (assert= (dom-text-content _el-test-where-comp) "1") )) (deftest "where with is not me in component template" (hs-cleanup!) - (let ((_el-box (dom-create-element "div"))) + (let ((_el-box (dom-create-element "div")) (_el-input (dom-create-element "input")) (_el-input2 (dom-create-element "input")) (_el-template (dom-create-element "template")) (_el-input4 (dom-create-element "input")) (_el-test-where-me (dom-create-element "test-where-me"))) (dom-set-attr _el-box "id" "box") + (dom-add-class _el-input "cb") + (dom-set-attr _el-input "type" "checkbox") + (dom-add-class _el-input2 "cb") + (dom-set-attr _el-input2 "type" "checkbox") + (dom-set-attr _el-template "component" "test-where-me") + (dom-set-attr _el-input4 "_" "set :checkboxes to in #box where it is not me on change set checked of the :checkboxes to my checked") + (dom-set-attr _el-input4 "type" "checkbox") (dom-append (dom-body) _el-box) + (dom-append _el-box _el-input) + (dom-append _el-input _el-input2) + (dom-append _el-input2 _el-template) + (dom-append _el-template _el-input4) + (dom-append _el-input4 _el-test-where-me) + (hs-activate! _el-input4) (dom-dispatch (dom-query "test-where-me input") "click" nil) )) (deftest "where with is not me followed by on feature" (hs-cleanup!) - (let ((_el-table (dom-create-element "table"))) + (let ((_el-table (dom-create-element "table")) (_el-tr (dom-create-element "tr")) (_el-td (dom-create-element "td")) (_el-input (dom-create-element "input")) (_el-tr4 (dom-create-element "tr")) (_el-td5 (dom-create-element "td")) (_el-input6 (dom-create-element "input")) (_el-tr7 (dom-create-element "tr")) (_el-td8 (dom-create-element "td")) (_el-input9 (dom-create-element "input")) (_el-tr10 (dom-create-element "tr")) (_el-td11 (dom-create-element "td")) (_el-master (dom-create-element "input"))) + (dom-add-class _el-input "cb") + (dom-set-attr _el-input "type" "checkbox") + (dom-add-class _el-input6 "cb") + (dom-set-attr _el-input6 "type" "checkbox") + (dom-add-class _el-input9 "cb") + (dom-set-attr _el-input9 "type" "checkbox") + (dom-set-attr _el-master "id" "master") + (dom-set-attr _el-master "_" "set :checkboxes to in the closest where it is not me then on change set checked of the :checkboxes to my checked") + (dom-set-attr _el-master "type" "checkbox") (dom-append (dom-body) _el-table) + (dom-append _el-table _el-tr) + (dom-append _el-tr _el-td) + (dom-append _el-td _el-input) + (dom-append _el-input _el-tr4) + (dom-append _el-tr4 _el-td5) + (dom-append _el-td5 _el-input6) + (dom-append _el-input6 _el-tr7) + (dom-append _el-tr7 _el-td8) + (dom-append _el-td8 _el-input9) + (dom-append _el-input9 _el-tr10) + (dom-append _el-tr10 _el-td11) + (dom-append _el-td11 _el-master) + (hs-activate! _el-master) (dom-dispatch (dom-query-by-id "master") "click" nil) )) (deftest "full select-all pattern with multiple on features" (hs-cleanup!) - (let ((_el-table (dom-create-element "table"))) + (let ((_el-table (dom-create-element "table")) (_el-tr (dom-create-element "tr")) (_el-td (dom-create-element "td")) (_el-input (dom-create-element "input")) (_el-tr4 (dom-create-element "tr")) (_el-td5 (dom-create-element "td")) (_el-input6 (dom-create-element "input")) (_el-tr7 (dom-create-element "tr")) (_el-td8 (dom-create-element "td")) (_el-input9 (dom-create-element "input")) (_el-tr10 (dom-create-element "tr")) (_el-td11 (dom-create-element "td")) (_el-master (dom-create-element "input"))) + (dom-add-class _el-input "cb") + (dom-set-attr _el-input "type" "checkbox") + (dom-add-class _el-input6 "cb") + (dom-set-attr _el-input6 "type" "checkbox") + (dom-add-class _el-input9 "cb") + (dom-set-attr _el-input9 "type" "checkbox") + (dom-set-attr _el-master "id" "master") + (dom-set-attr _el-master "_" "set :checkboxes to in the closest
    where it is not me then on change set checked of the :checkboxes to my checked then on change from the closest
    then if no :checkboxes where it is checked then set my indeterminate to false then set my checked to false then else if no :checkboxes where it is not checked then set my indeterminate to false then set my checked to true then else then set my indeterminate to true then end") + (dom-set-attr _el-master "type" "checkbox") (dom-append (dom-body) _el-table) + (dom-append _el-table _el-tr) + (dom-append _el-tr _el-td) + (dom-append _el-td _el-input) + (dom-append _el-input _el-tr4) + (dom-append _el-tr4 _el-td5) + (dom-append _el-td5 _el-input6) + (dom-append _el-input6 _el-tr7) + (dom-append _el-tr7 _el-td8) + (dom-append _el-td8 _el-input9) + (dom-append _el-input9 _el-tr10) + (dom-append _el-tr10 _el-td11) + (dom-append _el-td11 _el-master) + (hs-activate! _el-master) (dom-dispatch (dom-query-by-id "master") "click" nil) )) ) @@ -7000,181 +7665,283 @@ (defsuite "hs-upstream-component" (deftest "registers a custom element from a template" (hs-cleanup!) - (let ((_el-template (dom-create-element "template")) (_el-test-hello (dom-create-element "test-hello"))) + (let ((_el-template (dom-create-element "template")) (_el-span (dom-create-element "span")) (_el-test-hello (dom-create-element "test-hello"))) (dom-set-attr _el-template "component" "test-hello") + (dom-set-inner-html _el-span "Hello World") (dom-append (dom-body) _el-template) + (dom-append _el-template _el-span) (dom-append (dom-body) _el-test-hello) )) (deftest "renders template expressions" (hs-cleanup!) - (let ((_el-template (dom-create-element "template")) (_el-test-greet (dom-create-element "test-greet"))) + (let ((_el-template (dom-create-element "template")) (_el-span (dom-create-element "span")) (_el-test-greet (dom-create-element "test-greet"))) (dom-set-attr _el-template "component" "test-greet") + (dom-set-inner-html _el-span "Hello ${\"\\x24\"}{$name}!") (dom-append (dom-body) _el-template) + (dom-append _el-template _el-span) (dom-append (dom-body) _el-test-greet) )) (deftest "applies _ hyperscript to component instance" (hs-cleanup!) - (let ((_el-template (dom-create-element "template")) (_el-test-init (dom-create-element "test-init"))) + (let ((_el-template (dom-create-element "template")) (_el-span (dom-create-element "span")) (_el-test-init (dom-create-element "test-init"))) (dom-set-attr _el-template "_" "init set ^msg to 'initialized'") (dom-set-attr _el-template "component" "test-init") + (dom-set-inner-html _el-span "${\"\\x24\"}{^msg}") (dom-append (dom-body) _el-template) - (hs-activate! _el-template) + (dom-append _el-template _el-span) (dom-append (dom-body) _el-test-init) + (hs-activate! _el-template) )) (deftest "processes _ on inner elements" (hs-cleanup!) - (let ((_el-template (dom-create-element "template")) (_el-test-inner (dom-create-element "test-inner"))) + (let ((_el-template (dom-create-element "template")) (_el-button (dom-create-element "button")) (_el-span (dom-create-element "span")) (_el-test-inner (dom-create-element "test-inner"))) (dom-set-attr _el-template "_" "init set ^count to 0") (dom-set-attr _el-template "component" "test-inner") + (dom-set-attr _el-button "_" "on click increment ^count then put ^count into the next ") + (dom-set-inner-html _el-button "+") + (dom-set-inner-html _el-span "0") (dom-append (dom-body) _el-template) - (hs-activate! _el-template) + (dom-append _el-template _el-button) + (dom-append _el-template _el-span) (dom-append (dom-body) _el-test-inner) + (hs-activate! _el-template) + (hs-activate! _el-button) (dom-dispatch (dom-query "test-inner button") "click" nil) )) (deftest "reactively updates template expressions" (hs-cleanup!) - (let ((_el-template (dom-create-element "template")) (_el-test-reactive (dom-create-element "test-reactive"))) + (let ((_el-template (dom-create-element "template")) (_el-button (dom-create-element "button")) (_el-span (dom-create-element "span")) (_el-test-reactive (dom-create-element "test-reactive"))) (dom-set-attr _el-template "_" "init set ^count to 0") (dom-set-attr _el-template "component" "test-reactive") + (dom-set-attr _el-button "_" "on click increment ^count") + (dom-set-inner-html _el-button "+") + (dom-set-inner-html _el-span "Count: ${\"\\x24\"}{^count}") (dom-append (dom-body) _el-template) - (hs-activate! _el-template) + (dom-append _el-template _el-button) + (dom-append _el-template _el-span) (dom-append (dom-body) _el-test-reactive) + (hs-activate! _el-template) + (hs-activate! _el-button) (dom-dispatch (dom-query "test-reactive button") "click" nil) )) (deftest "supports multiple independent instances" (hs-cleanup!) - (let ((_el-template (dom-create-element "template")) (_el-a (dom-create-element "test-multi")) (_el-b (dom-create-element "test-multi"))) + (let ((_el-template (dom-create-element "template")) (_el-button (dom-create-element "button")) (_el-span (dom-create-element "span")) (_el-a (dom-create-element "test-multi")) (_el-b (dom-create-element "test-multi"))) (dom-set-attr _el-template "_" "init set ^count to 0") (dom-set-attr _el-template "component" "test-multi") - (dom-append (dom-body) _el-template) - (hs-activate! _el-template) + (dom-set-attr _el-button "_" "on click increment ^count then put ^count into the next ") + (dom-set-inner-html _el-button "+") + (dom-set-inner-html _el-span "0") (dom-set-attr _el-a "id" "a") - (dom-append (dom-body) _el-a) (dom-set-attr _el-b "id" "b") + (dom-append (dom-body) _el-template) + (dom-append _el-template _el-button) + (dom-append _el-template _el-span) + (dom-append (dom-body) _el-a) (dom-append (dom-body) _el-b) + (hs-activate! _el-template) + (hs-activate! _el-button) (dom-dispatch (dom-query "#a button") "click" nil) )) (deftest "reads attributes via @" (hs-cleanup!) - (let ((_el-template (dom-create-element "template")) (_el-test-attrs (dom-create-element "test-attrs"))) + (let ((_el-template (dom-create-element "template")) (_el-span (dom-create-element "span")) (_el-test-attrs (dom-create-element "test-attrs"))) (dom-set-attr _el-template "_" "init set ^val to @data-start as Int") (dom-set-attr _el-template "component" "test-attrs") - (dom-append (dom-body) _el-template) - (hs-activate! _el-template) + (dom-set-inner-html _el-span "${\"\\x24\"}{^val}") (dom-set-attr _el-test-attrs "data-start" "42") + (dom-append (dom-body) _el-template) + (dom-append _el-template _el-span) (dom-append (dom-body) _el-test-attrs) + (hs-activate! _el-template) )) (deftest "supports #for loops in template" (hs-cleanup!) - (let ((_el-template (dom-create-element "template")) (_el-test-loop (dom-create-element "test-loop"))) + (let ((_el-template (dom-create-element "template")) (_el-ul (dom-create-element "ul")) (_el-li (dom-create-element "li")) (_el-test-loop (dom-create-element "test-loop"))) (dom-set-attr _el-template "_" "init set ^items to ['a', 'b', 'c']") (dom-set-attr _el-template "component" "test-loop") + (dom-set-inner-html _el-ul "#for item in ^items") + (dom-set-inner-html _el-li "${\"\\x24\"}{item}") (dom-append (dom-body) _el-template) - (hs-activate! _el-template) + (dom-append _el-template _el-ul) + (dom-append _el-ul _el-li) (dom-append (dom-body) _el-test-loop) + (hs-activate! _el-template) )) (deftest "supports #if conditionals in template" (hs-cleanup!) - (let ((_el-template (dom-create-element "template")) (_el-test-cond (dom-create-element "test-cond"))) + (let ((_el-template (dom-create-element "template")) (_el-span (dom-create-element "span")) (_el-test-cond (dom-create-element "test-cond"))) (dom-set-attr _el-template "_" "init set ^show to true") (dom-set-attr _el-template "component" "test-cond") - (dom-set-inner-html _el-template "#if ^show#end") + (dom-set-inner-html _el-template "#if ^show") + (dom-set-inner-html _el-span "visible") (dom-append (dom-body) _el-template) - (hs-activate! _el-template) + (dom-append _el-template _el-span) (dom-append (dom-body) _el-test-cond) + (hs-activate! _el-template) )) (deftest "substitutes slot content into template" (hs-cleanup!) - (let ((_el-template (dom-create-element "template")) (_el-test-card (dom-create-element "test-card"))) + (let ((_el-template (dom-create-element "template")) (_el-div (dom-create-element "div")) (_el-slot (dom-create-element "slot")) (_el-test-card (dom-create-element "test-card")) (_el-p (dom-create-element "p"))) (dom-set-attr _el-template "component" "test-card") + (dom-add-class _el-div "card") + (dom-set-inner-html _el-p "Hello from slot") (dom-append (dom-body) _el-template) + (dom-append _el-template _el-div) + (dom-append _el-div _el-slot) (dom-append (dom-body) _el-test-card) + (dom-append _el-test-card _el-p) )) (deftest "blocks processing of inner hyperscript until render" (hs-cleanup!) - (let ((_el-template (dom-create-element "template")) (_el-test-block (dom-create-element "test-block"))) + (let ((_el-template (dom-create-element "template")) (_el-span (dom-create-element "span")) (_el-test-block (dom-create-element "test-block"))) (dom-set-attr _el-template "_" "init set ^msg to 'ready'") (dom-set-attr _el-template "component" "test-block") + (dom-set-attr _el-span "_" "on click put ^msg into me") + (dom-set-inner-html _el-span "click me") (dom-append (dom-body) _el-template) - (hs-activate! _el-template) + (dom-append _el-template _el-span) (dom-append (dom-body) _el-test-block) + (hs-activate! _el-template) + (hs-activate! _el-span) (dom-dispatch (dom-query "test-block span") "click" nil) )) (deftest "supports named slots" (hs-cleanup!) - (let ((_el-template (dom-create-element "template")) (_el-test-named-slot (dom-create-element "test-named-slot"))) + (let ((_el-template (dom-create-element "template")) (_el-header (dom-create-element "header")) (_el-slot (dom-create-element "slot")) (_el-main (dom-create-element "main")) (_el-slot4 (dom-create-element "slot")) (_el-footer (dom-create-element "footer")) (_el-slot6 (dom-create-element "slot")) (_el-test-named-slot (dom-create-element "test-named-slot")) (_el-h1 (dom-create-element "h1")) (_el-p (dom-create-element "p")) (_el-span (dom-create-element "span"))) (dom-set-attr _el-template "component" "test-named-slot") + (dom-set-attr _el-slot "name" "title") + (dom-set-attr _el-slot6 "name" "footer") + (dom-set-attr _el-h1 "slot" "title") + (dom-set-inner-html _el-h1 "My Title") + (dom-set-inner-html _el-p "Default content") + (dom-set-attr _el-span "slot" "footer") + (dom-set-inner-html _el-span "Footer text") (dom-append (dom-body) _el-template) + (dom-append _el-template _el-header) + (dom-append _el-header _el-slot) + (dom-append _el-template _el-main) + (dom-append _el-main _el-slot4) + (dom-append _el-template _el-footer) + (dom-append _el-footer _el-slot6) (dom-append (dom-body) _el-test-named-slot) + (dom-append _el-test-named-slot _el-h1) + (dom-append _el-test-named-slot _el-p) + (dom-append _el-test-named-slot _el-span) )) (deftest "does not process slotted _ attributes prematurely" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-template (dom-create-element "template")) (_el-div2 (dom-create-element "div")) (_el-slot (dom-create-element "slot")) (_el-test-slot-hs (dom-create-element "test-slot-hs")) (_el-span (dom-create-element "span"))) (dom-set-attr _el-div "_" "init set ^x to 42") + (dom-set-attr _el-template "component" "test-slot-hs") + (dom-add-class _el-div2 "wrap") + (dom-set-attr _el-span "_" "on click put ^x into me") + (dom-set-inner-html _el-span "before") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-template) + (dom-append _el-template _el-div2) + (dom-append _el-div2 _el-slot) + (dom-append _el-div _el-test-slot-hs) + (dom-append _el-test-slot-hs _el-span) (hs-activate! _el-div) + (hs-activate! _el-span) (dom-dispatch (dom-query "test-slot-hs span") "click" nil) )) (deftest "slotted content resolves ^var from outer scope, not component scope" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-template (dom-create-element "template")) (_el-div2 (dom-create-element "div")) (_el-slot (dom-create-element "slot")) (_el-test-scope-slot (dom-create-element "test-scope-slot")) (_el-span (dom-create-element "span"))) (dom-set-attr _el-div "_" "init set ^outer to 'from-outside'") + (dom-set-attr _el-template "_" "init set ^outer to 'from-component'") + (dom-set-attr _el-template "component" "test-scope-slot") + (dom-add-class _el-div2 "inner") + (dom-set-attr _el-span "_" "init put ^outer into me") + (dom-set-inner-html _el-span "waiting") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-template) + (dom-append _el-template _el-div2) + (dom-append _el-div2 _el-slot) + (dom-append _el-div _el-test-scope-slot) + (dom-append _el-test-scope-slot _el-span) (hs-activate! _el-div) + (hs-activate! _el-template) + (hs-activate! _el-span) )) (deftest "component isolation prevents ^var leaking inward" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-template (dom-create-element "template")) (_el-span (dom-create-element "span")) (_el-test-isolated (dom-create-element "test-isolated"))) (dom-set-attr _el-div "_" "init set ^leaked to 'should-not-see'") + (dom-set-attr _el-template "_" "init set ^internal to 'component-only'") + (dom-set-attr _el-template "component" "test-isolated") + (dom-set-attr _el-span "_" "init if ^leaked is not undefined put 'leaked!' into me else put ^internal into me") + (dom-set-inner-html _el-span "waiting") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-template) + (dom-append _el-template _el-span) + (dom-append _el-div _el-test-isolated) (hs-activate! _el-div) + (hs-activate! _el-template) + (hs-activate! _el-span) )) (deftest "bind keeps ^var in sync with attribute changes" (hs-cleanup!) - (let ((_el-template (dom-create-element "template")) (_el-test-bind-attr (dom-create-element "test-bind-attr"))) + (let ((_el-template (dom-create-element "template")) (_el-span (dom-create-element "span")) (_el-test-bind-attr (dom-create-element "test-bind-attr"))) (dom-set-attr _el-template "_" "bind ^count to @data-count") (dom-set-attr _el-template "component" "test-bind-attr") - (dom-append (dom-body) _el-template) - (hs-activate! _el-template) + (dom-set-inner-html _el-span "${\"\\x24\"}{^count}") (dom-set-attr _el-test-bind-attr "data-count" "5") + (dom-append (dom-body) _el-template) + (dom-append _el-template _el-span) (dom-append (dom-body) _el-test-bind-attr) + (hs-activate! _el-template) )) (deftest "attrs evaluates attribute as hyperscript in parent scope" (hs-cleanup!) - (let ((_el-template (dom-create-element "template")) (_el-test-args (dom-create-element "test-args"))) + (let ((_el-template (dom-create-element "template")) (_el-ul (dom-create-element "ul")) (_el-li (dom-create-element "li")) (_el-test-args (dom-create-element "test-args"))) (dom-set-attr _el-template "_" "init set ^list to attrs.items") (dom-set-attr _el-template "component" "test-args") - (dom-append (dom-body) _el-template) - (hs-activate! _el-template) + (dom-set-inner-html _el-ul "#for item in ^list") + (dom-set-inner-html _el-li "${\"\\x24\"}{item}") (dom-set-attr _el-test-args "items" "$stuff") + (dom-append (dom-body) _el-template) + (dom-append _el-template _el-ul) + (dom-append _el-ul _el-li) (dom-append (dom-body) _el-test-args) + (hs-activate! _el-template) )) (deftest "attrs works with bind for reactive pass-through" (hs-cleanup!) - (let ((_el-template (dom-create-element "template")) (_el-test-args-bind (dom-create-element "test-args-bind")) (_el-button (dom-create-element "button"))) + (let ((_el-template (dom-create-element "template")) (_el-span (dom-create-element "span")) (_el-test-args-bind (dom-create-element "test-args-bind")) (_el-button (dom-create-element "button"))) (dom-set-attr _el-template "_" "bind ^val to attrs.count") (dom-set-attr _el-template "component" "test-args-bind") - (dom-append (dom-body) _el-template) - (hs-activate! _el-template) + (dom-set-inner-html _el-span "${\"\\x24\"}{^val}") (dom-set-attr _el-test-args-bind "count" "$count") - (dom-append (dom-body) _el-test-args-bind) (dom-set-attr _el-button "_" "on click increment $count") (dom-set-inner-html _el-button "+") + (dom-append (dom-body) _el-template) + (dom-append _el-template _el-span) + (dom-append (dom-body) _el-test-args-bind) (dom-append (dom-body) _el-button) + (hs-activate! _el-template) (hs-activate! _el-button) (dom-dispatch _el-button "click" nil) )) (deftest "attrs bind is bidirectional — inner changes flow outward" (hs-cleanup!) - (let ((_el-template (dom-create-element "template")) (_el-test-args-bidir (dom-create-element "test-args-bidir")) (_el-p (dom-create-element "p"))) + (let ((_el-template (dom-create-element "template")) (_el-span (dom-create-element "span")) (_el-button (dom-create-element "button")) (_el-test-args-bidir (dom-create-element "test-args-bidir")) (_el-p (dom-create-element "p"))) (dom-set-attr _el-template "_" "bind ^count to attrs.count") (dom-set-attr _el-template "component" "test-args-bidir") - (dom-append (dom-body) _el-template) - (hs-activate! _el-template) + (dom-set-inner-html _el-span "${\"\\x24\"}{^count}") + (dom-set-attr _el-button "_" "on click increment ^count") + (dom-set-inner-html _el-button "+") (dom-set-attr _el-test-args-bidir "count" "$count") - (dom-append (dom-body) _el-test-args-bidir) (dom-set-attr _el-p "_" "live put $count into me") + (dom-append (dom-body) _el-template) + (dom-append _el-template _el-span) + (dom-append _el-template _el-button) + (dom-append (dom-body) _el-test-args-bidir) (dom-append (dom-body) _el-p) + (hs-activate! _el-template) + (hs-activate! _el-button) (hs-activate! _el-p) (dom-dispatch (dom-query "test-args-bidir button") "click" nil) )) @@ -7286,8 +8053,8 @@ (let ((_el-other (dom-create-element "div")) (_el-div (dom-create-element "div"))) (dom-set-attr _el-other "id" "other") (dom-set-attr _el-other "style" "all: initial; position: fixed; top: 89px") - (dom-append (dom-body) _el-other) (dom-set-attr _el-div "_" "on click measure #other's top then set window.measurement to {top: top}") + (dom-append (dom-body) _el-other) (dom-append (dom-body) _el-div) (hs-activate! _el-div) (dom-dispatch (dom-query "div:nth-of-type(2)") "click" nil) @@ -7297,8 +8064,8 @@ (let ((_el-other (dom-create-element "div")) (_el-div (dom-create-element "div"))) (dom-set-attr _el-other "id" "other") (dom-set-attr _el-other "style" "all: initial; position: fixed; top: 89px") - (dom-append (dom-body) _el-other) (dom-set-attr _el-div "_" "on click measure top of #other then set window.measurement to {top: top}") + (dom-append (dom-body) _el-other) (dom-append (dom-body) _el-div) (hs-activate! _el-div) (dom-dispatch (dom-query "div:nth-of-type(2)") "click" nil) @@ -7329,11 +8096,11 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-div1 (dom-create-element "div")) (_el-trigger (dom-create-element "div"))) (dom-add-class _el-div "item") - (dom-append (dom-body) _el-div) (dom-add-class _el-div1 "item") - (dom-append (dom-body) _el-div1) (dom-set-attr _el-trigger "id" "trigger") (dom-set-attr _el-trigger "_" "on click settle <.item/> then add .done to <.item/>") + (dom-append (dom-body) _el-div) + (dom-append (dom-body) _el-div1) (dom-append (dom-body) _el-trigger) (hs-activate! _el-trigger) (dom-dispatch (dom-query-by-id "trigger") "click" nil) @@ -7346,14 +8113,14 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-s1 (dom-create-element "span")) (_el-s2 (dom-create-element "span"))) ;; HS source has bare quotes or embedded HTML - (dom-append (dom-body) _el-div) (dom-set-attr _el-s1 "id" "s1") (dom-set-attr _el-s1 "style" "display:none") (dom-set-inner-html _el-s1 "A") - (dom-append (dom-body) _el-s1) (dom-set-attr _el-s2 "id" "s2") (dom-set-attr _el-s2 "style" "display:none") (dom-set-inner-html _el-s2 "B") + (dom-append (dom-body) _el-div) + (dom-append (dom-body) _el-s1) (dom-append (dom-body) _el-s2) (dom-dispatch _el-div "click" nil) (assert (dom-visible? (dom-query-by-id "s1"))) @@ -7363,15 +8130,15 @@ (hs-cleanup!) (let ((_el-div (dom-create-element "div")) (_el-p (dom-create-element "p")) (_el-p2 (dom-create-element "p")) (_el-out (dom-create-element "span"))) ;; HS source has bare quotes or embedded HTML - (dom-append (dom-body) _el-div) (dom-set-attr _el-p "style" "display:none") (dom-set-inner-html _el-p "yes") - (dom-append (dom-body) _el-p) (dom-set-attr _el-p2 "style" "display:none") (dom-set-inner-html _el-p2 "no") - (dom-append (dom-body) _el-p2) (dom-set-attr _el-out "id" "out") (dom-set-inner-html _el-out "--") + (dom-append (dom-body) _el-div) + (dom-append (dom-body) _el-p) + (dom-append (dom-body) _el-p2) (dom-append (dom-body) _el-out) (dom-dispatch _el-div "click" nil) (assert= (dom-text-content (dom-query-by-id "out")) "some") @@ -7396,8 +8163,8 @@ (hs-cleanup!) (let ((_el-bar (dom-create-element "div")) (_el-div (dom-create-element "div"))) (dom-set-attr _el-bar "id" "bar") - (dom-append (dom-body) _el-bar) (dom-set-attr _el-div "_" "on click add .foo to #bar then add .blah") + (dom-append (dom-body) _el-bar) (dom-append (dom-body) _el-div) (hs-activate! _el-div) (dom-dispatch (dom-query "div:nth-of-type(2)") "click" nil) @@ -7445,9 +8212,9 @@ (hs-cleanup!) (let ((_el-source (dom-create-element "div")) (_el-target (dom-create-element "div"))) (dom-set-attr _el-source "id" "source") - (dom-append (dom-body) _el-source) (dom-set-attr _el-target "id" "target") (dom-set-attr _el-target "_" "on click from #source add .foo") + (dom-append (dom-body) _el-source) (dom-append (dom-body) _el-target) (hs-activate! _el-target) (dom-dispatch (dom-query-by-id "source") "click" nil) @@ -7527,8 +8294,16 @@ (error "NOT IMPLEMENTED: test HTML could not be parsed into SX")) (deftest "element-level isolation still works with error recovery" (hs-cleanup!) - (let ((_el-div (dom-create-element "div"))) + (let ((_el-div (dom-create-element "div")) (_el-d1 (dom-create-element "div")) (_el-d2 (dom-create-element "div"))) + (dom-set-attr _el-d1 "id" "d1") + (dom-set-attr _el-d1 "_" "on click blargh end on mouseenter also_bad") + (dom-set-attr _el-d2 "id" "d2") + (dom-set-attr _el-d2 "_" "on click put \"clicked\" into my.innerHTML") (dom-append (dom-body) _el-div) + (dom-append _el-div _el-d1) + (dom-append _el-div _el-d2) + (hs-activate! _el-d1) + (hs-activate! _el-d2) (dom-dispatch (dom-query-by-id "d2") "click" nil) (assert= (dom-text-content (dom-query-by-id "d2")) "clicked") )) @@ -7617,24 +8392,47 @@ (defsuite "hs-upstream-closest" (deftest "attributes can be set via the closest expression 2" (hs-cleanup!) - (let ((_el-outerDiv2 (dom-create-element "div"))) + (let ((_el-outerDiv2 (dom-create-element "div")) (_el-d1b (dom-create-element "div"))) (dom-set-attr _el-outerDiv2 "id" "outerDiv2") (dom-set-attr _el-outerDiv2 "foo" "bar") + (dom-set-attr _el-d1b "id" "d1b") + (dom-set-attr _el-d1b "_" "on click set closest @foo to \"doh\"") (dom-append (dom-body) _el-outerDiv2) + (dom-append _el-outerDiv2 _el-d1b) + (hs-activate! _el-d1b) (dom-dispatch (dom-query-by-id "d1b") "click" nil) )) (deftest "closest does not consume a following where clause" (hs-cleanup!) - (let ((_el-table (dom-create-element "table"))) + (let ((_el-table (dom-create-element "table")) (_el-tr (dom-create-element "tr")) (_el-td (dom-create-element "td")) (_el-input (dom-create-element "input")) (_el-input4 (dom-create-element "input")) (_el-master (dom-create-element "input")) (_el-table6 (dom-create-element "table")) (_el-out (dom-create-element "div"))) + (dom-add-class _el-input "cb") + (dom-set-attr _el-input "type" "checkbox") + (dom-add-class _el-input4 "cb") + (dom-set-attr _el-input4 "type" "checkbox") + (dom-set-attr _el-master "id" "master") + ;; HS source has bare quotes or embedded HTML + (dom-set-attr _el-master "type" "checkbox") + (dom-set-attr _el-master "