Spy on setAttribute to test customElement support
This commit is contained in:
parent
48e3610609
commit
15c28066d7
2 changed files with 66 additions and 2 deletions
|
|
@ -435,14 +435,14 @@ module.exports = function($window) {
|
|||
}
|
||||
function setAttr(vnode, key, old, value, ns) {
|
||||
var element = vnode.dom
|
||||
if (key === "key" || (old === value && !isFormAttribute(vnode, key)) && typeof value !== "object" || typeof value === "undefined" || isLifecycleMethod(key)) return
|
||||
if (key === "key" || key === "is" || (old === value && !isFormAttribute(vnode, key)) && typeof value !== "object" || typeof value === "undefined" || isLifecycleMethod(key)) return
|
||||
var nsLastIndex = key.indexOf(":")
|
||||
if (nsLastIndex > -1 && key.substr(0, nsLastIndex) === "xlink") {
|
||||
element.setAttributeNS("http://www.w3.org/1999/xlink", key.slice(nsLastIndex + 1), value)
|
||||
}
|
||||
else if (key[0] === "o" && key[1] === "n" && typeof value === "function") updateEvent(vnode, key, value)
|
||||
else if (key === "style") updateStyle(element, old, value)
|
||||
else if (key in element && !isAttribute(key) && ns === undefined) {
|
||||
else if (key in element && !isAttribute(key) && ns === undefined && !isCustomElement(vnode)) {
|
||||
//setting input[value] to same value by typing on focused element moves cursor to end in Chrome
|
||||
if (vnode.tag === "input" && key === "value" && vnode.dom.value === value && vnode.dom === $doc.activeElement) return
|
||||
//setting select[value] to same value while having select open blinks select dropdown in Chrome
|
||||
|
|
@ -491,6 +491,9 @@ module.exports = function($window) {
|
|||
function isAttribute(attr) {
|
||||
return attr === "href" || attr === "list" || attr === "form" || attr === "width" || attr === "height"// || attr === "type"
|
||||
}
|
||||
function isCustomElement(vnode){
|
||||
return vnode.attrs.is || vnode.tag.indexOf("-") > -1
|
||||
}
|
||||
function hasIntegrationMethods(source) {
|
||||
return source != null && (source.oncreate || source.onupdate || source.onbeforeremove || source.onremove)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -11,7 +11,68 @@ o.spec("attributes", function() {
|
|||
root = $window.document.body
|
||||
render = vdom($window).render
|
||||
})
|
||||
o.spec("customElements", function(){
|
||||
|
||||
o("when vnode is customElement, custom setAttribute called", function(){
|
||||
|
||||
var normalFirstDraw = [
|
||||
{ tag: "input", attrs: { wow: 'text' } },
|
||||
{ tag: "input", attrs: { wow: 'text' } },
|
||||
{ tag: "input", attrs: { wow: 'text' } },
|
||||
]
|
||||
|
||||
var normalSecondDraw = [
|
||||
{ tag: "input", attrs: { wow: 'text' } },
|
||||
{ tag: "input", attrs: { wow: 'text' } },
|
||||
{ tag: "input", attrs: { wow: 'text' } },
|
||||
]
|
||||
|
||||
var customFirstDraw = [
|
||||
{ tag: "custom-element", attrs: { custom: 'x' } },
|
||||
{ tag: "input", attrs: { is: 'something-special', custom: 'x' } },
|
||||
{ tag: "custom-element", attrs: { is: 'something-special', custom: 'x' } }
|
||||
]
|
||||
|
||||
var customSecondDraw = [
|
||||
{ tag: "custom-element", attrs: { custom: 'y' } },
|
||||
{ tag: "input", attrs: { is: 'something-special', custom: 'y' } },
|
||||
{ tag: "custom-element", attrs: { is: 'something-special', custom: 'y' } }
|
||||
]
|
||||
|
||||
var draws = [
|
||||
normalFirstDraw, normalSecondDraw,
|
||||
customFirstDraw, customSecondDraw
|
||||
]
|
||||
|
||||
var customRedraws = 2
|
||||
var customSetAttrCalls = customFirstDraw.length * customRedraws;
|
||||
var innerHTMLCalls = normalFirstDraw.length
|
||||
|
||||
var f = $window.document.createElement
|
||||
var spy
|
||||
|
||||
$window.document.createElement = function(tag, is){
|
||||
var el = f(tag, is)
|
||||
if(!spy){
|
||||
spy = o.spy(el.setAttribute)
|
||||
}
|
||||
el.setAttribute = spy
|
||||
|
||||
return el
|
||||
}
|
||||
|
||||
draws.forEach(
|
||||
function(view) {
|
||||
render(root, view)
|
||||
}
|
||||
)
|
||||
|
||||
o(spy.callCount).equals(
|
||||
customSetAttrCalls + innerHTMLCalls
|
||||
)
|
||||
})
|
||||
|
||||
})
|
||||
o.spec("input readonly", function() {
|
||||
o("when input readonly is true, attribute is present", function() {
|
||||
var a = {tag: "input", attrs: {readonly: true}}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue