javascripthtmlqunitgoogle-blockly

How do you check if a JavaScript Object is a new DOM Element?


I have a function

mutationToDom: function() {
    var container = document.createElement( 'mutation' );

    container.setAttribute( 'string', 'test' );

    return container;
}

The container is <mutation string="test"></mutation>

How can I check it after I call this function in my Unit test?

QUnit.test( 'check function mutationToDom', function( assert ) {
    var container = testBlock.mutationToDom();
    assert.ok( container === ???, 'mutation is created with correct value' );
});

Try #1

I tried with XMLSerializer() to convert the XML to string

var containerString = new XMLSerializer().serializeToString(container);

but, the containerString is

"<mutation xmlns="http://www.w3.org/1999/xhtml" string="test"></mutation>"

instead of "<mutation string="test"></mutation>"


Solution

  • How about checking for the outerHTML?

    var testBlock = {
      mutationToDom: function() {
        var container = document.createElement('mutation');
        container.setAttribute('string', 'test');
        return container;
      }
    };
    
    QUnit.test( 'check function mutationToDom', function( assert ) {
        var container = testBlock.mutationToDom();
        assert.ok( container.outerHTML === '<mutation string="test"></mutation>', 'mutation is created with correct value' );
    });
    <link rel="stylesheet" href="https://code.jquery.com/qunit/qunit-2.6.0.css">
    <div id="qunit"></div>
    <div id="qunit-fixture"></div>
    <script src="https://code.jquery.com/qunit/qunit-2.6.0.js"></script>