<!DOCTYPE html>
<script src="../../../resources/js-test-pre.js"></script>
<script>

window.jsTestIsAsync = true;
var mutations, mutations2, mutationsWithOldValue;
var calls;
var div;

function testBasic() {
    var div;
    var observer;

    function start() {
        debug('Testing basic aspects of attribute observation.');

        mutations = null;
        div = document.createElement('div');
        div.setAttribute('bar', 'foo');

        observer = new MutationObserver(function(m) {
            mutations = m;
        });

        observer.observe(div, { attributes: true, characterData: true });
        div.setAttribute('foo', 'bar');
        div.removeAttribute('bar');
        setTimeout(checkDisconnectAndMutate, 0);
    }

    function checkDisconnectAndMutate() {
        debug('...can attribute changes be observed at all');

        shouldBe('mutations.length', '2');
        shouldBe('mutations[0].type', '"attributes"');
        shouldBe('mutations[0].attributeName', '"foo"');
        shouldBe('mutations[0].attributeNamespace', 'null');
        shouldBe('mutations[1].type', '"attributes"');
        shouldBe('mutations[1].attributeName', '"bar"');
        shouldBe('mutations[1].attributeNamespace', 'null');

        mutations = null;
        observer.disconnect();
        div.setAttribute('foo', 'baz');
        setTimeout(checkNotDeliveredAndMutateMultiple, 0);
    }

    function checkNotDeliveredAndMutateMultiple() {
        debug('...observer.disconnect() should prevent further delivery of mutations.');

        shouldBe('mutations', 'null');
        observer.observe(div, { attributes: true });
        div.setAttribute('foo', 'bat');
        div.setAttribute('bar', 'foo');
        setTimeout(finish);
    }

    function finish() {
        debug('...re-observing after disconnect works with the same observer.');

        shouldBe('mutations.length', '2');
        shouldBe('mutations[0].type', '"attributes"');
        shouldBe('mutations[0].attributeName', '"foo"');
        shouldBe('mutations[0].attributeNamespace', 'null');
        shouldBe('mutations[1].type', '"attributes"');
        shouldBe('mutations[1].attributeName', '"bar"');
        shouldBe('mutations[1].attributeNamespace', 'null');
        observer.disconnect();
        debug('');
        runNextTest();
    }

    start();
}

function testWrongType() {
    var div;
    var observer;

    function start() {
        debug('Testing that observing without specifying "attributes" does not result in hearing about attribute changes.');

        mutations = null;
        div = document.createElement('div');
        observer = new MutationObserver(function(m) {
            mutations = m;
        });

        observer.observe(div, { childList: true, characterData: true });
        div.setAttribute('foo', 'bar');
        setTimeout(finish, 0);
    }

    function finish() {
        shouldBe('mutations', 'null');
        observer.disconnect();
        debug('');
        runNextTest();
    }

    start();
}

function testMultipleRegistration() {
    var div;
    var observer;

    function start() {
        debug('Testing that re-observing the same node with the same observer has the effect of resetting the options.');

		calls = 0;
        mutations = null;
        div = document.createElement('div');
        observer = new MutationObserver(function(m) {
            mutations = m;
			calls++;
        });

        observer.observe(div, { attributes: true, characterData: true });
        observer.observe(div, { attributes: true });
        div.setAttribute('foo', 'bar');
        setTimeout(checkDisconnectAndMutate, 0);
    }

    function checkDisconnectAndMutate() {
        shouldBe('calls', '1');
        shouldBe('mutations.length', '1');
        shouldBe('mutations[0].type', '"attributes"');
        shouldBe('mutations[0].attributeName', '"foo"');
        mutations = null;
        observer.observe(div, { attributes: true, characterData: true });
        observer.observe(div, { childList: true });
        div.setAttribute('foo', 'baz');
        setTimeout(finish, 0);
    }

    function finish() {
        shouldBe('mutations', 'null');
        observer.disconnect();
        debug('');
        runNextTest();
    }

    start();
}

function testMultipleObservers() {
    var div;
    var observer;
    var observer2;

    function start() {
        debug('Testing that multiple observers can be registered to a given node and both receive mutations.');
        mutations = null;
        div = document.createElement('div');
        observer = new MutationObserver(function(m) {
            mutations = m;
        });
        observer2 = new MutationObserver(function(m) {
            mutations2 = m;
        });
        observer.observe(div, { attributes: true });
        observer2.observe(div, { attributes: true });
        div.setAttribute('foo', 'bar');
        setTimeout(finish, 0);
    }

    function finish() {
        shouldBe('mutations.length', '1');
        shouldBe('mutations[0].type', '"attributes"');
        shouldBe('mutations[0].attributeName', '"foo"');
        shouldBe('mutations2.length', '1');
        shouldBe('mutations2[0].type', '"attributes"');
        shouldBe('mutations2[0].attributeName', '"foo"');
        observer.disconnect();
        observer2.disconnect();
        debug('');
        runNextTest();
    }

    start();
}

function testNamespaceURI() {
    var div;
    var observer;

    function start() {
        debug('Testing that "attributeNamespace" value is delivered properly.');
        mutations = null;
        div = document.createElement('div');
        observer = new MutationObserver(function(m) {
            mutations = m;
        });

        observer.observe(div, { attributes: true, childList: true });
        div.setAttributeNS('http://www.foo.com/bar', 'foo', 'bar');
        setTimeout(finish, 0);    
    }

    function finish() {
        shouldBe('mutations.length', '1');
        shouldBe('mutations[0].type', '"attributes"');
        shouldBe('mutations[0].attributeName', '"foo"');
        shouldBe('mutations[0].attributeNamespace', '"http://www.foo.com/bar"');        
        observer.disconnect();
        debug('');
        runNextTest();
    }

    start();
}

function testPropertyAccess() {
    var img, a;
    var observer;

    function start() {
        debug('Testing that modifications to node properties which delegate to attribute storage deliver mutations.');
        mutations = null;
        img = document.createElement('img');
        a = document.createElement('a');

        observer = new MutationObserver(function(m) {
            mutations = m;
        });

        observer.observe(img, { attributes: true });
        observer.observe(a, { attributes: true });

        img.src = 'baz.png';
        a.href = 'foo.html';

        setTimeout(finish, 0);
    }

    function finish() {
        shouldBe('mutations.length', '2');
        shouldBe('mutations[0].type', '"attributes"');
        shouldBe('mutations[0].attributeName', '"src"');
        shouldBe('mutations[1].type', '"attributes"');
        shouldBe('mutations[1].attributeName', '"href"');
        observer.disconnect();
        debug('');
        runNextTest();
    }

    start();
}

function testOrderingWrtDOMSubtreeModified() {
    var div, div2, subDiv;
    var observer;
    var listener;

    function start() {
        debug('Testing mutation records are enqueued for attributes before DOMSubtreeModified is dispatched.');

        mutations = null;
        div = document.body.appendChild(document.createElement('div'));
        div2 = document.body.appendChild(document.createElement('div'));

        subDiv = div.appendChild(document.createElement('div'));

        observer = new MutationObserver(function(m) {
            mutations = m;
        });

        listener = function(e) {
            div2.setAttribute('baz', 'bat');
        }

        div.addEventListener('DOMSubtreeModified', listener);
        observer.observe(subDiv, { attributes: true });
        observer.observe(div2, { attributes: true });

        subDiv.setAttribute('foo', 'bar');

        setTimeout(finish, 0);
    }

    function finish() {
        shouldBe('mutations.length', '2');
        shouldBe('mutations[0].type', '"attributes"');
        shouldBe('mutations[0].attributeName', '"foo"');
        shouldBe('mutations[1].type', '"attributes"');
        shouldBe('mutations[1].attributeName', '"baz"');
        div.removeEventListener('DOMSubtreeModified', listener);
        document.body.removeChild(div);
        observer.disconnect();
        debug('');
        runNextTest();
    }

    start();
}

function testOldValue() {
    var div;
    var observer;

    function start() {
        debug('Testing basic oldValue delivery.');
        mutations = null;
        div = document.createElement('div');
        div.setAttribute('bar', 'boo');
        
        observer = new MutationObserver(function(mutations) {
            window.mutations = mutations;
        });
        observer.observe(div, { attributes: true, attributeOldValue: true });
        div.setAttribute('foo', 'bar');
        div.setAttribute('foo', 'baz');
        div.removeAttribute('bar');
        div.removeAttribute('non-existant');
        setTimeout(finish, 0);
    }

    function finish() {
        shouldBe('mutations.length', '3');
        shouldBe('mutations[0].type', '"attributes"');
        shouldBe('mutations[0].attributeName', '"foo"');
        shouldBe('mutations[0].oldValue', 'null');
        shouldBe('mutations[1].type', '"attributes"');
        shouldBe('mutations[1].attributeName', '"foo"');
        shouldBe('mutations[1].oldValue', '"bar"');
        shouldBe('mutations[2].type', '"attributes"');
        shouldBe('mutations[2].attributeName', '"bar"');
        shouldBe('mutations[2].oldValue', '"boo"');
        observer.disconnect();
        debug('');
        runNextTest();
    }

    start();
}

function testOldValueAsRequested() {
    var div;
    var observerWithOldValue;
    var observer;

    function start() {
        debug('Testing that oldValue is delivered as requested (or not).');
        mutationsWithOldValue = null;
        mutations = null;
        div = document.createElement('div');
        div.setAttribute('foo', 'bar');
        observerWithOldValue = new MutationObserver(function(mutations) {
            window.mutationsWithOldValue = mutations;
        });
        observer = new MutationObserver(function(mutations) {
            window.mutations = mutations;
        });
        observerWithOldValue.observe(div, { attributes: true, attributeOldValue: true });
        observer.observe(div, { attributes: true });
        div.setAttribute('foo', 'baz');
        setTimeout(finish, 0);
    }

    function finish() {
        shouldBe('mutationsWithOldValue.length', '1');
        shouldBe('mutationsWithOldValue[0].type', '"attributes"');
        shouldBe('mutationsWithOldValue[0].attributeName', '"foo"');
        shouldBe('mutationsWithOldValue[0].oldValue', '"bar"');
        shouldBe('mutations.length', '1');
        shouldBe('mutations[0].type', '"attributes"');
        shouldBe('mutations[0].attributeName', '"foo"');
        shouldBe('mutations[0].oldValue', 'null');
        observerWithOldValue.disconnect();
        observer.disconnect();
        debug('');
        runNextTest();
    }

    start();
}

function testOldValueUnionMultipleObservations() {
    var div;
    var span;
    var observer;

    function start() {
        debug('An observer with multiple observations will get attributeOldValue if any entries request it.');
        mutations = null;
        div = document.createElement('div');
        span = div.appendChild(document.createElement('span'));
        span.setAttribute('foo', 'bar');
        observer = new MutationObserver(function(mutations) {
            window.mutations = mutations;
        });
        observer.observe(div, { attributes: true, attributeOldValue: true, subtree: true });
        observer.observe(span, { attributes: true });
        span.setAttribute('foo', 'baz');
        setTimeout(finish, 0);
    }

    function finish() {
        shouldBe('mutations.length', '1');
        shouldBe('mutations[0].type', '"attributes"');
        shouldBe('mutations[0].attributeName', '"foo"');
        shouldBe('mutations[0].oldValue', '"bar"');
        observer.disconnect();
        debug('');
        runNextTest();
    }

    start();
}

function testIDLAttribute() {
    var div;
    var observer;

    function start() {
        debug('Testing setting an attribute via reflected IDL attribute.');
        mutations = null;
        div = document.createElement('div');
        observer = new MutationObserver(function(mutations) {
            window.mutations = mutations;
        });
        observer.observe(div, { attributes: true, attributeOldValue: true });
        div.id = 'foo';
        div.id = 'bar';
        div.id = null;
        setTimeout(finish, 0);
    }

    function finish() {
        shouldBe('mutations.length', '3');
        shouldBe('mutations[0].type', '"attributes"');
        shouldBe('mutations[0].attributeName', '"id"');
        shouldBe('mutations[0].oldValue', 'null');
        shouldBe('mutations[1].type', '"attributes"');
        shouldBe('mutations[1].attributeName', '"id"');
        shouldBe('mutations[1].oldValue', '"foo"');
        shouldBe('mutations[2].type', '"attributes"');
        shouldBe('mutations[2].attributeName', '"id"');
        shouldBe('mutations[2].oldValue', '"bar"');
        observer.disconnect();
        debug('');
        runNextTest();
    }

    start();
}

function testAttributeFilter() {
    var div, path;
    var observer;

    function start() {
        debug('Testing that attributeFilter works as expected and observes case with HTML elements.');

        mutations = null;
        observer = new MutationObserver(function(m) {
            mutations = m;
        });

        div = document.createElement('div');
        observer.observe(div, { attributes: true, attributeFilter: ['foo', 'bar', 'booM'] });
        div.setAttribute('foo', 'foo');
        div.setAttribute('bar', 'bar');
        div.setAttribute('baz', 'baz');
        div.setAttribute('BOOm', 'boom');

        setTimeout(finish, 0);
    }

    function finish() {
        debug('...only foo and bar should be received.');

        shouldBe('mutations.length', '2');
        shouldBe('mutations[0].type', '"attributes"');
        shouldBe('mutations[0].attributeName', '"foo"');
        shouldBe('mutations[0].attributeNamespace', 'null');
        shouldBe('mutations[1].type', '"attributes"');
        shouldBe('mutations[1].attributeName', '"bar"');
        shouldBe('mutations[1].attributeNamespace', 'null');
        observer.disconnect();
        debug('');
        runNextTest();
    }

    start();
}

function testAttributeFilterSubtree() {
    var div, div2, div3;
    var observer;

    function start() {
        debug('Testing the behavior of attributeFilter when the same observer observes at multiple nodes in a subtree with different filter options.');

        mutations = null;
        observer = new MutationObserver(function(m) {
            mutations = m;
        });

        div = document.createElement('div');
        div2 = div.appendChild(document.createElement('div'));
        div3 = div2.appendChild(document.createElement('div'));

        observer.observe(div, { attributes: true, subtree: true, attributeFilter: ['foo', 'bar'] });
        observer.observe(div2, { attributes: true, subtree: true, attributeFilter: ['bar', 'bat'] });

        div3.setAttribute('foo', 'foo');
        div3.setAttribute('bar', 'bar');
        div3.setAttribute('bat', 'bat');
        div3.setAttribute('baz', 'baz');

        setTimeout(checkAndObserveAll, 0);
    }

    function checkAndObserveAll() {
        debug('...only foo, bar & bat should be received.');

        shouldBe('mutations.length', '3');
        shouldBe('mutations[0].type', '"attributes"');
        shouldBe('mutations[0].attributeName', '"foo"');
        shouldBe('mutations[0].attributeNamespace', 'null');
        shouldBe('mutations[1].type', '"attributes"');
        shouldBe('mutations[1].attributeName', '"bar"');
        shouldBe('mutations[1].attributeNamespace', 'null');
        shouldBe('mutations[2].type', '"attributes"');
        shouldBe('mutations[2].attributeName', '"bat"');
        shouldBe('mutations[2].attributeNamespace', 'null');

        observer.observe(div2, { attributes: true, subtree: true });
        div3.setAttribute('bar', 'bar');
        div3.setAttribute('bat', 'bat');
        div3.setAttribute('baz', 'baz');

        setTimeout(finish, 0);
    }

    function finish() {
        debug('...bar, bat & baz should all be received.');

        shouldBe('mutations.length', '3');
        shouldBe('mutations[0].type', '"attributes"');
        shouldBe('mutations[0].attributeName', '"bar"');
        shouldBe('mutations[0].attributeNamespace', 'null');
        shouldBe('mutations[1].type', '"attributes"');
        shouldBe('mutations[1].attributeName', '"bat"');
        shouldBe('mutations[1].attributeNamespace', 'null');
        shouldBe('mutations[2].type', '"attributes"');
        shouldBe('mutations[2].attributeName', '"baz"');
        shouldBe('mutations[2].attributeNamespace', 'null');

        observer.disconnect();
        debug('');
        runNextTest();
    }

    start();
}

function testAttributeFilterNonHTMLElement() {
    var path;
    var observer;

    function start() {
        debug('Testing that setting an attributeFilter filters out namespaced attributes.');

        mutations = null;
        observer = new MutationObserver(function(m) {
            mutations = m;
        });

        path = document.createElementNS('http://www.w3.org/2000/svg', 'path');
        observer.observe(path, { attributes: true, attributeFilter: ['pathLength'] });
        path.setAttributeNS('http://www.w3.org/2000/svg', 'pathLength', '200');

        setTimeout(finish, 0);
    }

    function finish() {
        debug('...pathLength should not be received.');

        shouldBeNull('mutations');
        observer.disconnect();
        debug('');
        runNextTest();
    }

    start();
}

function testAttributeFilterNonHTMLDocument() {
    var svgDoc, div, path;
    var observer;

    function start() {
        debug('Testing that attributeFilter respects case with non-HTML elements.');

        svgDoc = document.implementation.createDocument('http://www.w3.org/2000/svg', 'svg', null);
        mutations = null;
        observer = new MutationObserver(function(m) {
            mutations = m;
        });

        div = svgDoc.createElement('div');
        observer.observe(div, { attributes: true, attributeFilter: ['ID', 'id', 'booM'] });
        div.setAttribute('ID', 'ID');
        div.setAttribute('id', 'id');
        div.setAttribute('baz', 'baz');
        div.setAttribute('booM', 'boom');
        div.setAttribute('BOOm', 'boom');

        setTimeout(finish, 0);
    }

    function finish() {
        debug('...only ID, id, booM should be received.');

        shouldBe('mutations.length', '3');
        shouldBe('mutations[0].type', '"attributes"');
        shouldBe('mutations[0].attributeName', '"ID"');
        shouldBe('mutations[0].attributeNamespace', 'null');
        shouldBe('mutations[1].type', '"attributes"');
        shouldBe('mutations[1].attributeName', '"id"');
        shouldBe('mutations[1].attributeNamespace', 'null');
        shouldBe('mutations[2].type', '"attributes"');
        shouldBe('mutations[2].attributeName', '"booM"');
        shouldBe('mutations[2].attributeNamespace', 'null');

        observer.disconnect();
        debug('');
        runNextTest();
    }

    start();
}

function testStyleAttributePropertyAccess() {
    var div, path;
    var observer;

    function start() {
        debug('Testing that modifying an elements style property dispatches Mutation Records.');

        mutations = null;
        observer = new MutationObserver(function(m) {
            mutations = m;
        });

        div = document.createElement('div');
        div.setAttribute('style', 'color: yellow; width: 100px;');
        observer.observe(div, { attributes: true });
        div.style.color = 'red';
        div.style.width = '200px';
        div.style.color = 'blue';

        setTimeout(checkAndContinue, 0);
    }

    function checkAndContinue() {
        shouldBe('mutations.length', '3');
        shouldBe('mutations[0].type', '"attributes"');
        shouldBe('mutations[0].attributeName', '"style"');
        shouldBe('mutations[0].oldValue', 'null');
        shouldBe('mutations[1].type', '"attributes"');
        shouldBe('mutations[1].attributeName', '"style"');
        shouldBe('mutations[1].oldValue', 'null');
        shouldBe('mutations[2].type', '"attributes"');
        shouldBe('mutations[2].attributeName', '"style"');
        shouldBe('mutations[2].oldValue', 'null');

        mutations = null;
        div.getAttribute('style');
        setTimeout(finish, 0);
    }

    function finish() {
        debug('...mutation record created.');

        shouldBe('mutations', 'null');

        observer.disconnect();
        debug('');
        runNextTest();
    }

    start();
}

function testStyleAttributePropertyAccessOldValue() {
    var div, path;
    var observer;

    function start() {
        debug('Testing that modifying an elements style property dispatches Mutation Records with correct oldValues.');

        mutations = null;
        observer = new MutationObserver(function(m) {
            mutations = m;
        });

        div = document.createElement('div');
        div.setAttribute('style', 'color: yellow; width: 100px;');
        observer.observe(div, { attributes: true, attributeOldValue: true });
        div.style.color = 'red';
        div.style.width = '200px';
        div.style.color = 'blue';

        setTimeout(checkAndContinue, 0);
    }

    function checkAndContinue() {
        shouldBe('mutations.length', '3');
        shouldBe('mutations[0].type', '"attributes"');
        shouldBe('mutations[0].attributeName', '"style"');
        shouldBe('mutations[0].oldValue', '"color: yellow; width: 100px;"');
        shouldBe('mutations[1].type', '"attributes"');
        shouldBe('mutations[1].attributeName', '"style"');
        shouldBe('mutations[1].oldValue', '"color: red; width: 100px;"');
        shouldBe('mutations[2].type', '"attributes"');
        shouldBe('mutations[2].attributeName', '"style"');
        shouldBe('mutations[2].oldValue', '"color: red; width: 200px;"');

        mutations = null;
        div.getAttribute('style');
        setTimeout(finish, 0);
    }

    function finish() {
        debug('...mutation record created.');

        shouldBe('mutations', 'null');

        observer.disconnect();
        debug('');
        runNextTest();
    }

    start();
}

function testStyleAttributePropertyAccessIgnoreNoop() {
    var div, path;
    var observer;

    function start() {
        debug('Testing that a no-op style property mutation does not create Mutation Records.');

        mutations = null;
        observer = new MutationObserver(function(m) {
            mutations = m;
        });

        div = document.createElement('div');
        div.setAttribute('style', 'color: yellow; width: 100px;');
        observer.observe(div, { attributes: true });
        div.style.removeProperty('height');

        setTimeout(finish, 0);
    }

    function finish() {
        shouldBe('mutations', 'null');

        observer.disconnect();
        debug('');
        runNextTest();
    }

    start();
}

function testMutateThroughAttrNodeValue() {
    var observer;

    function start() {
        debug('Test that mutating an attribute through an attr node delivers mutation records');

        mutations = null;
        observer = new MutationObserver(function(mutations) {
            window.mutations = mutations;
        });

        div = document.createElement('div');
        div.setAttribute('data-test', 'foo');
        observer.observe(div, { attributes: true, attributeOldValue: true });
        div.attributes['data-test'].value = 'bar';

        setTimeout(finish, 0);
    }

    function finish() {
        shouldBe('mutations.length', '1');
        shouldBe('mutations[0].target', 'div');
        shouldBe('mutations[0].type', '"attributes"');
        shouldBe('mutations[0].attributeName', '"data-test"');
        shouldBe('mutations[0].oldValue', '"foo"');

        observer.disconnect();
        debug('');
        runNextTest();
    }

    start();
}

function testSetAndRemoveAttributeNode() {
    var observer;

    function start() {
        debug('Test that mutating via setAttributeNode delivers mutation records');

        mutations = null;
        observer = new MutationObserver(function(mutations) {
            window.mutations = mutations;
        });

        div = document.createElement('div');
        div.id = 'myId';
        div.setAttribute('data-test', 'foo');
        observer.observe(div, { attributes: true, attributeOldValue: true });
        var attr = document.createAttribute('data-test');
        attr.value = 'bar';
        div.setAttributeNode(attr);
        attr = document.createAttribute('data-other');
        attr.value = 'baz';
        div.setAttributeNode(attr);
        div.removeAttributeNode(div.attributes['id']);

        setTimeout(finish, 0);
    }

    function finish() {
        shouldBe('mutations.length', '3');
        shouldBe('mutations[0].target', 'div');
        shouldBe('mutations[0].type', '"attributes"');
        shouldBe('mutations[0].attributeName', '"data-test"');
        shouldBe('mutations[0].oldValue', '"foo"');
        shouldBe('mutations[1].target', 'div');
        shouldBe('mutations[1].type', '"attributes"');
        shouldBe('mutations[1].attributeName', '"data-other"');
        shouldBe('mutations[1].oldValue', 'null');
        shouldBe('mutations[2].target', 'div');
        shouldBe('mutations[2].type', '"attributes"');
        shouldBe('mutations[2].attributeName', '"id"');
        shouldBe('mutations[2].oldValue', '"myId"');

        observer.disconnect();
        debug('');
        runNextTest();
    }

    start();
}

function testMixedNodeAndElementOperations() {
    var observer;

    function start() {
        debug('Test that setAttribute on an attribute with an existing Attr delivers mutation records');

        mutations = null;
        observer = new MutationObserver(function(mutations) {
            window.mutations = mutations;
        });

        div = document.createElement('div');
        var attr = document.createAttribute('data-test');
        attr.value = 'foo';
        div.setAttributeNode(attr);
        observer.observe(div, { attributes: true, attributeOldValue: true });
        div.setAttribute('data-test', 'bar');

        setTimeout(finish, 0);
    }

    function finish() {
        shouldBe('mutations.length', '1');
        shouldBe('mutations[0].target', 'div');
        shouldBe('mutations[0].type', '"attributes"');
        shouldBe('mutations[0].attributeName', '"data-test"');
        shouldBe('mutations[0].oldValue', '"foo"');

        observer.disconnect();
        debug('');
        runNextTest();
    }

    start();
}

function testNamedNodeMapOperations() {
    var observer;

    function start() {
        debug('Test that setNamedItem and removeNamedItem deliver mutation records');

        mutations = null;
        observer = new MutationObserver(function(mutations) {
            window.mutations = mutations;
        });

        div = document.createElement('div');
        div.setAttribute('data-test', 'foo');
        observer.observe(div, { attributes: true, attributeOldValue: true });
        var attr = document.createAttribute('data-test');
        attr.value = 'bar';
        div.attributes.setNamedItem(attr);
        div.attributes.removeNamedItem('data-test');

        setTimeout(finish, 0);
    }

    function finish() {
        shouldBe('mutations.length', '2');
        shouldBe('mutations[0].target', 'div');
        shouldBe('mutations[0].type', '"attributes"');
        shouldBe('mutations[0].attributeName', '"data-test"');
        shouldBe('mutations[0].oldValue', '"foo"');
        shouldBe('mutations[1].target', 'div');
        shouldBe('mutations[1].type', '"attributes"');
        shouldBe('mutations[1].attributeName', '"data-test"');
        shouldBe('mutations[1].oldValue', '"bar"');

        observer.disconnect();
        debug('');
        runNextTest();
    }

    start();
}

var tests = [
    testBasic,
    testWrongType,
    testMultipleRegistration,
    testMultipleObservers,
    testNamespaceURI,
    testPropertyAccess,
    testOrderingWrtDOMSubtreeModified,
    testOldValue,
    testOldValueAsRequested,
    testOldValueUnionMultipleObservations,
    testIDLAttribute,
    testAttributeFilter,
    testAttributeFilterSubtree,
    testAttributeFilterNonHTMLElement,
    testAttributeFilterNonHTMLDocument,
    testStyleAttributePropertyAccess,
    testStyleAttributePropertyAccessOldValue,
    testStyleAttributePropertyAccessIgnoreNoop,
    testMutateThroughAttrNodeValue,
    testSetAndRemoveAttributeNode,
    testMixedNodeAndElementOperations,
    testNamedNodeMapOperations
];
var testIndex = 0;

function runNextTest() {
    if (testIndex < tests.length)
        tests[testIndex++]();
    else
        finishJSTest();
}

description('Test WebKitMutationObserver.observe on attributes');

runNextTest();
</script>
<script src="../../../resources/js-test-post.js"></script>