svgedit/test/select_test.js

/* eslint-env qunit */
/* globals $, svgedit, equals */
/* eslint-disable no-var */
$(function () {
  // log function
  QUnit.log = function (details) {
    if (window.console && window.console.log) {
      window.console.log(details.result + ' :: ' + details.message);
    }
  };

  module('svgedit.select');

  var sandbox = document.getElementById('sandbox');
  var svgroot;
  var svgcontent;
  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'}
      })
    );
    /* var 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();
  });
});