<html>
<link rel="import" href="../resources/chai.html" />
<link rel="import" href="../resources/mocha.html" />
<body>
<div id="container"></div>
<script>
describe('document.registerElement()', function() {
  it('should have basic behaviors', function() {
    function createRegisterParameters()
    {
        return {
            prototype: Object.create(HTMLElement.prototype, { thisIsPrototype: { value: true } })
        };
    }

    var fooConstructor = document.registerElement('x-foo', createRegisterParameters());
    assert.equal(typeof fooConstructor, "function");
    assert.equal(fooConstructor.prototype.__proto__, HTMLElement.prototype);
    assert.ok(fooConstructor.prototype.thisIsPrototype);

    // Bad prototype: prototype is already a built-in interface prototype object
    assert.throws(function() {
        document.registerElement("x-bad-a", HTMLElement)
    });
    // Bad prototype: prototype is already a Custom Element interface prototype object
    assert.throws(function() {
        document.registerElement("x-bad-b", fooConstructor)
    });
    // Bad prototype: 'constructor' is not configurable
    var proto = Object.create(HTMLElement.prototype, {
      constructor: {configurable: false, writable: true}
    });
    assert.throws(function() {
        document.registerElement("x-bad-c", { prototype: proto })
    });
    // Call as function
    assert.throws(function() {
        fooConstructor()
    })

    // Constructor initiated instantiation
    var createdFoo = new fooConstructor();

    // JS built-in properties
    assert.equal(createdFoo.__proto__, fooConstructor.prototype);
    assert.equal(createdFoo.constructor, fooConstructor);

    // Native getter
    assert.equal(createdFoo.tagName, "x-foo");

    // Native setter
    createdFoo.textContent = 'Hello';
    assert.equal(createdFoo.textContent, "Hello");

    // Native method
    var childDiv = document.createElement('div');
    createdFoo.appendChild(childDiv);
    assert.equal(createdFoo.lastChild, childDiv);

    // Parser initiated instantiation
    var container = document.getElementById('container');
    container.appendChild(document.createElement("x-foo"));
    var parsedFoo = container.firstChild;

    assert.equal(parsedFoo.__proto__, fooConstructor.prototype);
    assert.equal(parsedFoo.tagName, "x-foo");

    // Ensuring the wrapper is retained
    parsedFoo.someProperty = 'hello';
    assert.equal(parsedFoo.someProperty, container.firstChild.someProperty);

    // Having another constructor
    var barConstructor = document.registerElement('x-bar', createRegisterParameters());
    assert.ok('barConstructor !== fooConstructor');
    var createdBar = new barConstructor();
    assert.equal(createdBar.tagName, "x-bar");

    // Having a subclass
    var bazConstructor = document.registerElement('x-baz', { prototype: Object.create(fooConstructor.prototype, { thisIsAlsoPrototype: { value: true } }) });
    var createdBaz = new bazConstructor();
    assert.equal(createdBaz.tagName, "x-baz");
    assert.ok(createdBaz.thisIsPrototype);
    assert.ok(createdBaz.thisIsAlsoPrototype);

    // With irregular cases
    var createdUpperBar = document.createElement('X-BAR');
    var createdMixedBar = document.createElement('X-Bar');
    assert.notEqual(createdUpperBar.constructor, barConstructor);
    assert.notEqual(createdUpperBar.tagName, "x-bar");
    assert.notEqual(createdMixedBar.constructor, barConstructor);
    assert.notEqual(createdMixedBar.tagName, "x-bar");

    // Constructors shouldn't interfere with each other
    assert.equal((new fooConstructor).tagName, "x-foo");
    assert.equal((new barConstructor).tagName, "x-bar");
    assert.equal((new bazConstructor).tagName, "x-baz");
  });
});
</script>
</body>
</html>