describe "ReactScript", ->
it "should create elements from CSS selectors", ->
generate '
Hello World!
Hello World!
', from:
E "html",
E "head", E "title", "Hello World!"
E "body", E "h1.shiny", "Hello World!"
it "should default to creating
elements", ->
generate '
', from:
E ".test", E "", E()
it "should allow arrays of arbitrary depth", ->
generate '
', from:
E ".test",
E ".a", key: "a"
[E ".b", key: "b"]
E ".c", key: "c"
[[E ".d", key: "d"]]
E ".e", key: "e"
it "should fail loudly when it can't parse a selector", ->
error_please /Unhandled/, ->
E "um)#(E%"
it "should handle boolean attributes", ->
data_falsey = no
data_truthy = yes
generate '',
from: E "div", {data_falsey, data_truthy}
it "should handle aria boolean attributes", ->
aria_falsey = no
aria_truthy = yes
generate '',
from: E "div", {aria_falsey, aria_truthy}
it "should handle null as well as undefined", ->
data_falsey = null
data_truthy = "true-dat"
generate '',
from: E "div", {data_falsey, data_truthy}
generate '
true-dat
',
from: E "div", data_falsey, data_truthy
it "should transform variations to data-*", ->
generate '',
from: E "div", "data-xyzzy": "Nothing happens.", data_foo: "bar", dataBaz: "quux", data: norf: 777
it "should transform variations to aria-*", ->
generate '',
from: E "div", "aria-xyzzy": "Nothing happens.", aria_foo: "bar", ariaBaz: "quux", aria: norf: 777
it "should let you function", ->
e = E "input", onChange: -> "ok"
e.props.onChange()
it.skip "could support selector attributes", ->
generate '',
from: E "input[type=number][min=5][max=10][autofocus]"
it.skip "could support using the child > selector", ->
generate '
',
from: E "li > a", href: "http"
generate '
Tables are annoying
',
from: E "table > tbody > tr > td > div", "Tables are annoying"
it.skip "would tell you to use > if you try to use the descendent selector", ->
error_please /descendent/, ->
E ".inexplicit .arbitrary .undefined"
it "should not give react warnings in normal usage", ->
E ".foobar",
E "ol.static",
E "li", "Item A: an item"
E "li", "Item B: another item"
E "li", "Item C: also an item"
E "ul.dynamic",
for n in [1...3]
E "li", key: n, "Item #{n}"
it "should give react warnings if you're missing a key", ->
error_please /Warning: Each child in an array or iterator should have a unique "key" prop/, ->
E "ul",
for n in [1...3]
E "li", "Item #{n}"