view htdocs/svg-edit/test/select_test.html @ 632:8c00e2be925e

inital veraion 2.7 r2891 of svg-edit
author Reimar Bauer <rb.proj AT googlemail DOT com>
date Thu, 05 Feb 2015 16:37:37 +0100
parents
children
line wrap: on
line source
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8" />
  <title>Unit Tests for select.js</title>
  <link rel='stylesheet' href='qunit/qunit.css' type='text/css'/>
  <script src='../editor/jquery.js'></script>
  <script src='../editor/svgedit.js'></script>
  <script src='../editor/browser.js'></script>
  <script src='../editor/math.js'></script>
  <script src='../editor/svgutils.js'></script>
  <script src='../editor/select.js'></script>
  <script src='qunit/qunit.js'></script>
  <script>
  $(function() {
    // log function
    QUnit.log = function(result, message) {
      if (window.console && window.console.log) {
        window.console.log(result +' :: '+ message);
      }
    };

    module('svgedit.select');

    var sandbox = document.getElementById('sandbox');
    var svgroot;
    var svgcontent;
    var rect;
    var mockConfig = {
      dimensions: [640,480]
    };
    var mockFactory = {
      createSVGElement: function(jsonMap) {
        var elem = document.createElementNS(svgedit.NS.SVG, jsonMap['element']);
        for (var attr in jsonMap['attr']) {
          elem.setAttribute(attr, jsonMap['attr'][attr]);
        }
        return elem;
      },
      svgRoot: function() { return svgroot; },
      svgContent: function() { return svgcontent; }
    };

    function setUp() {
      svgroot = mockFactory.createSVGElement({
        'element': 'svg',
        'attr': {'id': 'svgroot'}
      });
      svgcontent = svgroot.appendChild(
        mockFactory.createSVGElement({
          'element': 'svg',
          'attr': {'id': 'svgcontent'}
        })
      );
      rect = svgcontent.appendChild(
        mockFactory.createSVGElement({
          'element': 'rect',
          'attr': {
            'id': 'rect',
            'x': '50',
            'y': '75',
            'width': '200',
            'height': '100'
          }
        })
      );
      sandbox.appendChild(svgroot);
    }

    function setUpWithInit() {
      setUp();
      svgedit.select.init(mockConfig, mockFactory);
    }
    
    function tearDown() {
      while (sandbox.hasChildNodes()) {
        sandbox.removeChild(sandbox.firstChild);
      }
    }

    test('Test svgedit.select package', function() {
      expect(10);

      ok(svgedit.select);
      ok(svgedit.select.Selector);
      ok(svgedit.select.SelectorManager);
      ok(svgedit.select.init);
      ok(svgedit.select.getSelectorManager);
      equals(typeof svgedit.select, typeof {});
      equals(typeof svgedit.select.Selector, typeof function(){});
      equals(typeof svgedit.select.SelectorManager, typeof function(){});
      equals(typeof svgedit.select.init, typeof function(){});
      equals(typeof svgedit.select.getSelectorManager, typeof function(){});
    });
    
    test('Test Selector DOM structure', function() {
      expect(24);

      setUp();

      ok(svgroot);
      ok(svgroot.hasChildNodes());

      // Verify non-existence of Selector DOM nodes
      equals(svgroot.childNodes.length, 1);
      equals(svgroot.childNodes.item(0), svgcontent);
      ok(!svgroot.querySelector('#selectorParentGroup'));

      svgedit.select.init(mockConfig, mockFactory);

      equals(svgroot.childNodes.length, 3);

      // Verify existence of canvas background.
      var cb = svgroot.childNodes.item(0);
      ok(cb);
      equals(cb.id, 'canvasBackground');

      ok(svgroot.childNodes.item(1));
      equals(svgroot.childNodes.item(1), svgcontent);

      // Verify existence of selectorParentGroup.
      var spg = svgroot.childNodes.item(2);
      ok(spg);
      equals(svgroot.querySelector('#selectorParentGroup'), spg);
      equals(spg.id, 'selectorParentGroup');
      equals(spg.tagName, 'g');

      // Verify existence of all grip elements.
      ok(spg.querySelector('#selectorGrip_resize_nw'));
      ok(spg.querySelector('#selectorGrip_resize_n'));
      ok(spg.querySelector('#selectorGrip_resize_ne'));
      ok(spg.querySelector('#selectorGrip_resize_e'));
      ok(spg.querySelector('#selectorGrip_resize_se'));
      ok(spg.querySelector('#selectorGrip_resize_s'));
      ok(spg.querySelector('#selectorGrip_resize_sw'));
      ok(spg.querySelector('#selectorGrip_resize_w'));
      ok(spg.querySelector('#selectorGrip_rotateconnector'));
      ok(spg.querySelector('#selectorGrip_rotate'));

      tearDown();
    });

  });
  </script>
</head>
<body>
  <h1 id='qunit-header'>Unit Tests for select.js</h1>
  <h2 id='qunit-banner'></h2>
  <h2 id='qunit-userAgent'></h2>
  <ol id='qunit-tests'></ol>
  <div id='sandbox'></div>
</body>
</html>