test/unit/path-effects.html

<!doctype html>
<!--
@license
Copyright (c) 2017 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="path-effects-elements.html">
<body>

<script>

(function() {

// 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;

  setup(function() {
    el = document.createElement('x-stuff');
    document.body.appendChild(el);
  });

  teardown(function() {
    document.body.removeChild(el);
  });

  function verifyObserverOutput(nestingLevel, nested) {
    assert.equal(el.computed, '[' + nested.obj.value + ']');
    assert.equal(el.nestedChanged.callCount, nestingLevel == 0 ? 1 : 0);
    if (nestingLevel == 0) {
      assert.equal(el.nestedChanged.firstCall.args[0], nested);
    }
    assert.equal(el.nestedSubpathChanged.callCount, 1);
    assert.equal(el.nestedObjChanged.callCount, nestingLevel <= 1 ? 1 : 0);
    if (nestingLevel <= 1) {
      assert.equal(el.nestedObjChanged.firstCall.args[0], nested.obj);
    }
    assert.equal(el.nestedObjSubpathChanged.callCount, 1);
    assert.equal(el.nestedObjSubpathChanged.firstCall.args[0].base, nested.obj);
    assert.equal(el.nestedObjValueChanged.callCount, 1);
    assert.equal(el.nestedObjValueChanged.firstCall.args[0], nested.obj.value);
    assert.equal(el.nestedSubpathChanged.callCount, 1);
    assert.equal(el.nestedSubpathChanged.firstCall.args[0].base, nested);
    assert.equal(el.$.compose.computed, '[' + nested.obj.value + ']');
    assert.equal(el.$.compose.objSubpathChanged.callCount, 1);
    assert.equal(el.$.compose.objSubpathChanged.firstCall.args[0].base, nested.obj);
    assert.equal(el.$.compose.objValueChanged.callCount, 1);
    assert.equal(el.$.compose.objValueChanged.firstCall.args[0], nested.obj.value);
    assert.equal(el.$.forward.computed, '[' + nested.obj.value + ']');
    assert.equal(el.$.forward.objSubpathChanged.callCount, 1);
    assert.equal(el.$.forward.objSubpathChanged.firstCall.args[0].base, nested.obj);
    assert.equal(el.$.forward.objValueChanged.callCount, 1);
    assert.equal(el.$.forward.objValueChanged.firstCall.args[0], nested.obj.value);
    assert.equal(el.$.basic.computed, '[' + nested.obj.value + ']');
    assert.equal(el.$.basic.notifyingValue, 42);
    assert.equal(el.$.basic.notifyingValue, 42);
    assert.equal(el.$.compose.$.basic1.computed, '[' + nested.obj.value + ']');
    assert.equal(el.$.compose.$.basic1.notifyingValue, 42);
    assert.equal(el.$.compose.$.basic2.computed, '[' + nested.obj.value + ']');
    assert.equal(el.$.compose.$.basic2.notifyingValue, 42);
    assert.equal(el.$.forward.$.compose.$.basic1.computed, '[' + nested.obj.value + ']');
    assert.equal(el.$.forward.$.compose.$.basic1.notifyingValue, 42);
    assert.equal(el.$.forward.$.compose.$.basic2.computed, '[' + nested.obj.value + ']');
    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');
    switch (nestingLevel) {
      case 0:
        assert.equal(el.nestedSubpathChanged.firstCall.args[0].path, 'nested');
        assert.equal(el.nestedSubpathChanged.firstCall.args[0].value, nested);
        assert.equal(el.nestedObjSubpathChanged.firstCall.args[0].path, 'nested.obj');
        assert.equal(el.nestedObjSubpathChanged.firstCall.args[0].value, nested.obj);
        assert.equal(el.$.compose.objSubpathChanged.firstCall.args[0].path, 'obj');
        assert.equal(el.$.compose.objSubpathChanged.firstCall.args[0].value, nested.obj);
        assert.equal(el.$.forward.objSubpathChanged.firstCall.args[0].path, 'obj');
        assert.equal(el.$.forward.objSubpathChanged.firstCall.args[0].value, nested.obj);
        assert.equal(el.$.forward.$.compose.objSubpathChanged.firstCall.args[0].path, 'obj');
        assert.equal(el.$.forward.$.compose.objSubpathChanged.firstCall.args[0].value, nested.obj);
        break;
      case 1:
        assert.equal(el.nestedSubpathChanged.firstCall.args[0].path, 'nested.obj');
        assert.equal(el.nestedSubpathChanged.firstCall.args[0].value, nested.obj);
        assert.equal(el.nestedObjSubpathChanged.firstCall.args[0].path, 'nested.obj');
        assert.equal(el.nestedObjSubpathChanged.firstCall.args[0].value, nested.obj);
        assert.equal(el.$.compose.objSubpathChanged.firstCall.args[0].path, 'obj');
        assert.equal(el.$.compose.objSubpathChanged.firstCall.args[0].value, nested.obj);
        assert.equal(el.$.forward.objSubpathChanged.firstCall.args[0].path, 'obj');
        assert.equal(el.$.forward.objSubpathChanged.firstCall.args[0].value, nested.obj);
        assert.equal(el.$.forward.$.compose.objSubpathChanged.firstCall.args[0].path, 'obj');
        assert.equal(el.$.forward.$.compose.objSubpathChanged.firstCall.args[0].value, nested.obj);
        break;
      case 2:
        assert.equal(el.nestedSubpathChanged.firstCall.args[0].path, 'nested.obj.value');
        assert.equal(el.nestedSubpathChanged.firstCall.args[0].value, 42);
        assert.equal(el.nestedObjSubpathChanged.firstCall.args[0].path, 'nested.obj.value');
        assert.equal(el.nestedObjSubpathChanged.firstCall.args[0].value, 42);
        assert.equal(el.$.compose.objSubpathChanged.firstCall.args[0].path, 'obj.value');
        assert.equal(el.$.compose.objSubpathChanged.firstCall.args[0].value, 42);
        assert.equal(el.$.forward.objSubpathChanged.firstCall.args[0].path, 'obj.value');
        assert.equal(el.$.forward.objSubpathChanged.firstCall.args[0].value, 42);
        assert.equal(el.$.forward.$.compose.objSubpathChanged.firstCall.args[0].path, 'obj.value');
        assert.equal(el.$.forward.$.compose.objSubpathChanged.firstCall.args[0].value, 42);
        break;
    }
  }

  test('downward data flow', function() {
    // Do the thing
    el.nested = {
      obj: {
        value: 42
      }
    };
    // Verify
    verifyObserverOutput(0, el.nested);
  });

  test('notification from basic element property change', function() {
    // Setup
    el.nested = {
      obj: {
        value: 41
      }
    };
    el.resetObservers();
    // Do the thing
    el.$.basic.notifyingValue = 42;
    // Verify
    verifyObserverOutput(2, el.nested);
  });

  test('notification from composed element property change', function() {
    // Setup
    el.nested = {
      obj: {
        value: 41
      }
    };
    el.resetObservers();
    // Do the thing
    el.$.compose.$.basic1.notifyingValue = 42;
    // Verify
    verifyObserverOutput(2, el.nested);
  });

  test('notification from forward\'s composed element property change', function() {
    // Setup
    el.nested = {
      obj: {
        value: 41
      }
    };
    el.resetObservers();
    // Do the thing
    el.$.forward.$.compose.$.basic1.notifyingValue = 42;
    // Verify
    verifyObserverOutput(2, el.nested);
  });

  test('notification from set in top element', function() {
    // Setup
    el.nested = {
      obj: {
        value: 41
      }
    };
    el.resetObservers();
    // Do the thing
    el.set('nested.obj.value', 42);
    // Verify
    verifyObserverOutput(2, el.nested);
  });

  test('notification from set in composed element', function() {
    // Setup
    el.nested = {
      obj: {
        value: 41
      }
    };
    el.resetObservers();
    // Do the thing
    el.$.compose.set('obj.value', 42);
    // Verify
    verifyObserverOutput(2, el.nested);
  });

  test('notification from set in forward element', function() {
    // Setup
    el.nested = {
      obj: {
        value: 41
      }
    };
    el.resetObservers();
    // Do the thing
    el.$.forward.set('obj.value', 42);
    // Verify
    verifyObserverOutput(2, el.nested);
  });

  test('notification from set in forward\'s composed element', function() {
    // Setup
    el.nested = {
      obj: {
        value: 41
      }
    };
    el.resetObservers();
    // Do the thing
    el.$.forward.$.compose.set('obj.value', 42);
    // Verify
    verifyObserverOutput(2, el.nested);
  });

  test('notification from object change in compose element', function() {
    // Setup
    el.nested = {
      obj: {
        value: 41
      }
    };
    el.resetObservers();
    // Do the thing
    el.$.compose.obj = {
      value: 42
    };
    // Verify
    verifyObserverOutput(1, el.nested);
  });

  test('notification from object change in forward element', function() {
    // Setup
    el.nested = {
      obj: {
        value: 41
      }
    };
    el.resetObservers();
    // Do the thing
    el.$.forward.obj = {
      value: 42
    };
    // Verify
    verifyObserverOutput(1, el.nested);
  });

  test('notification from object change in forward\'s compose element', function() {
    // Setup
    el.nested = {
      obj: {
        value: 41
      }
    };
    el.resetObservers();
    // Do the thing
    // Do the thing
    el.$.forward.$.compose.obj = {
      value: 42
    };
    // Verify
    verifyObserverOutput(1, el.nested);
  });

  test('cached paths get invalidated by object sets', function() {
    el.nested = {obj: { value: 'initial' }};
    assert.equal(el.$.forward.$.compose.$.basic1.notifyingValue, 'initial');
    el.$.forward.$.compose.$.basic1.notifyingValue = 'correct';
    assert.equal(el.$.forward.$.compose.$.basic1.notifyingValue, 'correct');
    el.nested = {obj: { value: 'wrong' }};
    assert.equal(el.$.forward.$.compose.$.basic1.notifyingValue, 'wrong');
    el.set('nested.obj.value', 'correct');
    assert.equal(el.$.forward.$.compose.$.basic1.notifyingValue, 'correct');
  });

  test('similarly named properties', function() {
    var nested = {
      obj: {
        value: 41,
        value2: 99
      }
    };
    el.nested = nested;
    assert.equal(el.$.compose.$.basic1.notifyingValue, 41);
    assert.equal(el.$.compose.$.basic1.othervalue, 99);
    el.set('nested.obj.value', 42);
    assert.equal(el.$.compose.$.basic1.notifyingValue, 42);
    assert.equal(el.$.compose.$.basic1.othervalue, 99);
    el.set('nested.obj.value2', 98);
    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, object last', function() {
    // Setup
    var nested = {
      obj: {
        value: 42
      }
    };
    // Do the thing
    el.setProperties({
      a: 'a',
      b: 'b',
      nested: nested
    });
    // Verify
    assert.equal(el.multipleChanged.callCount, 1);
    assert.equal(el.multipleChanged.firstCall.args[0], 'a');
    assert.equal(el.multipleChanged.firstCall.args[1], 'b');
    assert.equal(el.multipleChanged.firstCall.args[2].path, 'nested.obj');
    assert.equal(el.multipleChanged.firstCall.args[2].value, nested.obj);
    assert.equal(el.multipleChanged.firstCall.args[2].base, nested.obj);
  });

  test('observer with multiple args, object not last', function() {
    // Setup
    var nested = {
      obj: {
        value: 42
      }
    };
    // Do the thing
    el.setProperties({
      a: 'a',
      nested: nested,
      b: 'b'
    });
    // Verify
    assert.equal(el.multipleChanged.callCount, 1);
    assert.equal(el.multipleChanged.firstCall.args[0], 'a');
    assert.equal(el.multipleChanged.firstCall.args[1], 'b');
    assert.equal(el.multipleChanged.firstCall.args[2].path, 'nested.obj');
    assert.equal(el.multipleChanged.firstCall.args[2].value, nested.obj);
    assert.equal(el.multipleChanged.firstCall.args[2].base, nested.obj);
  });

  test('observer with multiple args, object first, then last', function() {
    // Setup
    var nested = {
      obj: {
        value: 42
      }
    };
    el.nested = nested;
    el.resetObservers();
    // Do the thing
    el.setProperties({
      a: 'a',
      b: 'b'
    });
    // Verify
    assert.equal(el.multipleChanged.callCount, 1);
    assert.equal(el.multipleChanged.firstCall.args[0], 'a');
    assert.equal(el.multipleChanged.firstCall.args[1], 'b');
    assert.equal(el.multipleChanged.firstCall.args[2].path, 'nested.obj');
    assert.equal(el.multipleChanged.firstCall.args[2].value, nested.obj);
    assert.equal(el.multipleChanged.firstCall.args[2].base, nested.obj);

    // Do another thing
    el.set('nested.obj.value', 43);
    // Verify
    assert.equal(el.multipleChanged.callCount, 2);
    assert.equal(el.multipleChanged.secondCall.args[0], 'a');
    assert.equal(el.multipleChanged.secondCall.args[1], 'b');
    assert.equal(el.multipleChanged.secondCall.args[2].path, 'nested.obj.value');
    assert.equal(el.multipleChanged.secondCall.args[2].value, 43);
    assert.equal(el.multipleChanged.secondCall.args[2].base, nested.obj);
  });

  test('observer & computed with multiple path args', function() {
    // Setup
    var nested = {
      b: 33,
      obj: {
        c: 66
      }
    };
    var a = 1;
    // Do the thing
    el.setProperties({
      a: a,
      nested: nested
    })
    // Verify
    assert.equal(el.multiplePathsChanged.callCount, 1);
    assert.equal(el.multiplePathsChanged.firstCall.args[0], 1);
    assert.equal(el.multiplePathsChanged.firstCall.args[1], 33);
    assert.equal(el.multiplePathsChanged.firstCall.args[2], 66);
    assert.equal(el.computedFromPaths, 100);
    assert.equal(el.$.boundChild.computedFromPaths, 100);

    el.set('a', a + 10);
    assert.equal(el.$.boundChild.computedFromPaths, 110);

    el.set('nested.b', nested.b + 10);
    assert.equal(el.$.boundChild.computedFromPaths, 120);

    el.set('nested.obj.c', nested.obj.c + 10);
    assert.equal(el.$.boundChild.computedFromPaths, 130);
  });

  test('array.splices notified', function() {
    el.arrayNoColl = [];
    assert.equal(el.arrayNoCollChanged.callCount, 1);
    el.push('arrayNoColl', 1, 2, 3);
    assert.equal(el.arrayNoCollChanged.callCount, 2);
    el.push('arrayNoColl', 4, 5, 6);
    assert.equal(el.arrayNoCollChanged.callCount, 3);
  });

  test('ensure splices sent into userland dont get nulled', function(){
    el.array = [];
    el.push('array', 1, 2, 3);
    assert.notEqual(el.arraySplices.indexSplices, null);
  });

  test('array.splices notified, multiple args, prop first', function() {
    var array = [];
    el.setProperties({
      array: array,
      prop: 'first'
    });
    assert.equal(el.arrayOrPropChanged.callCount, 1);
    el.push('array', 1, 2, 3);
    assert.equal(el.arrayOrPropChanged.callCount, 2);
    el.push('array', 4, 5, 6);
    assert.equal(el.arrayOrPropChanged.callCount, 3);
  });

  test('array.splices notified, multiple args, prop last', function() {
    el.array = [];
    el.push('array', 1, 2, 3);
    el.prop = 'last';
    // Twice for array (.splices & .length), once for prop
    assert.equal(el.arrayOrPropChanged.callCount, 3);
  });

  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);
    el.unshift('data', 4, 5);
    el.unshift('data', 6, 7, 8);
    assert.equal(el.$.boundChild.arrayLength, el.data.length);
    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);
  });

  test('get', function() {
    el.simple = 11;
    el.nested = {
      again: {
        again: {
          wayOverThere: 99
        },
        there: 55
      },
      here: 42
    };
    assert.equal(el.get('simple'), 11);
    assert.equal(el.get('nested'), el.nested);
    assert.equal(el.get('nested.here'), 42);
    assert.equal(el.get(['nested', 'again']), el.nested.again);
    assert.equal(el.get('nested.again.there'), 55);
    assert.equal(el.get('nested.again.again'), el.nested.again.again);
    assert.equal(el.get(['nested', 'again.again', 'wayOverThere']), 99);
  });

  test('set', function() {
    el.set('simple', 11);
    el.set('nested', {});
    el.set('nested.here', 42);
    el.set(['nested', 'again'], {});
    el.set('nested.again.there', 55);
    el.set('nested.again.again', {});
    el.set(['nested', 'again.again', 'wayOverThere'], 99);
    el.set(['again.thereToo'], 111, el.nested.again);
    assert.equal(el.simple, 11);
    assert.equal(el.get('simple'), 11);
    assert.equal(el.get('nested'), el.nested);
    assert.equal(el.nested.here, 42);
    assert.equal(el.get('nested.here'), 42);
    assert.equal(el.get('nested.again'), el.nested.again);
    assert.equal(el.nested.again.there, 55);
    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);
    assert.equal(el.get('nested.again.again.wayOverThere'), 99);
    assert.equal(el.nested.again.again.thereToo, 111);
    assert.equal(el.get('nested.again.again.thereToo'), 111);
  });

  test('notifyPath basic', function() {
    el.a = {b: {c: 0}};
    el.resetObservers();
    el.a.b.c = 55;
    el.notifyPath('a.b.c');
    assert.isTrue(el.aChanged.calledOnce);
    assert.equal(el.aChanged.firstCall.args[0].path, 'a.b.c');
    assert.equal(el.aChanged.firstCall.args[0].value, 55);
    assert.equal(el.get('a.b.c'), 55);
  });

  test('notifyPath with array path argument', function() {
    el.a = {b: {c: 0}};
    el.resetObservers();
    el.a.b.c = 56;
    el.notifyPath(['a', 'b.c']);
    assert.isTrue(el.aChanged.calledOnce);
    assert.equal(el.aChanged.firstCall.args[0].path, 'a.b.c');
    assert.equal(el.aChanged.firstCall.args[0].value, 56);
    assert.equal(el.get('a.b.c'), 56);
  });

  test('notifyPath with value argument', function() {
    el.a = {b: {c: 0}};
    el.resetObservers();
    el.a.b.c = 57;
    el.notifyPath('a.b.c', 57);
    assert.isTrue(el.aChanged.calledOnce);
    assert.equal(el.aChanged.firstCall.args[0].path, 'a.b.c');
    assert.equal(el.aChanged.firstCall.args[0].value, 57);
    assert.equal(el.get('a.b.c'), 57);
  });

  test('notifyPath with value argument and array path argument', function() {
    el.a = {b: {c: 0}};
    el.resetObservers();
    el.a.b.c = 57;
    el.notifyPath(['a', 'b.c'], 57);
    assert.isTrue(el.aChanged.calledOnce);
    assert.equal(el.aChanged.firstCall.args[0].path, 'a.b.c');
    assert.equal(el.aChanged.firstCall.args[0].value, 57);
    assert.equal(el.get('a.b.c'), 57);
  });

  test('notifyPath a non-extistant does nothing', function() {
    el.notifyPath('does.not.exist', true);
  });

  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.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.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.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);
  });

  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.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.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.array.0'), 91);
    assert.equal(el.get('array.array.1'), 92);
    assert.equal(el.get('array.array.2'), 93);
    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);
  });

  var nop = function() {};

  test('push array', function() {
    el.arrayChanged = nop;
    el.array = ['orig1', 'orig2', 'orig3'];
    // 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);
    };
    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'];
    // 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');
    };
    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'];
    // 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);
    };
    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'];
    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');
    };
    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;
    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');
    };
    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'];
    el.arrayChanged = function() {
      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 = [];
    el.arrayChanged = function() {
      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'];
    el.arrayChanged = function() {
      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 = [];
    el.arrayChanged = function() {
      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'];
    el.arrayChanged = function() {
      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;
    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');
    };
    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;
    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');
    };
    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');
  });

  test('link two objects', function() {
    el.x = el.y = {};
    el.linkPaths('y', 'x');
    el.xChanged = sinon.spy();
    el.yChanged = sinon.spy();
    el.set('x.foo', 1);
    assert.equal(el.xChanged.callCount, 1);
    assert.equal(el.yChanged.callCount, 1);
    el.unlinkPaths('y');
    el.set('x.foo', 2);
    assert.equal(el.xChanged.callCount, 2);
    assert.equal(el.yChanged.callCount, 1);
  });

  test('link three objects', function() {
    el.x = el.y = el.a = {};
    el.linkPaths('y', 'x');
    el.linkPaths('a', 'x');
    el.xChanged = sinon.spy();
    el.yChanged = sinon.spy();
    el.aChanged = sinon.spy();
    el.set('x.foo', 1);
    assert.equal(el.xChanged.callCount, 1);
    assert.equal(el.yChanged.callCount, 1);
    assert.equal(el.aChanged.callCount, 1);
    el.set('a.foo', 2);
    assert.equal(el.xChanged.callCount, 2);
    assert.equal(el.yChanged.callCount, 2);
    assert.equal(el.aChanged.callCount, 2);
    el.unlinkPaths('y');
    el.set('a.foo', 3);
    assert.equal(el.xChanged.callCount, 3);
    assert.equal(el.yChanged.callCount, 2);
    assert.equal(el.aChanged.callCount, 3);
  });

  test('multiple linked dependencies to computed property', function() {
    let linkedObj = {prop: 'Linked'};
    el.computeFromLinkedPaths.reset();
    el.setProperties({
      linked1: linkedObj,
      linked2: linkedObj,
      a: 'A'
    });
    assert.equal(el.computeFromLinkedPaths.callCount, 1);
    assert.equal(el.computedFromLinkedPaths, 'ALinkedLinked');

    el.linkPaths('linked1', 'linked2');
    el.set('linked1.prop', 'Linked+');
    assert.equal(el.computeFromLinkedPaths.callCount, 2);
    assert.equal(el.computedFromLinkedPaths, 'ALinked+Linked+');
    el.linked3 = el.linked2;
    el.linkPaths('linked2', 'linked3');
    el.set('linked3.prop', 'Linked++');
    assert.equal(el.computeFromLinkedPaths.callCount, 3);
    assert.equal(el.computedFromLinkedPaths, 'ALinked++Linked++');
    el.set('linked2.prop', 'Linked+++');
    assert.equal(el.computeFromLinkedPaths.callCount, 4);
    assert.equal(el.computedFromLinkedPaths, 'ALinked+++Linked+++');
    el.set('linked1.prop', 'Linked++++');
    assert.equal(el.computeFromLinkedPaths.callCount, 5);
    assert.equal(el.computedFromLinkedPaths, 'ALinked++++Linked++++');

    el.linked4 = el.linked1;
    el.linkPaths('linked4', 'linked1');
    el.set('linked4.prop', 'Linked+++++');
    assert.equal(el.computeFromLinkedPaths.callCount, 6);
    assert.equal(el.computedFromLinkedPaths, 'ALinked+++++Linked+++++');
    el.set('linked3.prop', 'Linked++++++');
    assert.equal(el.computeFromLinkedPaths.callCount, 7);
    assert.equal(el.computedFromLinkedPaths, 'ALinked++++++Linked++++++');
    el.set('linked2.prop', 'Linked+++++++');
    assert.equal(el.computeFromLinkedPaths.callCount, 8);
    assert.equal(el.computedFromLinkedPaths, 'ALinked+++++++Linked+++++++');
    el.set('linked1.prop', 'Linked++++++++');
    assert.equal(el.computeFromLinkedPaths.callCount, 9);
    assert.equal(el.computedFromLinkedPaths, 'ALinked++++++++Linked++++++++');

    el.linked5 = el.linked3;
    el.linkPaths('linked5', 'linked3');
    el.set('linked4.prop', 'Linked+++++++++');
    assert.equal(el.computeFromLinkedPaths.callCount, 10);
    assert.equal(el.computedFromLinkedPaths, 'ALinked+++++++++Linked+++++++++');
    el.set('linked3.prop', 'Linked++++++++++');
    assert.equal(el.computeFromLinkedPaths.callCount, 11);
    assert.equal(el.computedFromLinkedPaths, 'ALinked++++++++++Linked++++++++++');
    el.set('linked2.prop', 'Linked+++++++++++');
    assert.equal(el.computeFromLinkedPaths.callCount, 12);
    assert.equal(el.computedFromLinkedPaths, 'ALinked+++++++++++Linked+++++++++++');
    el.set('linked1.prop', 'Linked++++++++++++');
    assert.equal(el.computeFromLinkedPaths.callCount, 13);
    assert.equal(el.computedFromLinkedPaths, 'ALinked++++++++++++Linked++++++++++++');

    el.unlinkPaths('linked4');
    el.set('linked4.prop', 'Linked+++++++++++++');
    assert.equal(el.computeFromLinkedPaths.callCount, 13);
    assert.equal(el.computedFromLinkedPaths, 'ALinked++++++++++++Linked++++++++++++');
  });

  test('link two arrays', function() {
    el.x = el.y = [];
    el.linkPaths('y', 'x');
    el.xChanged = sinon.spy();
    el.yChanged = sinon.spy();
    el.push('x', {});
    // 2 changes for arrays (splices & length)
    assert.equal(el.xChanged.callCount, 2);
    assert.equal(el.yChanged.callCount, 2);
    el.unlinkPaths('y');
    el.push('x', {});
    assert.equal(el.xChanged.callCount, 4);
    assert.equal(el.yChanged.callCount, 2);
  });

  test('link three arrays', function() {
    el.x = el.y = el.a = [];
    el.linkPaths('y', 'x');
    el.linkPaths('a', 'x');
    el.xChanged = sinon.spy();
    el.yChanged = sinon.spy();
    el.aChanged = sinon.spy();
    el.push('x', {});
    // 2 changes for arrays (splices & length)
    assert.equal(el.xChanged.callCount, 2);
    assert.equal(el.yChanged.callCount, 2);
    assert.equal(el.aChanged.callCount, 2);
    el.unlinkPaths('y');
    el.push('x', {});
    assert.equal(el.xChanged.callCount, 4);
    assert.equal(el.yChanged.callCount, 2);
    assert.equal(el.aChanged.callCount, 4);
  });

  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('corner cases', function() {

  test('malformed observer has nice message on failure', function() {
    var thrown = false;
    var verifyError = function(e) {
      assert.equal(e.message, "Malformed observer expression 'foo(missingParenthesis'");
      thrown = true;
    }
    try {
      Polymer({
        is: 'x-broken',
        observers: ['foo(missingParenthesis']
      }).finalize();
    } catch (e) {
      verifyError(e);
    }

    assert.equal(thrown, true, "No exception thrown when parsing malformed observer");
  });

  test('reentry during path processing', function() {
    let host = document.createElement('x-reentry-host');
    document.body.appendChild(host);
    assert.equal(host.objChanged.callCount, 1);
    assert.equal(host.obj.prop, 0);
    host.set('obj.prop', host.obj.prop+1);
    assert.equal(host.objChanged.callCount, 2);
    assert.equal(host.objChanged.secondCall.args[0].path, 'obj.prop');
    assert.equal(host.objChanged.secondCall.args[0].value, 1);
  });

  test('element without notify effects still notifies paths (1.x guarantee)', function() {
    let host = document.createElement('x-path-host');
    let listener = sinon.spy();
    host.addEventListener('obj-changed', listener);
    document.body.appendChild(host);
    assert.equal(host.objChanged.callCount, 1);
    assert.equal(host.obj.prop, 0);
    assert.equal(listener.callCount, 0);
    host.$.client.set('obj.prop', host.obj.prop+1);
    assert.equal(host.objChanged.callCount, 2);
    assert.equal(host.objChanged.secondCall.args[0].path, 'obj.prop');
    assert.equal(host.objChanged.secondCall.args[0].value, 1);
    assert.equal(listener.callCount, 1);
    assert.equal(listener.firstCall.args[0].detail.path, 'obj.prop');
    assert.equal(listener.firstCall.args[0].detail.value, 1);
  });

});


})();

</script>

</body>
</html>