odoo_source/addons/website/static/lib/MutationObservers/test/attributes.js

/*
 * Copyright 2012 The Polymer Authors. All rights reserved.
 * Use of this source code is governed by a BSD-style
 * license that can be found in the LICENSE file.
 */

suite('JsMutationObserver attributes', function() {

  test('attr', function() {
    var div = document.createElement('div');
    var observer = new JsMutationObserver(function() {});
    observer.observe(div, {
      attributes: true
    });
    div.setAttribute('a', 'A');
    div.setAttribute('a', 'B');

    var records = observer.takeRecords();
    assert.strictEqual(records.length, 2);

    expectRecord(records[0], {
      type: 'attributes',
      target: div,
      attributeName: 'a',
      attributeNamespace: null
    });
    expectRecord(records[1], {
      type: 'attributes',
      target: div,
      attributeName: 'a',
      attributeNamespace: null
    });
  });

  test('attr with oldValue', function() {
    var div = document.createElement('div');
    var observer = new JsMutationObserver(function() {});
    observer.observe(div, {
      attributes: true,
      attributeOldValue: true
    });
    div.setAttribute('a', 'A');
    div.setAttribute('a', 'B');

    var records = observer.takeRecords();
    assert.strictEqual(records.length, 2);

    expectRecord(records[0], {
      type: 'attributes',
      target: div,
      attributeName: 'a',
      attributeNamespace: null,
      oldValue: null
    });
    expectRecord(records[1], {
      type: 'attributes',
      target: div,
      attributeName: 'a',
      attributeNamespace: null,
      oldValue: 'A'
    });
  });

  test('attr change in subtree should not genereate a record', function() {
    var div = document.createElement('div');
    var child = div.appendChild(document.createElement('div'));

    var observer = new JsMutationObserver(function() {});
    observer.observe(div, {
      attributes: true
    });
    child.setAttribute('a', 'A');
    child.setAttribute('a', 'B');

    var records = observer.takeRecords();
    assert.strictEqual(records.length, 0);
  });

  test('attr change, subtree', function() {
    var div = document.createElement('div');
    var child = div.appendChild(document.createElement('div'));

    var observer = new JsMutationObserver(function() {});
    observer.observe(div, {
      attributes: true,
      subtree: true
    });
    child.setAttribute('a', 'A');
    child.setAttribute('a', 'B');

    var records = observer.takeRecords();
    assert.strictEqual(records.length, 2);

    expectRecord(records[0], {
      type: 'attributes',
      target: child,
      attributeName: 'a'
    });
    expectRecord(records[1], {
      type: 'attributes',
      target: child,
      attributeName: 'a'
    });
  });


  test('multiple observers on same target', function() {
    var div = document.createElement('div');
    var observer1 = new JsMutationObserver(function() {});
    observer1.observe(div, {
      attributes: true,
      attributeOldValue: true
    });
    var observer2 = new JsMutationObserver(function() {});
    observer2.observe(div, {
      attributes: true,
      attributeFilter: ['b']
    });

    div.setAttribute('a', 'A');
    div.setAttribute('a', 'A2');
    div.setAttribute('b', 'B');

    var records = observer1.takeRecords();
    assert.strictEqual(records.length, 3);

    expectRecord(records[0], {
      type: 'attributes',
      target: div,
      attributeName: 'a'
    });
    expectRecord(records[1], {
      type: 'attributes',
      target: div,
      attributeName: 'a',
      oldValue: 'A'
    });
    expectRecord(records[2], {
      type: 'attributes',
      target: div,
      attributeName: 'b'
    });

    records = observer2.takeRecords();
    assert.strictEqual(records.length, 1);

    expectRecord(records[0], {
      type: 'attributes',
      target: div,
      attributeName: 'b'
    });
  });

  test('observer observes on different target', function() {
    var div = document.createElement('div');
    var child = div.appendChild(document.createElement('div'));

    var observer = new JsMutationObserver(function() {});
    observer.observe(child, {
      attributes: true
    });
    observer.observe(div, {
      attributes: true,
      subtree: true,
      attributeOldValue: true
    });

    child.setAttribute('a', 'A');
    child.setAttribute('a', 'A2');
    child.setAttribute('b', 'B');

    var records = observer.takeRecords();
    assert.strictEqual(records.length, 3);

    expectRecord(records[0], {
      type: 'attributes',
      target: child,
      attributeName: 'a'
    });
    expectRecord(records[1], {
      type: 'attributes',
      target: child,
      attributeName: 'a',
      oldValue: 'A'
    });
    expectRecord(records[2], {
      type: 'attributes',
      target: child,
      attributeName: 'b'
    });
  });

  test('observing on the same node should update the options', function() {
    var div = document.createElement('div');
    var observer = new JsMutationObserver(function() {});
    observer.observe(div, {
      attributes: true,
      attributeFilter: ['a']
    });
    observer.observe(div, {
      attributes: true,
      attributeFilter: ['b']
    });

    div.setAttribute('a', 'A');
    div.setAttribute('b', 'B');

    var records = observer.takeRecords();
    assert.strictEqual(records.length, 1);

    expectRecord(records[0], {
      type: 'attributes',
      target: div,
      attributeName: 'b'
    });
  });

  test('disconnect should stop all events and empty the records', function() {
    var div = document.createElement('div');
    var observer = new JsMutationObserver(function() {});
    observer.observe(div, {
      attributes: true,
    });

    div.setAttribute('a', 'A');

    observer.disconnect();
    var records = observer.takeRecords();
    assert.strictEqual(records.length, 0);

    div.setAttribute('b', 'B');

    records = observer.takeRecords();
    assert.strictEqual(records.length, 0);
  });

  test('disconnect should not affect other observers', function() {
    var div = document.createElement('div');
    var observer1 = new JsMutationObserver(function() {});
    observer1.observe(div, {
      attributes: true,
    });
    var observer2 = new JsMutationObserver(function() {});
    observer2.observe(div, {
      attributes: true,
    });

    div.setAttribute('a', 'A');

    observer1.disconnect();
    var records1 = observer1.takeRecords();
    assert.strictEqual(records1.length, 0);

    var records2 = observer2.takeRecords();
    assert.strictEqual(records2.length, 1);
    expectRecord(records2[0], {
      type: 'attributes',
      target: div,
      attributeName: 'a'
    });

    div.setAttribute('b', 'B');

    records1 = observer1.takeRecords();
    assert.strictEqual(records1.length, 0);

    records2 = observer2.takeRecords();
    assert.strictEqual(records2.length, 1);
    expectRecord(records2[0], {
      type: 'attributes',
      target: div,
      attributeName: 'b'
    });
  });

});