Skip to content

Commit

Permalink
set attribute instead of setting js property
Browse files Browse the repository at this point in the history
  • Loading branch information
@valdrinkoshi
valdrinkoshi committed Aug 10, 2016
1 parent cf89f3f commit 9e267e4
Show file tree
Hide file tree
Showing 3 changed files with 38 additions and 35 deletions.
9 changes: 6 additions & 3 deletions blocking-elements.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -304,7 +304,7 @@
* @private
*/
static[IS_INERT_FN](element) {
return !!element.inert;
return element.hasAttribute('inert');
}

/**
Expand All @@ -314,8 +314,11 @@
* @private
*/
static[SET_INERT_FN](element, inert) {
// Update JS property.
element.inert = inert;
if (inert) {
element.setAttribute('inert','');
} else {
element.removeAttribute('inert');
}
}
}

Expand Down
24 changes: 12 additions & 12 deletions test/basic.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -113,16 +113,16 @@
document.$blockingElements.push(container.children[0]);
assert.equal(document.$blockingElements.all.length, 1);
assert.equal(document.$blockingElements.top, container.children[0]);
assert.notEqual(container.children[0].inert, true, '1st child active');
assert.equal(container.children[1].inert, true, '2nd child inert');
assert.equal(container.children[2].inert, true, '3rd child inert');
assert.isFalse(container.children[0].hasAttribute('inert'), '1st child active');
assert.isTrue(container.children[1].hasAttribute('inert'), '2nd child inert');
assert.isTrue(container.children[2].hasAttribute('inert'), '3rd child inert');

document.$blockingElements.push(container.children[1]);
assert.equal(document.$blockingElements.all.length, 2);
assert.equal(document.$blockingElements.top, container.children[1]);
assert.equal(container.children[0].inert, true, '1st child inert');
assert.notEqual(container.children[1].inert, true, '2nd child active');
assert.equal(container.children[2].inert, true, '3rd child inert');
assert.isTrue(container.children[0].hasAttribute('inert'), '1st child inert');
assert.isFalse(container.children[1].hasAttribute('inert'), '2nd child active');
assert.isTrue(container.children[2].hasAttribute('inert'), '3rd child inert');
});

});
Expand All @@ -146,16 +146,16 @@
assert.equal(document.$blockingElements.top, inner.children[0]);

// node and its parents should be active
assert.notEqual(inner.children[0].inert, true, 'inner child active');
assert.notEqual(inner.inert, true, 'inner active');
assert.isFalse(inner.children[0].hasAttribute('inert'), 'inner child active');
assert.isFalse(inner.hasAttribute('inert'), 'inner active');

// Its siblings and parent's siblings should be inert.
for (var i = 1; i < inner.children.length; i++) {
assert.equal(inner.children[i].inert, true, 'inner sibling inert');
assert.isTrue(inner.children[i].hasAttribute('inert'), 'inner sibling inert');
}
assert.equal(container.children[0].inert, true, '1st child inert');
assert.equal(container.children[1].inert, true, '2nd child inert');
assert.equal(container.children[2].inert, true, '3rd child inert');
assert.isTrue(container.children[0].hasAttribute('inert'), '1st child inert');
assert.isTrue(container.children[1].hasAttribute('inert'), '2nd child inert');
assert.isTrue(container.children[2].hasAttribute('inert'), '3rd child inert');
});
});
</script>
Expand Down
40 changes: 20 additions & 20 deletions test/shadow.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -55,7 +55,7 @@
}
}

suite('ShdowDom v0', function() {
suite('ShadowDom v0', function() {
if (!Element.prototype.createShadowRoot) {
console.log('ShadowDOM v0 is not supported by the browser.');
return;
Expand Down Expand Up @@ -83,25 +83,25 @@
document.$blockingElements.push(container.children[0]);
assert.equal(document.$blockingElements.all.length, 1);
assert.equal(document.$blockingElements.top, container.children[0]);
assert.equal(shadowBtn.inert, true, 'button in shadow dom inert');
assert.notEqual(container.children[0].inert, true, '1st child active');
assert.equal(container.children[1].inert, true, '2nd child inert');
assert.equal(container.children[2].inert, true, '3rd child inert');
assert.isTrue(shadowBtn.hasAttribute('inert'), 'button in shadow dom inert');
assert.isFalse(container.children[0].hasAttribute('inert'), '1st child active');
assert.isTrue(container.children[1].hasAttribute('inert'), '2nd child inert');
assert.isTrue(container.children[2].hasAttribute('inert'), '3rd child inert');

// Button in shadow dom as a blocking element, its siblings should be inert
document.$blockingElements.push(shadowBtn);
assert.equal(document.$blockingElements.all.length, 2);
assert.equal(document.$blockingElements.top, shadowBtn);
assert.notEqual(shadowBtn.inert, true, 'button in shadow dom active');
assert.equal(shadowBtn.nextElementSibling.inert, true, 'button sibling (slot) inert');
assert.notEqual(container.children[0].inert, true, '1st child inert restored');
assert.notEqual(container.children[1].inert, true, '2nd child inert restored');
assert.notEqual(container.children[2].inert, true, '3rd child inert restored');
assert.isFalse(shadowBtn.hasAttribute('inert'), 'button in shadow dom active');
assert.isTrue(shadowBtn.nextElementSibling.hasAttribute('inert'), 'button sibling (slot) inert');
assert.isFalse(container.children[0].hasAttribute('inert'), '1st child inert restored');
assert.isFalse(container.children[1].hasAttribute('inert'), '2nd child inert restored');
assert.isFalse(container.children[2].hasAttribute('inert'), '3rd child inert restored');
});

});

suite('ShdowDom v1', function() {
suite('ShadowDom v1', function() {
if (!Element.prototype.attachShadow) {
console.log('ShadowDOM v1 is not supported by the browser.');
return;
Expand Down Expand Up @@ -131,20 +131,20 @@
document.$blockingElements.push(container.children[0]);
assert.equal(document.$blockingElements.all.length, 1);
assert.equal(document.$blockingElements.top, container.children[0]);
assert.equal(shadowBtn.inert, true, 'button in shadow dom inert');
assert.notEqual(container.children[0].inert, true, '1st child active');
assert.equal(container.children[1].inert, true, '2nd child inert');
assert.equal(container.children[2].inert, true, '3rd child inert');
assert.isTrue(shadowBtn.hasAttribute('inert'), 'button in shadow dom inert');
assert.isFalse(container.children[0].hasAttribute('inert'), '1st child active');
assert.isTrue(container.children[1].hasAttribute('inert'), '2nd child inert');
assert.isTrue(container.children[2].hasAttribute('inert'), '3rd child inert');

// Button in shadow dom as a blocking element, its siblings should be inert
document.$blockingElements.push(shadowBtn);
assert.equal(document.$blockingElements.all.length, 2);
assert.equal(document.$blockingElements.top, shadowBtn);
assert.notEqual(shadowBtn.inert, true, 'button in shadow dom active');
assert.equal(shadowBtn.nextElementSibling.inert, true, 'button sibling (slot) inert');
assert.notEqual(container.children[0].inert, true, '1st child inert restored');
assert.notEqual(container.children[1].inert, true, '2nd child inert restored');
assert.notEqual(container.children[2].inert, true, '3rd child inert restored');
assert.isFalse(shadowBtn.hasAttribute('inert'), 'button in shadow dom active');
assert.isTrue(shadowBtn.nextElementSibling.hasAttribute('inert'), 'button sibling (slot) inert');
assert.isFalse(container.children[0].hasAttribute('inert'), '1st child inert restored');
assert.isFalse(container.children[1].hasAttribute('inert'), '2nd child inert restored');
assert.isFalse(container.children[2].hasAttribute('inert'), '3rd child inert restored');
});

});
Expand Down

0 comments on commit 9e267e4

Please sign in to comment.