domapi-test.lzx

<!-- * X_LZ_COPYRIGHT_BEGIN ***************************************************
* Copyright 2005-2009 Laszlo Systems, Inc. All Rights Reserved.               *
* Use is subject to license terms.                                            *
* X_LZ_COPYRIGHT_END ****************************************************** -->
<!-- @LZX_VERSION@                                                         -->
<canvas>
  <include href="lzunit"/>
  <script src="../domapi.js"/>
  <include href="lz/button.lzx"/>

  <view name="localName"/>
  
  <TestSuite>
    <TestCase>
      <!-- for testGetChildNodes -->
      <view id="v1">
        <view name="ch1"/>
        <view name="ch2"/>
      </view>
      
      <!-- for testCreateElement -->
      <!-- It's an hbox, so that we can inspect it visually too. -->
      <hbox id="v2" x="100" y="100" bgcolor="blue"/>
      
      <!-- for testGetElementById -->
      <view id="v3"/>
      
      <!-- for testRemoveChild -->
      <view id="v4"/>
      
      <method name="testEquivalent" args="a1, a2">
        if (a1 == a2) return true;
        if (typeof a1 != typeof a2) return false;
        if (typeof a1 != 'object') return false;
        if (a1.constructor != a2.constructor) return false;
        if (a1.constructor != Array) return false;
        if (a1.length != a2.length) return false;
        for (var i in a1) {
          if (a1[i] != a2[i]) return false;
        }
        return true;
      </method>
      
      <method name="assertEquivalent" args="expected, actual, message">
        if (!testEquivalent(expected, actual)) {
          this.fail(lz.format(jsTrue(message) ? message :  "Equivalent", expected, actual));
        }
        canvas.setAttribute('runTests', canvas.runTests + 1)
      </method>
      
      <method name="testDocument">
        assertEquals(canvas, document);
      </method>
      
      <method name="testGetElementById">
        assertEquals(v3, document.getElementById('v3'));
        
        // verify that toplevel elements with a @name don't show up
        // with an @id
        // FIXME: this fails, because the LFC mangles the attributes
        // prior to instantiation.
        //assertEquals(null, document.getElementById('localName'));
        
        // verify that globals that happen to have an id attribute
        // but aren't nodes don't show up
        var testGlobal1 = {id: 'testGlobal'};
        assertEquals(null, document.getElementById('testGlobal1'));
        
        // verify that globals that are bound to nodes, but not
        // through the id mechanism, don't show up
        var testGlobal2 = v1;
        assertEquals(null, document.getElementById('testGlobal2'));
        
        // verify that nodes that haven't been attached to the document
        // hierarchy don't show up
        // NOTE: parent=null seems to default to parent=canvas, so
        // there's no way to test this but maybe no way to create
        // the situation anyway.
        //new lz.view(null, {id: 'testGlobal3'});
        //assertEquals(null, document.getElementById('testGlobal3'));
        
        // verify that created elements with a global binding but
        // no id attribute don't show up
        var testGlobal4 = v3.createElement('button', {});
        assertEquals(null, document.getElementById('testGlobal4'));
        
        // verify that created elements with an id attribute show up
        var e = v3.createElement('button', {id: 'created'});
        assertEquals(e, document.getElementById('created'));
        
        // verify that deleted elements no longer show up
        e.parent.removeChild(e);
        assertEquals(null, document.getElementById('created'));
      </method>
      
      <method name="testDollars">
        assertEquals(v1, $('v1'))
        assertEquals(v1, $(v1))
        assertEquals([v1, v2], $('v1', 'v2'));
        assertEquals([v1, v2], $(v1, 'v2'));
      </method>

      <method name="testCreateElement">
        var b1 = v2.createElement('button', {text: 'button 1'});
        var b2 = v2.createElement('button', {text: 'button 2'});
        assertEquals('button', b1['class']);
        // children[0] is the layout
        assertEquals(b1, v2.getChildNodes()[1]);
        assertEquals(b2, v2.getChildNodes()[2]);
      </method>
      
      <method name="testGetChildNodes">
        assertEquals([v1.ch1, v1.ch2], v1.getChildNodes());
      </method>
      
      <method name="testRemoveChild">
        var e = v4.createElement('button');
        v4.removeChild(e);
        assertEquals([], v4.getChildNodes());
      </method>
      
      <method name="addTests"> 
          this.addTest("testEquivalent");
          this.addTest("testDocument");
          this.addTest("testGetElementById");
          this.addTest("testDollars");
          this.addTest("testCreateElement");
          this.addTest("testGetChildNodes");
          this.addTest("testRemoveChild");
      </method> 
    </TestCase>
  </TestSuite>
</canvas>