Files
polymer/test/unit/notify-path.html

1069 lines
37 KiB
HTML
Raw Normal View History

<!doctype html>
<!--
@license
Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
-->
<html>
<head>
<meta charset="utf-8">
<script src="../../../webcomponentsjs/webcomponents-lite.js"></script>
<script src="../../../web-component-tester/browser.js"></script>
<link rel="import" href="../../polymer.html">
<link rel="import" href="notify-path-elements.html">
<body>
<script>
// Safari 9 has a horrible bug related to array enumeration after defining
// a non-enumerable property on it (we do for `.splices`); for now we work
// around chai's deepEqual implementation that enumerates array keys using
// `for in` in the specific case the bug causes an assert failure
function arraysEqual(a, b) {
for (var i=0; i<a.length; i++) {
if (a[i] !== b[i]) {
throw new Error('expected ' + a + ' to equal ' + b);
}
}
if (a.length != b.length) {
throw new Error('expected ' + a + ' to equal ' + b);
}
}
suite('basic path bindings', function() {
var el;
2015-03-23 14:57:35 -07:00
setup(function() {
el = document.createElement('x-stuff');
document.body.appendChild(el);
});
2015-03-23 14:57:35 -07:00
teardown(function() {
2015-01-26 17:34:23 -08:00
document.body.removeChild(el);
});
function setupNested() {
var nested = {
obj: {
value: 41
}
};
el.nested = nested;
el.expectedNestedSubpath = 'nested.obj.value';
el.expectedNestedValue = 42;
el.expectedNestedObjSubpath = 'nested.obj.value';
el.expectedNestedObjValue = 42;
el.$.compose.expectedObjSubpath = 'obj.value';
el.$.compose.expectedObjValue = 42;
el.$.forward.expectedObjSubpath = 'obj.value';
el.$.forward.expectedObjValue = 42;
el.$.forward.$.compose.expectedObjSubpath = 'obj.value';
el.$.forward.$.compose.expectedObjValue = 42;
el.clearObserverCounts();
}
function setupComposedAndGetObject() {
el.nested = {
obj: {
value: 41
}
};
var obj = {
value: 42
};
el.expectedNestedSubpath = 'nested.obj';
el.expectedNestedValue = obj;
el.expectedNestedObjSubpath = 'nested.obj';
el.expectedNestedObjValue = obj;
el.$.compose.expectedObjSubpath = 'obj';
el.$.compose.expectedObjValue = obj;
el.$.forward.expectedObjSubpath = 'obj';
el.$.forward.expectedObjValue = obj;
el.$.forward.$.compose.expectedObjSubpath = 'obj';
el.$.forward.$.compose.expectedObjValue = obj;
el.clearObserverCounts();
return obj;
}
function verifyObserverOutput(expectedNestedObjChanged) {
assert.equal(el.observerCounts.nestedSubpathChanged, 1);
assert.equal(el.observerCounts.nestedObjChanged, expectedNestedObjChanged);
assert.equal(el.observerCounts.nestedObjSubpathChanged, 1);
assert.equal(el.observerCounts.nestedObjValueChanged, 1);
assert.equal(el.$.compose.observerCounts.objSubpathChanged, 1);
assert.equal(el.$.compose.observerCounts.objValueChanged, 1);
assert.equal(el.$.forward.observerCounts.objSubpathChanged, 1);
assert.equal(el.$.forward.observerCounts.objValueChanged, 1);
assert.equal(el.$.basic.notifyingValue, 42);
2015-02-09 18:13:58 -08:00
assert.equal(el.$.basic.notifyingValue, 42);
assert.equal(el.$.compose.$.basic1.notifyingValue, 42);
assert.equal(el.$.compose.$.basic2.notifyingValue, 42);
assert.equal(el.$.forward.$.compose.$.basic1.notifyingValue, 42);
assert.equal(el.$.forward.$.compose.$.basic2.notifyingValue, 42);
assert.equal(el.$.basic.getAttribute('attrvalue'), '42');
assert.equal(el.$.compose.$.basic1.getAttribute('attrvalue'), '42');
assert.equal(el.$.compose.$.basic2.getAttribute('attrvalue'), '42');
assert.equal(el.$.forward.$.compose.$.basic1.getAttribute('attrvalue'), '42');
assert.equal(el.$.forward.$.compose.$.basic2.getAttribute('attrvalue'), '42');
}
function verifyNestedObserversOutput() {
verifyObserverOutput(0);
}
function verifyNonNestedObserversOutput() {
verifyObserverOutput(1);
}
test('downward data flow', function() {
// Setup
var nested = {
obj: {
value: 42
}
};
el.expectedNestedSubpath = 'nested';
el.expectedNestedValue = nested;
el.expectedNestedObjSubpath = 'nested.obj';
el.expectedNestedObjValue = nested.obj;
el.$.compose.expectedObjSubpath = 'obj';
el.$.compose.expectedObjValue = nested.obj;
el.$.forward.expectedObjSubpath = 'obj';
el.$.forward.expectedObjValue = nested.obj;
el.$.forward.$.compose.expectedObjSubpath = 'obj';
el.$.forward.$.compose.expectedObjValue = nested.obj;
// Do the thing
el.nested = nested;
// Verify
verifyNonNestedObserversOutput();
});
test('notification from basic element property change', function() {
// Setup
setupNested();
// Do the thing
el.$.basic.notifyingValue = 42;
// Verify
verifyNestedObserversOutput();
});
test('notification from composed element property change', function() {
// Setup
setupNested();
// Do the thing
el.$.compose.$.basic1.notifyingValue = 42;
// Verify
verifyNestedObserversOutput();
});
test('notification from forward\'s composed element property change', function() {
// Setup
setupNested();
// Do the thing
2015-02-09 18:13:58 -08:00
el.$.forward.$.compose.$.basic1.notifyingValue = 42;
// Verify
verifyNestedObserversOutput();
});
2015-05-01 12:36:41 -07:00
test('notification from set in top element', function() {
// Setup
setupNested();
// Do the thing
2015-05-01 12:36:41 -07:00
el.set('nested.obj.value', 42);
// Verify
verifyNestedObserversOutput();
});
2015-05-01 12:36:41 -07:00
test('notification from set in composed element', function() {
// Setup
setupNested();
// Do the thing
2015-05-01 12:36:41 -07:00
el.$.compose.set('obj.value', 42);
// Verify
verifyNestedObserversOutput();
});
2015-05-01 12:36:41 -07:00
test('notification from set in forward element', function() {
// Setup
setupNested();
// Do the thing
2015-05-01 12:36:41 -07:00
el.$.forward.set('obj.value', 42);
// Verify
verifyNestedObserversOutput();
});
2015-05-01 12:36:41 -07:00
test('notification from set in forward\'s composed element', function() {
// Setup
setupNested();
// Do the thing
2015-05-01 12:36:41 -07:00
el.$.forward.$.compose.set('obj.value', 42);
// Verify
verifyNestedObserversOutput();
});
test('notification from object change in compose element', function() {
// Setup
var obj = setupComposedAndGetObject();
// Do the thing
el.$.compose.obj = obj;
// Verify
verifyNonNestedObserversOutput();
});
test('notification from object change in forward element', function() {
// Setup
var obj = setupComposedAndGetObject();
// Do the thing
el.$.forward.obj = obj;
// Verify
verifyNonNestedObserversOutput();
});
test('notification from object change in forward\'s compose element', function() {
// Setup
var obj = setupComposedAndGetObject();
// Do the thing
el.$.forward.$.compose.obj = obj;
// Verify
verifyNonNestedObserversOutput();
});
test('negation', function() {
// Setup
var nested = {
obj: {
value: false
}
};
// Do the thing
el.nested = nested;
// Verify
2015-02-09 18:13:58 -08:00
assert.equal(el.$.basic.notifyingValue, false);
assert.equal(el.$.compose.$.basic1.notifyingValue, false);
assert.equal(el.$.compose.$.basic2.notifyingValue, false);
assert.equal(el.$.compose.$.basic3.notifyingValue, true);
assert.equal(el.$.forward.$.compose.$.basic1.notifyingValue, false);
assert.equal(el.$.forward.$.compose.$.basic2.notifyingValue, false);
assert.equal(el.$.forward.$.compose.$.basic3.notifyingValue, true);
assert.equal(el.$.basic.hasAttribute('attrvalue'), false);
assert.equal(el.$.compose.$.basic1.hasAttribute('attrvalue'), false);
assert.equal(el.$.compose.$.basic2.hasAttribute('attrvalue'), false);
assert.equal(el.$.compose.$.basic3.hasAttribute('attrvalue'), true);
assert.equal(el.$.forward.$.compose.$.basic1.hasAttribute('attrvalue'), false);
assert.equal(el.$.forward.$.compose.$.basic2.hasAttribute('attrvalue'), false);
assert.equal(el.$.forward.$.compose.$.basic3.hasAttribute('attrvalue'), true);
// Do another thing
2015-02-09 18:13:58 -08:00
el.$.basic.notifyingValue = true;
// Verify
2015-02-09 18:13:58 -08:00
assert.equal(el.$.basic.notifyingValue, true);
assert.equal(el.$.compose.$.basic1.notifyingValue, true);
assert.equal(el.$.compose.$.basic2.notifyingValue, true);
assert.equal(el.$.compose.$.basic3.notifyingValue, false);
assert.equal(el.$.forward.$.compose.$.basic1.notifyingValue, true);
assert.equal(el.$.forward.$.compose.$.basic2.notifyingValue, true);
assert.equal(el.$.forward.$.compose.$.basic3.notifyingValue, false);
assert.equal(el.$.basic.hasAttribute('attrvalue'), true);
assert.equal(el.$.compose.$.basic1.hasAttribute('attrvalue'), true);
assert.equal(el.$.compose.$.basic2.hasAttribute('attrvalue'), true);
assert.equal(el.$.compose.$.basic3.hasAttribute('attrvalue'), false);
assert.equal(el.$.forward.$.compose.$.basic1.hasAttribute('attrvalue'), true);
assert.equal(el.$.forward.$.compose.$.basic2.hasAttribute('attrvalue'), true);
assert.equal(el.$.forward.$.compose.$.basic3.hasAttribute('attrvalue'), false);
// Do another thing
2015-02-09 18:13:58 -08:00
el.$.forward.$.compose.$.basic1.notifyingValue = false;
// Verify
2015-02-09 18:13:58 -08:00
assert.equal(el.$.basic.notifyingValue, false);
assert.equal(el.$.compose.$.basic1.notifyingValue, false);
assert.equal(el.$.compose.$.basic2.notifyingValue, false);
assert.equal(el.$.compose.$.basic3.notifyingValue, true);
assert.equal(el.$.forward.$.compose.$.basic1.notifyingValue, false);
assert.equal(el.$.forward.$.compose.$.basic2.notifyingValue, false);
assert.equal(el.$.forward.$.compose.$.basic3.notifyingValue, true);
assert.equal(el.$.basic.hasAttribute('attrvalue'), false);
assert.equal(el.$.compose.$.basic1.hasAttribute('attrvalue'), false);
assert.equal(el.$.compose.$.basic2.hasAttribute('attrvalue'), false);
assert.equal(el.$.compose.$.basic3.hasAttribute('attrvalue'), true);
assert.equal(el.$.forward.$.compose.$.basic1.hasAttribute('attrvalue'), false);
assert.equal(el.$.forward.$.compose.$.basic2.hasAttribute('attrvalue'), false);
assert.equal(el.$.forward.$.compose.$.basic3.hasAttribute('attrvalue'), true);
// Do another thing
2015-05-01 12:36:41 -07:00
el.set('nested.obj.value', true);
// Verify
2015-02-09 18:13:58 -08:00
assert.equal(el.$.basic.notifyingValue, true);
assert.equal(el.$.compose.$.basic1.notifyingValue, true);
assert.equal(el.$.compose.$.basic2.notifyingValue, true);
assert.equal(el.$.compose.$.basic3.notifyingValue, false);
assert.equal(el.$.forward.$.compose.$.basic1.notifyingValue, true);
assert.equal(el.$.forward.$.compose.$.basic2.notifyingValue, true);
assert.equal(el.$.forward.$.compose.$.basic3.notifyingValue, false);
assert.equal(el.$.basic.hasAttribute('attrvalue'), true);
assert.equal(el.$.compose.$.basic1.hasAttribute('attrvalue'), true);
assert.equal(el.$.compose.$.basic2.hasAttribute('attrvalue'), true);
assert.equal(el.$.compose.$.basic3.hasAttribute('attrvalue'), false);
assert.equal(el.$.forward.$.compose.$.basic1.hasAttribute('attrvalue'), true);
assert.equal(el.$.forward.$.compose.$.basic2.hasAttribute('attrvalue'), true);
assert.equal(el.$.forward.$.compose.$.basic3.hasAttribute('attrvalue'), false);
// Do another thing
// no two way binding through negation
2015-02-09 18:13:58 -08:00
el.$.compose.$.basic3.notifyingValue = true;
// Verify
2015-02-09 18:13:58 -08:00
assert.equal(el.$.basic.notifyingValue, true);
assert.equal(el.$.compose.$.basic1.notifyingValue, true);
assert.equal(el.$.compose.$.basic2.notifyingValue, true);
assert.equal(el.$.compose.$.basic3.notifyingValue, true);
assert.equal(el.$.forward.$.compose.$.basic1.notifyingValue, true);
assert.equal(el.$.forward.$.compose.$.basic2.notifyingValue, true);
assert.equal(el.$.forward.$.compose.$.basic3.notifyingValue, false);
assert.equal(el.$.basic.hasAttribute('attrvalue'), true);
assert.equal(el.$.compose.$.basic1.hasAttribute('attrvalue'), true);
assert.equal(el.$.compose.$.basic2.hasAttribute('attrvalue'), true);
assert.equal(el.$.compose.$.basic3.hasAttribute('attrvalue'), false);
assert.equal(el.$.forward.$.compose.$.basic1.hasAttribute('attrvalue'), true);
assert.equal(el.$.forward.$.compose.$.basic2.hasAttribute('attrvalue'), true);
assert.equal(el.$.forward.$.compose.$.basic3.hasAttribute('attrvalue'), false);
});
test('simlarly named properties', function() {
var nested = {
obj: {
value: 41,
value2: 99
}
};
el.nested = nested;
2015-02-09 18:13:58 -08:00
assert.equal(el.$.compose.$.basic1.notifyingValue, 41);
assert.equal(el.$.compose.$.basic1.othervalue, 99);
2015-05-01 12:36:41 -07:00
el.set('nested.obj.value', 42);
2015-02-09 18:13:58 -08:00
assert.equal(el.$.compose.$.basic1.notifyingValue, 42);
assert.equal(el.$.compose.$.basic1.othervalue, 99);
2015-05-01 12:36:41 -07:00
el.set('nested.obj.value2', 98);
2015-02-09 18:13:58 -08:00
assert.equal(el.$.compose.$.basic1.notifyingValue, 42);
assert.equal(el.$.compose.$.basic1.othervalue, 98);
});
});
suite('path effects', function() {
var el;
setup(function() {
el = document.createElement('x-stuff');
document.body.appendChild(el);
});
teardown(function() {
document.body.removeChild(el);
});
test('observer with multiple args, path last', function() {
2015-05-01 12:36:41 -07:00
// Setup
var nested = {
obj: {
value: 42
}
};
el.expectedNestedObjSubpath = 'nested.obj';
el.expectedNestedObjValue = nested.obj;
// Do the thing
el.a = 'a';
el.b = 'b';
el.nested = nested;
// Verify
assert.equal(el.observerCounts.multipleChanged, 1);
});
test('observer with multiple args, path not last', function() {
2015-05-01 12:36:41 -07:00
// Setup
var nested = {
obj: {
value: 42
}
};
el.expectedNestedObjSubpath = 'nested.obj';
el.expectedNestedObjValue = nested.obj;
// Do the thing
el.a = 'a';
el.nested = nested;
el.b = 'b';
// Verify
assert.equal(el.observerCounts.multipleChanged, 1);
});
test('observer with multiple args, path first, then last', function() {
2015-05-01 12:36:41 -07:00
// Setup
var nested = {
obj: {
value: 42
}
};
el.nested = nested;
el.clearObserverCounts();
el.expectedNestedObjSubpath = 'nested.obj';
el.expectedNestedObjValue = nested.obj;
// Do the thing
el.a = 'a';
el.b = 'b';
// Verify
assert.equal(el.observerCounts.multipleChanged, 1);
// Setup
el.expectedNestedObjSubpath = 'nested.obj.value';
el.expectedNestedObjValue = 43;
// Do another thing
2015-05-01 12:36:41 -07:00
el.set('nested.obj.value', 43);
// Verify
assert.equal(el.observerCounts.multipleChanged, 2);
});
test('observer & computed with multiple path args', function() {
2015-05-01 12:36:41 -07:00
// Setup
var nested = {
b: 33,
obj: {
c: 66
}
};
// Do the thing
el.a = 1;
el.nested = nested;
// Verify
// Multiple-dependency observers with dependencies on the same
// object will be called once for each dependency on the shared object
assert.equal(el.observerCounts.multiplePathsChanged, 2);
assert.equal(el.computedFromPaths, 100);
assert.equal(el.$.boundChild.computedFromPaths, 100);
});
test('array.splices notified (no Collection)', function() {
el.arrayNoColl = [];
assert.equal(el.observerCounts.arrayNoCollChanged, 1);
el.push('arrayNoColl', 1, 2, 3);
assert.equal(el.observerCounts.arrayNoCollChanged, 2);
assert.equal(Polymer.Collection.get(el.arrayNoColl).getKeys().length, 3);
2015-08-13 11:19:04 -07:00
el.push('arrayNoColl', 4, 5, 6);
assert.equal(el.observerCounts.arrayNoCollChanged, 3);
assert.equal(Polymer.Collection.get(el.arrayNoColl).getKeys().length, 6);
});
test('array.splices notified', function() {
el.array = [];
// Ensure keySplices are generated for test purposes
Polymer.Collection.get(el.array);
assert.equal(el.observerCounts.arrayChanged, 1);
el.push('array', 1, 2, 3);
assert.equal(el.observerCounts.arrayChanged, 2);
assert.equal(Polymer.Collection.get(el.array).getKeys().length, 3);
2015-08-13 11:19:04 -07:00
el.push('array', 4, 5, 6);
assert.equal(el.observerCounts.arrayChanged, 3);
assert.equal(Polymer.Collection.get(el.array).getKeys().length, 6);
});
test('array.splices notified, multiple args, prop first', function() {
el.array = [];
// Ensure keySplices are generated for test purposes
Polymer.Collection.get(el.array);
el.prop = 'first';
el.push('array', 1, 2, 3);
assert.equal(el.observerCounts.arrayOrPropChanged, 1);
2015-08-13 11:19:04 -07:00
el.push('array', 4, 5, 6);
assert.equal(el.observerCounts.arrayOrPropChanged, 2);
});
test('array.splices notified, multiple args, prop last', function() {
el.array = [];
// Ensure keySplices are generated for test purposes
Polymer.Collection.get(el.array);
el.push('array', 1, 2, 3);
el.prop = 'last';
assert.equal(el.observerCounts.arrayOrPropChanged, 1);
});
test('array.length notified', function() {
el.data = [];
assert.equal(el.$.boundChild.arrayLength, el.data.length);
el.push('data', 1, 2, 3);
assert.equal(el.$.boundChild.arrayLength, el.data.length);
el.pop('data');
el.pop('data');
assert.equal(el.$.boundChild.arrayLength, el.data.length);
2015-08-13 11:19:04 -07:00
el.unshift('data', 4, 5);
el.unshift('data', 6, 7, 8);
assert.equal(el.$.boundChild.arrayLength, el.data.length);
2015-08-13 11:19:04 -07:00
el.splice('data', 9, 10, 11, 12, 13);
assert.equal(el.$.boundChild.arrayLength, el.data.length);
el.shift('data');
el.shift('data');
el.shift('data');
assert.equal(el.$.boundChild.arrayLength, el.data.length);
});
});
suite('path API', function() {
var el;
setup(function() {
el = document.createElement('x-stuff');
document.body.appendChild(el);
});
teardown(function() {
document.body.removeChild(el);
});
2015-05-01 12:36:41 -07:00
test('get', function() {
el.simple = 11;
el.nested = {
again: {
again: {
wayOverThere: 99
},
there: 55
},
here: 42
};
2015-05-01 12:36:41 -07:00
assert.equal(el.get('simple'), 11);
assert.equal(el.get('nested'), el.nested);
assert.equal(el.get('nested.here'), 42);
2015-05-05 11:22:34 -07:00
assert.equal(el.get(['nested', 'again']), el.nested.again);
2015-05-01 12:36:41 -07:00
assert.equal(el.get('nested.again.there'), 55);
assert.equal(el.get('nested.again.again'), el.nested.again.again);
2015-05-05 11:22:34 -07:00
assert.equal(el.get(['nested', 'again.again', 'wayOverThere']), 99);
});
2015-05-01 12:36:41 -07:00
test('set', function() {
el.set('simple', 11);
el.set('nested', {});
el.set('nested.here', 42);
2015-05-05 11:22:34 -07:00
el.set(['nested', 'again'], {});
2015-05-01 12:36:41 -07:00
el.set('nested.again.there', 55);
el.set('nested.again.again', {});
2015-05-05 11:22:34 -07:00
el.set(['nested', 'again.again', 'wayOverThere'], 99);
assert.equal(el.simple, 11);
2015-05-01 12:36:41 -07:00
assert.equal(el.get('simple'), 11);
assert.equal(el.get('nested'), el.nested);
assert.equal(el.nested.here, 42);
2015-05-01 12:36:41 -07:00
assert.equal(el.get('nested.here'), 42);
assert.equal(el.get('nested.again'), el.nested.again);
assert.equal(el.nested.again.there, 55);
2015-05-01 12:36:41 -07:00
assert.equal(el.get('nested.again.there'), 55);
assert.equal(el.get('nested.again.again'), el.nested.again.again);
assert.equal(el.nested.again.again.wayOverThere, 99);
2015-05-01 12:36:41 -07:00
assert.equal(el.get('nested.again.again.wayOverThere'), 99);
});
2015-11-19 12:07:13 -08:00
test('notifyPath calls observer', function() {
el.a = {b: {c: true}};
sinon.spy(el, 'aChanged');
el.notifyPath('a.b.c', el.a.b.c);
assert.isTrue(el.aChanged.calledOnce);
assert.equal(el.get('a.b.c'), true);
});
test('notifyPath a non-extistant does nothing', function() {
el.notifyPath('does.not.exist', true);
});
2015-07-16 17:40:11 -07:00
test('get array', function() {
el.arrayChanged = function() {};
el.array = [1, 2, 3];
el.array.array = [5, 6, 7];
el.array.prop = 'prop';
assert.equal(el.get('array'), el.array);
assert.equal(el.get('array.0'), 1);
assert.equal(el.get('array.1'), 2);
assert.equal(el.get('array.2'), 3);
assert.equal(el.get('array.#0'), 1);
assert.equal(el.get('array.#1'), 2);
assert.equal(el.get('array.#2'), 3);
2015-07-16 17:40:11 -07:00
assert.equal(el.get('array.array'), el.array.array);
assert.equal(el.get('array.array.0'), 5);
assert.equal(el.get('array.array.1'), 6);
assert.equal(el.get('array.array.2'), 7);
assert.equal(el.get('array.array.#0'), 5);
assert.equal(el.get('array.array.#1'), 6);
assert.equal(el.get('array.array.#2'), 7);
2015-07-16 17:40:11 -07:00
assert.equal(el.get('array.prop'), 'prop');
el.unshift('array', 0);
el.splice('array', 2, 0, 1.5);
el.unshift('array.array', 4);
el.splice('array.array', 2, 0, 5.5);
assert.equal(el.get('array.0'), 0);
assert.equal(el.get('array.1'), 1);
assert.equal(el.get('array.2'), 1.5);
assert.equal(el.get('array.3'), 2);
assert.equal(el.get('array.4'), 3);
assert.equal(el.get('array.#0'), 1);
assert.equal(el.get('array.#1'), 2);
assert.equal(el.get('array.#2'), 3);
assert.equal(el.get('array.#3'), 0);
assert.equal(el.get('array.#4'), 1.5);
2015-07-16 17:40:11 -07:00
assert.equal(el.get('array.array.0'), 4);
assert.equal(el.get('array.array.1'), 5);
assert.equal(el.get('array.array.2'), 5.5);
assert.equal(el.get('array.array.3'), 6);
assert.equal(el.get('array.array.4'), 7);
assert.equal(el.get('array.array.#0'), 5);
assert.equal(el.get('array.array.#1'), 6);
assert.equal(el.get('array.array.#2'), 7);
assert.equal(el.get('array.array.#3'), 4);
assert.equal(el.get('array.array.#4'), 5.5);
2015-07-16 17:40:11 -07:00
});
test('set array', function() {
el.arrayChanged = function() {};
el.set('array', [1, 2, 3]);
el.set('array.array', [5, 6, 7]);
el.set('array.prop', 'prop');
assert.equal(el.get('array'), el.array);
assert.equal(el.get('array.0'), 1);
assert.equal(el.get('array.1'), 2);
assert.equal(el.get('array.2'), 3);
assert.equal(el.get('array.#0'), 1);
assert.equal(el.get('array.#1'), 2);
assert.equal(el.get('array.#2'), 3);
2015-07-16 17:40:11 -07:00
assert.equal(el.get('array.array'), el.array.array);
assert.equal(el.get('array.array.0'), 5);
assert.equal(el.get('array.array.1'), 6);
assert.equal(el.get('array.array.2'), 7);
assert.equal(el.get('array.array.#0'), 5);
assert.equal(el.get('array.array.#1'), 6);
assert.equal(el.get('array.array.#2'), 7);
2015-07-16 17:40:11 -07:00
assert.equal(el.get('array.prop'), 'prop');
el.set(['array', 0], 81);
el.set(['array', 1], 82);
el.set(['array', 2], 83);
el.set(['array.array', 0], 91);
el.set(['array.array', 1], 92);
el.set(['array.array', 2], 93);
el.set('array.prop', 'foo');
assert.equal(el.get('array.0'), 81);
assert.equal(el.get('array.1'), 82);
assert.equal(el.get('array.2'), 83);
assert.equal(el.get('array.#0'), 81);
assert.equal(el.get('array.#1'), 82);
assert.equal(el.get('array.#2'), 83);
2015-07-16 17:40:11 -07:00
assert.equal(el.get('array.array.0'), 91);
assert.equal(el.get('array.array.1'), 92);
assert.equal(el.get('array.array.2'), 93);
assert.equal(el.get('array.array.#0'), 91);
assert.equal(el.get('array.array.#1'), 92);
assert.equal(el.get('array.array.#2'), 93);
2015-07-16 17:40:11 -07:00
assert.equal(el.get('array.prop'), 'foo');
el.set(['array', '#0'], 31);
el.set(['array', '#1'], 32);
el.set(['array', '#2'], 33);
el.set(['array.array', '#0'], 41);
el.set(['array.array', '#1'], 42);
el.set(['array.array', '#2'], 43);
assert.equal(el.get('array.0'), 31);
assert.equal(el.get('array.1'), 32);
assert.equal(el.get('array.2'), 33);
assert.equal(el.get('array.#0'), 31);
assert.equal(el.get('array.#1'), 32);
assert.equal(el.get('array.#2'), 33);
assert.equal(el.get('array.array.0'), 41);
assert.equal(el.get('array.array.1'), 42);
assert.equal(el.get('array.array.2'), 43);
assert.equal(el.get('array.array.#0'), 41);
assert.equal(el.get('array.array.#1'), 42);
assert.equal(el.get('array.array.#2'), 43);
2015-07-16 17:40:11 -07:00
});
var nop = function() {};
test('push array', function() {
el.arrayChanged = nop;
el.array = ['orig1', 'orig2', 'orig3'];
Polymer.Collection.get(el.array);
var key = el.array.length;
el.arrayChanged = function(change) {
assert.strictEqual(change.indexSplices.length, 1);
assert.strictEqual(change.indexSplices[0].index, 3);
assert.strictEqual(change.indexSplices[0].addedCount, 2);
assert.strictEqual(change.indexSplices[0].removed.length, 0);
assert.strictEqual(change.keySplices.length, 1);
assert.strictEqual(change.keySplices[0].added.length, 2);
assert.strictEqual(change.keySplices[0].added[0], '#' + key);
assert.strictEqual(change.keySplices[0].added[1], '#' + (key+1));
assert.strictEqual(change.keySplices[0].removed.length, 0);
};
var ret = el.push('array', 'new1', 'new2');
assert.strictEqual(ret, 5);
assert.strictEqual(el.array.length, 5);
assert.strictEqual(el.array[0], 'orig1');
assert.strictEqual(el.array[1], 'orig2');
assert.strictEqual(el.array[2], 'orig3');
assert.strictEqual(el.array[3], 'new1');
assert.strictEqual(el.array[4], 'new2');
});
test('pop array', function() {
el.arrayChanged = nop;
el.array = ['orig1', 'orig2', 'orig3'];
Polymer.Collection.get(el.array);
var key = el.array.length-1;
el.arrayChanged = function(change) {
assert.strictEqual(change.indexSplices.length, 1);
assert.strictEqual(change.indexSplices[0].index, 2);
assert.strictEqual(change.indexSplices[0].addedCount, 0);
assert.strictEqual(change.indexSplices[0].removed.length, 1);
assert.strictEqual(change.indexSplices[0].removed[0], 'orig3');
assert.strictEqual(change.keySplices.length, 1);
assert.strictEqual(change.keySplices[0].added.length, 0);
assert.strictEqual(change.keySplices[0].removed.length, 1);
assert.strictEqual(change.keySplices[0].removed[0], '#' + key);
};
var ret = el.pop('array');
assert.strictEqual(ret, 'orig3');
assert.strictEqual(el.array.length, 2);
assert.strictEqual(el.array[0], 'orig1');
assert.strictEqual(el.array[1], 'orig2');
});
test('unshift array', function() {
el.arrayChanged = nop;
el.array = ['orig1', 'orig2', 'orig3'];
Polymer.Collection.get(el.array);
var key = el.array.length;
el.arrayChanged = function(change) {
assert.strictEqual(change.indexSplices.length, 1);
assert.strictEqual(change.indexSplices[0].index, 0);
assert.strictEqual(change.indexSplices[0].addedCount, 2);
assert.strictEqual(change.indexSplices[0].removed.length, 0);
assert.strictEqual(change.keySplices.length, 1);
assert.strictEqual(change.keySplices[0].added.length, 2);
assert.strictEqual(change.keySplices[0].added[0], '#' + key);
assert.strictEqual(change.keySplices[0].added[1], '#' + (key+1));
assert.strictEqual(change.keySplices[0].removed.length, 0);
};
var ret = el.unshift('array', 'new1', 'new2');
assert.strictEqual(ret, 5);
assert.strictEqual(el.array.length, 5);
assert.strictEqual(el.array[0], 'new1');
assert.strictEqual(el.array[1], 'new2');
assert.strictEqual(el.array[2], 'orig1');
assert.strictEqual(el.array[3], 'orig2');
assert.strictEqual(el.array[4], 'orig3');
});
test('shift array', function() {
el.arrayChanged = nop;
el.array = ['orig1', 'orig2', 'orig3'];
Polymer.Collection.get(el.array);
el.arrayChanged = function(change) {
assert.strictEqual(change.indexSplices.length, 1);
assert.strictEqual(change.indexSplices[0].index, 0);
assert.strictEqual(change.indexSplices[0].addedCount, 0);
assert.strictEqual(change.indexSplices[0].removed.length, 1);
assert.strictEqual(change.indexSplices[0].removed[0], 'orig1');
assert.strictEqual(change.keySplices.length, 1);
assert.strictEqual(change.keySplices[0].added.length, 0);
assert.strictEqual(change.keySplices[0].removed.length, 1);
assert.strictEqual(change.keySplices[0].removed[0], '#' + 0);
};
var ret = el.shift('array');
assert.strictEqual(ret, 'orig1');
assert.strictEqual(el.array.length, 2);
assert.strictEqual(el.array[0], 'orig2');
assert.strictEqual(el.array[1], 'orig3');
});
test('splice array', function() {
el.arrayChanged = nop;
el.array = ['orig1', 'orig2', 'orig3'];
var key = el.array.length;
Polymer.Collection.get(el.array);
el.arrayChanged = function(change) {
assert.strictEqual(change.indexSplices.length, 1);
assert.strictEqual(change.indexSplices[0].index, 1);
assert.strictEqual(change.indexSplices[0].addedCount, 2);
assert.strictEqual(change.indexSplices[0].removed.length, 1);
assert.strictEqual(change.indexSplices[0].removed[0], 'orig2');
assert.strictEqual(change.keySplices.length, 1);
assert.strictEqual(change.keySplices[0].added.length, 2);
assert.strictEqual(change.keySplices[0].added[0], '#' + key);
assert.strictEqual(change.keySplices[0].added[1], '#' + (key+1));
assert.strictEqual(change.keySplices[0].removed.length, 1);
assert.strictEqual(change.keySplices[0].removed[0], '#' + 1);
};
var ret = el.splice('array', 1, 1, 'new1', 'new2');
assert.deepEqual(ret, ['orig2']);
assert.strictEqual(el.array.length, 4);
assert.strictEqual(el.array[0], 'orig1');
assert.strictEqual(el.array[1], 'new1');
assert.strictEqual(el.array[2], 'new2');
assert.strictEqual(el.array[3], 'orig3');
});
test('corner: no-op push array', function() {
el.arrayChanged = nop;
el.array = ['orig1', 'orig2', 'orig3'];
Polymer.Collection.get(el.array);
el.arrayChanged = function(change) {
throw new Error("should not notify");
};
var ret = el.push('array');
assert.deepEqual(ret, 3);
assert.strictEqual(el.array.length, 3);
assert.strictEqual(el.array[0], 'orig1');
assert.strictEqual(el.array[1], 'orig2');
assert.strictEqual(el.array[2], 'orig3');
});
test('corner: no-op pop array', function() {
el.arrayChanged = nop;
el.array = [];
Polymer.Collection.get(el.array);
el.arrayChanged = function(change) {
throw new Error("should not notify");
};
var ret = el.pop('array');
assert.strictEqual(ret, undefined);
assert.strictEqual(el.array.length, 0);
});
test('corner: no-op unshift array', function() {
el.arrayChanged = nop;
el.array = ['orig1', 'orig2', 'orig3'];
Polymer.Collection.get(el.array);
var key = el.array.length;
el.arrayChanged = function(change) {
throw new Error("should not notify");
};
var ret = el.unshift('array');
assert.deepEqual(ret, 3);
assert.strictEqual(el.array.length, 3);
assert.strictEqual(el.array[0], 'orig1');
assert.strictEqual(el.array[1], 'orig2');
assert.strictEqual(el.array[2], 'orig3');
});
test('corner: no-op shift array', function() {
el.arrayChanged = nop;
el.array = [];
Polymer.Collection.get(el.array);
el.arrayChanged = function(change) {
throw new Error("should not notify");
};
var ret = el.shift('array');
assert.strictEqual(ret, undefined);
assert.strictEqual(ret, undefined);
assert.strictEqual(el.array.length, 0);
});
test('corner: no-op splice array', function() {
el.arrayChanged = nop;
el.array = ['orig1', 'orig2', 'orig3'];
var key = el.array.length;
Polymer.Collection.get(el.array);
el.arrayChanged = function(change) {
throw new Error("should not notify");
};
var ret = el.splice('array');
assert.deepEqual(ret, []);
assert.strictEqual(el.array.length, 3);
assert.strictEqual(el.array[0], 'orig1');
assert.strictEqual(el.array[1], 'orig2');
assert.strictEqual(el.array[2], 'orig3');
});
test('corner: splice array: string args', function() {
el.arrayChanged = nop;
el.array = ['orig1', 'orig2', 'orig3'];
var key = el.array.length;
Polymer.Collection.get(el.array);
el.arrayChanged = function(change) {
assert.strictEqual(change.indexSplices.length, 1);
assert.strictEqual(change.indexSplices[0].index, 1);
assert.strictEqual(change.indexSplices[0].addedCount, 2);
assert.strictEqual(change.indexSplices[0].removed.length, 1);
assert.strictEqual(change.indexSplices[0].removed[0], 'orig2');
assert.strictEqual(change.keySplices.length, 1);
assert.strictEqual(change.keySplices[0].added.length, 2);
assert.strictEqual(change.keySplices[0].added[0], '#' + key);
assert.strictEqual(change.keySplices[0].added[1], '#' + (key+1));
assert.strictEqual(change.keySplices[0].removed.length, 1);
assert.strictEqual(change.keySplices[0].removed[0], '#' + 1);
};
var ret = el.splice('array', '1', '1', 'new1', 'new2');
assert.deepEqual(ret, ['orig2']);
assert.strictEqual(el.array.length, 4);
assert.strictEqual(el.array[0], 'orig1');
assert.strictEqual(el.array[1], 'new1');
assert.strictEqual(el.array[2], 'new2');
assert.strictEqual(el.array[3], 'orig3');
});
test('corner: splice array: negative start', function() {
el.arrayChanged = nop;
el.array = ['orig1', 'orig2', 'orig3'];
var key = el.array.length;
Polymer.Collection.get(el.array);
el.arrayChanged = function(change) {
assert.strictEqual(change.indexSplices.length, 1);
assert.strictEqual(change.indexSplices[0].index, 1);
assert.strictEqual(change.indexSplices[0].addedCount, 2);
assert.strictEqual(change.indexSplices[0].removed.length, 1);
assert.strictEqual(change.indexSplices[0].removed[0], 'orig2');
assert.strictEqual(change.keySplices.length, 1);
assert.strictEqual(change.keySplices[0].added.length, 2);
assert.strictEqual(change.keySplices[0].added[0], '#' + key);
assert.strictEqual(change.keySplices[0].added[1], '#' + (key+1));
assert.strictEqual(change.keySplices[0].removed.length, 1);
assert.strictEqual(change.keySplices[0].removed[0], '#' + 1);
};
var ret = el.splice('array', '-2', '1', 'new1', 'new2');
assert.deepEqual(ret, ['orig2']);
assert.strictEqual(el.array.length, 4);
assert.strictEqual(el.array[0], 'orig1');
assert.strictEqual(el.array[1], 'new1');
assert.strictEqual(el.array[2], 'new2');
assert.strictEqual(el.array[3], 'orig3');
});
2015-09-03 21:36:44 -07:00
test('link two objects', function() {
var aChanged = 0;
var bChanged = 0;
el.a = el.b = {};
el.linkPaths('b', 'a');
el.aChanged = function() { aChanged++; };
el.bChanged = function() { bChanged++; };
el.set('a.foo', 1);
assert.equal(aChanged, 1);
assert.equal(bChanged, 1);
2015-09-04 19:13:58 -07:00
el.unlinkPaths('b');
el.set('a.foo', 2);
assert.equal(aChanged, 2);
assert.equal(bChanged, 1);
2015-09-03 21:36:44 -07:00
});
test('link three objects', function() {
var aChanged = 0;
var bChanged = 0;
var cChanged = 0;
el.a = el.b = el.c = {};
el.linkPaths('b', 'a');
el.linkPaths('c', 'a');
el.aChanged = function() { aChanged++; };
el.bChanged = function() { bChanged++; };
el.cChanged = function() { cChanged++; };
el.set('a.foo', 1);
assert.equal(aChanged, 1);
assert.equal(bChanged, 1);
assert.equal(cChanged, 1);
2015-09-04 19:13:58 -07:00
el.unlinkPaths('b');
el.set('a.foo', 2);
assert.equal(aChanged, 2);
assert.equal(bChanged, 1);
assert.equal(cChanged, 2);
2015-09-03 21:36:44 -07:00
});
test('link two arrays', function() {
var aChanged = 0;
var bChanged = 0;
el.a = el.b = [];
el.linkPaths('b', 'a');
el.aChanged = function() { aChanged++; };
el.bChanged = function() { bChanged++; };
2015-09-04 19:13:58 -07:00
el.push('a', {});
// 2 changes for arrays (splices & length)
assert.equal(aChanged, 2);
assert.equal(bChanged, 2);
el.unlinkPaths('b');
el.push('a', {});
assert.equal(aChanged, 4);
assert.equal(bChanged, 2);
2015-09-03 21:36:44 -07:00
});
test('link three arrays', function() {
var aChanged = 0;
var bChanged = 0;
var cChanged = 0;
el.a = el.b = el.c = [];
el.linkPaths('b', 'a');
el.linkPaths('c', 'a');
el.aChanged = function() { aChanged++; };
el.bChanged = function() { bChanged++; };
el.cChanged = function() { cChanged++; };
el.push('a', {});
// 2 changes for arrays (splices & length)
assert.equal(aChanged, 2);
assert.equal(bChanged, 2);
assert.equal(cChanged, 2);
2015-09-04 19:13:58 -07:00
el.unlinkPaths('b');
el.push('a', {});
assert.equal(aChanged, 4);
assert.equal(bChanged, 2);
assert.equal(cChanged, 4);
2015-09-03 21:36:44 -07:00
});
test('get from path in deep observer', function() {
el.arrayChanged = nop;
var array = [1, 2, 3];
// Initialize array
el.arrayChangedDeep = function(info) {
assert.strictEqual(el.get(info.path), array);
};
el.array = array;
// Change index 0
el.arrayChangedDeep = function(info) {
assert.strictEqual(el.get(info.path), 99);
};
el.set('array.0', 99);
// Unshift value
el.arrayChangedDeep = function(info) {
if (info.path == 'array.splices') {
assert.strictEqual(el.get(info.path), array.splices);
} else {
assert.strictEqual(el.get(info.path), 4);
}
};
el.unshift('array', 0);
// Change index 0
el.arrayChangedDeep = function(info) {
assert.strictEqual(el.get(info.path), -1);
};
el.set('array.0', -1);
// Verify array contents
arraysEqual(el.array, [-1, 99, 2, 3]);
});
});
suite('malformed observers', function() {
test('has nice message on failure', function() {
var thrown = false;
try {
Polymer({
is: 'x-broken',
observers: ['foo(missingParenthesis']
});
} catch (e) {
assert.equal(e.message, "Malformed observer expression 'foo(missingParenthesis'");
thrown = true;
}
assert.equal(thrown, true, "No exception thrown when parsing malformed observer");
});
});
</script>
</body>
</html>