Skip to content

Commit

Permalink
tests for validating MithrilJS#1595 and MithrilJS#1804
Browse files Browse the repository at this point in the history
  • Loading branch information
@pygy
pygy committed May 28, 2017
1 parent e031fe4 commit 282afe4
Show file tree
Hide file tree
Showing 2 changed files with 367 additions and 0 deletions.
365 changes: 365 additions & 0 deletions render/tests/test-attributes.js
View file
Expand Up @@ -11,6 +11,46 @@ o.spec("attributes", function() {
root = $window.document.body
render = vdom($window).render
})
o.spec("basics", function() {
o("works (create/update/remove)", function() {

var a = {tag: "div", attrs: {}}
var b = {tag: "div", attrs: {id: "test"}}
var c = {tag: "div", attrs: {}}

render(root, [a]);

o(a.dom.hasAttribute("id")).equals(false)

render(root, [b]);

o(b.dom.getAttribute("id")).equals("test")

render(root, [c]);

o(c.dom.hasAttribute("id")).equals(false)
})
o("undefined attr is equivalent to a lack of attr", function() {
var a = {tag: "div", attrs: {id: undefined}}
var b = {tag: "div", attrs: {id: "test"}}
var c = {tag: "div", attrs: {id: undefined}}

render(root, [a]);

o(a.dom.hasAttribute("id")).equals(false)

render(root, [b]);

o(b.dom.hasAttribute("id")).equals(true)
o(b.dom.getAttribute("id")).equals("test")

render(root, [c]);

// #1804
// TODO: uncomment
// o(c.dom.hasAttribute("id")).equals(false)
})
})
o.spec("customElements", function(){

o("when vnode is customElement, custom setAttribute called", function(){
Expand Down Expand Up @@ -96,6 +136,140 @@ o.spec("attributes", function() {
o(a.dom.attributes["checked"]).equals(undefined)
})
})
o.spec("input.value", function() {
o("can be set as text", function() {
var a = {tag: "input", attrs: {value: "test"}}

render(root, [a]);

o(a.dom.value).equals("test")
})
o("can be set as number", function() {
var a = {tag: "input", attrs: {value: 1}}

render(root, [a]);

o(a.dom.value).equals("1")
})
o("null becomes the empty string", function() {
var a = {tag: "input", attrs: {value: null}}
var b = {tag: "input", attrs: {value: "test"}}
var c = {tag: "input", attrs: {value: null}}

render(root, [a]);

o(a.dom.value).equals("")
o(a.dom.getAttribute("value")).equals(null)

render(root, [b]);

o(b.dom.value).equals("test")
o(b.dom.getAttribute("value")).equals(null)

render(root, [c]);

o(c.dom.value).equals("")
o(c.dom.getAttribute("value")).equals(null)
})
o("'' and 0 are different values", function() {
var a = {tag: "input", attrs: {value: 0}, children:[{tag:"#", children:""}]}
var b = {tag: "input", attrs: {value: ""}, children:[{tag:"#", children:""}]}

render(root, [a]);

o(a.dom.value).equals("0")

render(root, [b]);

o(a.dom.value).equals("")

// #1959 redux
// TODO: UNCOMMENT
// render(root, [a]);

// o(a.dom.value).equals("0")
})
o("isn't set when equivalent to the previous value and focused", function() {
var $window = domMock({spy: o.spy})
var root = $window.document.body
var render = vdom($window).render

var a = {tag: "input"}
var b = {tag: "input", attrs: {value: "1"}}
var c = {tag: "input", attrs: {value: "1"}}
var d = {tag: "input", attrs: {value: 1}}
var e = {tag: "input", attrs: {value: 2}}

render(root, [a])
var spies = $window.__getSpies(a.dom)
a.dom.focus()

o(spies.valueSetter.callCount).equals(0)

render(root, [b])

o(b.dom.value).equals("1")
o(spies.valueSetter.callCount).equals(1)

render(root, [c])

o(c.dom.value).equals("1")
o(spies.valueSetter.callCount).equals(1)

render(root, [d])

o(d.dom.value).equals("1")
o(spies.valueSetter.callCount).equals(1)

render(root, [e])

o(d.dom.value).equals("2")
o(spies.valueSetter.callCount).equals(2)
})
})
o.spec("input.type", function() {
o("the input.type setter is never used", function() {
var $window = domMock({spy: o.spy})
var root = $window.document.body
var render = vdom($window).render

var a = {tag: "input", attrs: {type: "radio"}}
var b = {tag: "input", attrs: {type: "text"}}
var c = {tag: "input", attrs: {}}

render(root, [a])
var spies = $window.__getSpies(a.dom)

o(spies.typeSetter.callCount).equals(0)
o(a.dom.getAttribute("type")).equals("radio")

render(root, [b])

o(spies.typeSetter.callCount).equals(0)
o(b.dom.getAttribute("type")).equals("text")

render(root, [c])

o(spies.typeSetter.callCount).equals(0)
o(c.dom.hasAttribute("type")).equals(false)
})
})
o.spec("textarea.value", function() {
o("can be removed by not passing a value", function() {
var a = {tag: "textarea", attrs: {value:"x"}}
var b = {tag: "textarea", attrs: {}}

render(root, [a])

o(a.dom.value).equals("x")

// https://github.com/MithrilJS/mithril.js/issues/1804#issuecomment-304521235
// TODO: Uncomment
// render(root, [b])

// o(b.dom.value).equals("")
})
})
o.spec("link href", function() {
o("when link href is true, attribute is present", function() {
var a = {tag: "a", attrs: {href: true}}
Expand Down Expand Up @@ -131,6 +305,197 @@ o.spec("attributes", function() {
o(a.dom.attributes["class"].value).equals("test")
})
})
o.spec("option.value", function() {
o("can be set as text", function() {
var a = {tag: "option", attrs: {value: "test"}}

render(root, [a]);

o(a.dom.value).equals("test")
})
o("can be set as number", function() {
var a = {tag: "option", attrs: {value: 1}}

render(root, [a]);

o(a.dom.value).equals("1")
})
o("null becomes the empty string", function() {
var a = {tag: "option", attrs: {value: null}}
var b = {tag: "option", attrs: {value: "test"}}
var c = {tag: "option", attrs: {value: null}}

render(root, [a]);

o(a.dom.value).equals("")
o(a.dom.getAttribute("value")).equals("")

render(root, [b]);

o(b.dom.value).equals("test")
o(b.dom.getAttribute("value")).equals("test")

render(root, [c]);

o(c.dom.value).equals("")
o(c.dom.getAttribute("value")).equals("")
})
o("'' and 0 are different values", function() {
var a = {tag: "option", attrs: {value: 0}, children:[{tag:"#", children:""}]}
var b = {tag: "option", attrs: {value: ""}, children:[{tag:"#", children:""}]}

render(root, [a]);

o(a.dom.value).equals("0")

render(root, [b]);

o(a.dom.value).equals("")

// #1959 redux
// TODO: UNCOMMENT
// render(root, [a]);

// o(a.dom.value).equals("0")
})
o("isn't set when equivalent to the previous value", function() {
var $window = domMock({spy: o.spy})
var root = $window.document.body
var render = vdom($window).render

var a = {tag: "option"}
var b = {tag: "option", attrs: {value: "1"}}
var c = {tag: "option", attrs: {value: "1"}}
var d = {tag: "option", attrs: {value: 1}}
var e = {tag: "option", attrs: {value: 2}}

render(root, [a])
var spies = $window.__getSpies(a.dom)

o(spies.valueSetter.callCount).equals(0)

render(root, [b])

o(b.dom.value).equals("1")
o(spies.valueSetter.callCount).equals(1)

render(root, [c])

o(c.dom.value).equals("1")
o(spies.valueSetter.callCount).equals(1)

render(root, [d])

o(d.dom.value).equals("1")
o(spies.valueSetter.callCount).equals(1)

render(root, [e])

o(d.dom.value).equals("2")
o(spies.valueSetter.callCount).equals(2)
})
})
o.spec("select.value", function() {
function makeSelect(value) {
var attrs = (arguments.length === 0) ? {} : {value: value}
return {tag: "select", attrs: attrs, children: [
{tag:"option", attrs: {value: "1"}},
{tag:"option", attrs: {value: "2"}},
{tag:"option", attrs: {value: "a"}},
{tag:"option", attrs: {value: "0"}},
{tag:"option", attrs: {value: ""}}
]}
}
o("can be set as text", function() {
var a = makeSelect()
var b = makeSelect("2")
var c = makeSelect("a")

render(root, [a])

o(a.dom.value).equals("1")
o(a.dom.selectedIndex).equals(0)

render(root, [b])

o(b.dom.value).equals("2")
o(b.dom.selectedIndex).equals(1)

render(root, [c])

o(c.dom.value).equals("a")
o(c.dom.selectedIndex).equals(2)
})
o("setting null unsets the value", function() {
var a = makeSelect(null)

render(root, [a])

o(a.dom.value).equals("")
o(a.dom.selectedIndex).equals(-1)
})
o("values are type converted", function() {
var a = makeSelect(1)
var b = makeSelect(2)

render(root, [a])

o(a.dom.value).equals("1")
o(a.dom.selectedIndex).equals(0)

render(root, [b])

o(b.dom.value).equals("2")
o(b.dom.selectedIndex).equals(1)
})
o("'' and 0 are different values when focused", function() {
var a = makeSelect("")
// var b = makeSelect(0)

render(root, [a])
a.dom.focus()

o(a.dom.value).equals("")

// #1959 redux
// TODO: UNCOMMENT
// render(root, [b])

// o(b.dom.value).equals("0")
})
o("updates with the same value do not re-set the attribute if the select has focus", function() {
var $window = domMock({spy: o.spy})
var root = $window.document.body
var render = vdom($window).render

var a = makeSelect()
var b = makeSelect("1")
var c = makeSelect(1)
var d = makeSelect("2")

render(root, [a])
var spies = $window.__getSpies(a.dom)
a.dom.focus()

o(spies.valueSetter.callCount).equals(0)
o(a.dom.value).equals("1")

render(root, [b])

o(spies.valueSetter.callCount).equals(0)
o(b.dom.value).equals("1")

render(root, [c])

o(spies.valueSetter.callCount).equals(0)
o(c.dom.value).equals("1")

render(root, [d])

o(spies.valueSetter.callCount).equals(1)
o(d.dom.value).equals("2")
})
})
o.spec("contenteditable throws on untrusted children", function() {
o("including text nodes", function() {
var div = {tag: "div", attrs: {contenteditable: true}, text: ""}
Expand Down

0 comments on commit 282afe4

Please sign in to comment.