Skip to content

Commit 0f4ebf6

Browse files
kevinpschaafkevinpschaaf
committed
Add tests
1 parent 7497065 commit 0f4ebf6

File tree

1 file changed

+215
-1
lines changed

1 file changed

+215
-1
lines changed

‎test/unit/property-effects.html

Lines changed: 215 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@
2323
</dom-repeat>
2424

2525
<script>
26-
26+
/*
2727
suite('single-element binding effects', function() {
2828
2929
var el;
@@ -1504,6 +1504,220 @@
15041504
assert.equal(fn.callCount, 2);
15051505
});
15061506
1507+
});
1508+
*/
1509+
1510+
suite('a la carte usage of API', function() {
1511+
1512+
class BaseClass extends Polymer.PropertyEffects(HTMLElement) {
1513+
connectedCallback() {
1514+
this.pcSpy = sinon.spy();
1515+
this._flushProperties();
1516+
}
1517+
_propertiesChanged(props, changedProps, oldProps) {
1518+
this.pcSpy(props, changedProps, oldProps);
1519+
super._propertiesChanged(props, changedProps, oldProps);
1520+
}
1521+
}
1522+
1523+
test('generic property effect', function() {
1524+
class TestClass extends BaseClass {
1525+
constructor() {
1526+
super();
1527+
this.observer = sinon.spy();
1528+
}
1529+
}
1530+
let observer = sinon.spy();
1531+
TestClass.addPropertyEffect('prop', TestClass.prototype.PROPERTY_EFFECT_TYPES.OBSERVE, {
1532+
fn: observer
1533+
});
1534+
customElements.define('pe-pe', TestClass);
1535+
let el = document.createElement('pe-pe');
1536+
document.body.appendChild(el);
1537+
assert.equal(observer.callCount, 0);
1538+
assert.equal(el.pcSpy.callCount, 0);
1539+
el.prop = true;
1540+
assert.equal(observer.callCount, 1);
1541+
assert.equal(el.pcSpy.callCount, 1);
1542+
el.prop = 'hithere';
1543+
assert.equal(observer.callCount, 2);
1544+
assert.equal(el.pcSpy.callCount, 2);
1545+
el.prop = false;
1546+
assert.equal(observer.callCount, 3);
1547+
assert.equal(el.pcSpy.callCount, 3);
1548+
document.body.removeChild(el);
1549+
});
1550+
1551+
test('read only property', function() {
1552+
class TestClass extends BaseClass {}
1553+
TestClass.createReadOnlyProperty('prop', true);
1554+
customElements.define('pe-read-only', TestClass);
1555+
let el = document.createElement('pe-read-only');
1556+
document.body.appendChild(el);
1557+
el.prop = true;
1558+
assert.equal(el.prop, undefined);
1559+
assert.equal(el.pcSpy.callCount, 0);
1560+
el._setProp(true);
1561+
assert.equal(el.prop, true);
1562+
assert.equal(el.pcSpy.callCount, 1);
1563+
el.prop = false;
1564+
assert.equal(el.prop, true);
1565+
assert.equal(el.pcSpy.callCount, 1);
1566+
document.body.removeChild(el);
1567+
});
1568+
1569+
test('reflected property', function() {
1570+
class TestClass extends BaseClass {}
1571+
TestClass.createReflectedProperty('prop', true);
1572+
customElements.define('pe-reflected', TestClass);
1573+
let el = document.createElement('pe-reflected');
1574+
document.body.appendChild(el);
1575+
assert.equal(el.hasAttribute('prop'), false);
1576+
assert.equal(el.pcSpy.callCount, 0);
1577+
el.prop = true;
1578+
assert.equal(el.getAttribute('prop'), '');
1579+
assert.equal(el.pcSpy.callCount, 1);
1580+
el.prop = 'hithere';
1581+
assert.equal(el.getAttribute('prop'), 'hithere');
1582+
assert.equal(el.pcSpy.callCount, 2);
1583+
el.prop = false;
1584+
assert.equal(el.hasAttribute('prop'), false);
1585+
assert.equal(el.pcSpy.callCount, 3);
1586+
document.body.removeChild(el);
1587+
});
1588+
1589+
test('property observer', function() {
1590+
class TestClass extends BaseClass {
1591+
constructor() {
1592+
super();
1593+
this.observer = sinon.spy();
1594+
}
1595+
}
1596+
TestClass.createPropertyObserver('prop', 'observer');
1597+
customElements.define('pe-observer', TestClass);
1598+
let el = document.createElement('pe-observer');
1599+
document.body.appendChild(el);
1600+
assert.equal(el.observer.callCount, 0);
1601+
assert.equal(el.pcSpy.callCount, 0);
1602+
el.prop = true;
1603+
assert.equal(el.observer.callCount, 1);
1604+
assert.equal(el.pcSpy.callCount, 1);
1605+
el.prop = 'hithere';
1606+
assert.equal(el.observer.callCount, 2);
1607+
assert.equal(el.pcSpy.callCount, 2);
1608+
el.prop = false;
1609+
assert.equal(el.observer.callCount, 3);
1610+
assert.equal(el.pcSpy.callCount, 3);
1611+
document.body.removeChild(el);
1612+
});
1613+
1614+
test('method observer', function() {
1615+
class TestClass extends BaseClass {
1616+
constructor() {
1617+
super();
1618+
this.observer = sinon.spy();
1619+
}
1620+
}
1621+
TestClass.createMethodObserver('observer(a, b.c)');
1622+
customElements.define('pe-method-observer', TestClass);
1623+
let el = document.createElement('pe-method-observer');
1624+
document.body.appendChild(el);
1625+
assert.equal(el.observer.callCount, 0);
1626+
assert.equal(el.pcSpy.callCount, 0);
1627+
el.a = 'a';
1628+
assert.equal(el.observer.callCount, 1);
1629+
assert.deepEqual(el.observer.getCall(0).args, ['a', undefined]);
1630+
assert.equal(el.pcSpy.callCount, 1);
1631+
el.b = {c: 'c'};
1632+
assert.equal(el.observer.callCount, 2);
1633+
assert.deepEqual(el.observer.getCall(1).args, ['a', 'c']);
1634+
assert.equal(el.pcSpy.callCount, 2);
1635+
el.setProperties({
1636+
a: 'A',
1637+
b: {c: 'C'}
1638+
})
1639+
assert.equal(el.observer.callCount, 3);
1640+
assert.deepEqual(el.observer.getCall(2).args, ['A', 'C']);
1641+
assert.equal(el.pcSpy.callCount, 3);
1642+
document.body.removeChild(el);
1643+
});
1644+
1645+
test('computed property', function() {
1646+
class TestClass extends BaseClass {
1647+
constructor() {
1648+
super();
1649+
this.compute = sinon.spy(function(a, c) { return a + c; });
1650+
}
1651+
}
1652+
TestClass.createComputedProperty('prop', 'compute(a, b.c)');
1653+
customElements.define('pe-computed', TestClass);
1654+
let el = document.createElement('pe-computed');
1655+
document.body.appendChild(el);
1656+
assert.equal(el.compute.callCount, 0);
1657+
assert.equal(el.pcSpy.callCount, 0);
1658+
el.a = 'a';
1659+
assert.equal(el.compute.callCount, 1);
1660+
assert.deepEqual(el.compute.getCall(0).args, ['a', undefined]);
1661+
assert.equal(el.prop, 'aundefined');
1662+
assert.equal(el.pcSpy.callCount, 1);
1663+
el.b = {c: 'c'};
1664+
assert.equal(el.compute.callCount, 2);
1665+
assert.deepEqual(el.compute.getCall(1).args, ['a', 'c']);
1666+
assert.equal(el.prop, 'ac');
1667+
assert.equal(el.pcSpy.callCount, 2);
1668+
el.setProperties({
1669+
a: 'A',
1670+
b: {c: 'C'}
1671+
})
1672+
assert.equal(el.compute.callCount, 3);
1673+
assert.deepEqual(el.compute.getCall(2).args, ['A', 'C']);
1674+
assert.equal(el.prop, 'AC');
1675+
assert.equal(el.pcSpy.callCount, 3);
1676+
document.body.removeChild(el);
1677+
});
1678+
1679+
test('notifying property', function() {
1680+
class TestClass extends BaseClass { }
1681+
TestClass.createNotifyingProperty('prop');
1682+
customElements.define('pe-notify', TestClass);
1683+
let el = document.createElement('pe-notify');
1684+
let handler = sinon.spy();
1685+
el.addEventListener('prop-changed', handler);
1686+
document.body.appendChild(el);
1687+
assert.equal(handler.callCount, 0);
1688+
assert.equal(el.pcSpy.callCount, 0);
1689+
el.prop = 'prop';
1690+
assert.equal(handler.callCount, 1);
1691+
assert.equal(handler.getCall(0).args[0].detail.value, 'prop');
1692+
assert.equal(el.pcSpy.callCount, 1);
1693+
el.prop += '+';
1694+
assert.equal(handler.callCount, 2);
1695+
assert.equal(handler.getCall(1).args[0].detail.value, 'prop+');
1696+
document.body.removeChild(el);
1697+
});
1698+
1699+
test('bound template', function() {
1700+
let template = document.createElement('template');
1701+
template.innerHTML = '<div>[[prop]]</div><button on-click="handler"></button>';
1702+
class TestClass extends BaseClass {
1703+
connectedCallback() {
1704+
this.handler = sinon.spy();
1705+
this.attachShadow({mode:'open'}).appendChild(this._stampTemplate(template));
1706+
super.connectedCallback();
1707+
}
1708+
}
1709+
TestClass.bindTemplate(template);
1710+
customElements.define('pe-template', TestClass);
1711+
let el = document.createElement('pe-template');
1712+
document.body.appendChild(el);
1713+
assert.equal(el.handler.callCount, 0);
1714+
el.prop = 'prop';
1715+
assert.equal(el.shadowRoot.querySelector('div').textContent, 'prop');
1716+
el.shadowRoot.querySelector('button').click();
1717+
assert.equal(el.handler.callCount, 1);
1718+
document.body.removeChild(el);
1719+
});
1720+
15071721
});
15081722

15091723
</script>

0 commit comments

Comments
 (0)