yellow team mailing list archive

[Brad Crittenden <bac@xxxxxxxxxxxxx>]

Brad Crittenden has proposed merging lp:~bac/juju-gui/1083935 into lp:juju-gui.

Requested reviews:
  Juju GUI Hackers (juju-gui)
Related bugs:
  Bug #1083935 in juju-gui: "Environment pan/zoom code is not tested sufficiently"
  https://bugs.launchpad.net/juju-gui/+bug/1083935

For more details, see:
https://code.launchpad.net/~bac/juju-gui/1083935/+merge/141135

Add tests for panzoom.

Tests are added for panzoom.  Due to agreed upon time-boxing, the testing is
not thorough but is a start.  Another but to complete the testing will be
filed.
-- 
https://code.launchpad.net/~bac/juju-gui/1083935/+merge/141135
Your team Juju GUI Hackers is requested to review the proposed merge of lp:~bac/juju-gui/1083935 into lp:juju-gui.

=== modified file 'app/views/topology/mega.js'
--- app/views/topology/mega.js	2012-12-20 13:34:43 +0000
+++ app/views/topology/mega.js	2012-12-21 20:59:23 +0000
@@ -1289,12 +1289,12 @@
     },
 
     /*
-         * Actions to be called on clicking a service.
-         */
+     * Actions to be called on clicking a service.
+     */
     service_click_actions: {
       /*
-           * Default action: show or hide control panel.
-           */
+       * Default action: show or hide control panel.
+       */
       toggleControlPanel: function(m, view, context) {
         var container = view.get('container'),
                 cp = container.one('#service-menu');

=== modified file 'app/views/topology/panzoom.js'
--- app/views/topology/panzoom.js	2012-12-20 16:23:32 +0000
+++ app/views/topology/panzoom.js	2012-12-21 20:59:23 +0000
@@ -48,7 +48,6 @@
     renderSlider: function() {
       var self = this,
           topo = this.get('component'),
-          contianer = topo.get('container'),
           value = 100,
           currentScale = topo.get('scale');
 

=== modified file 'test/index.html'
--- test/index.html	2012-12-17 14:53:46 +0000
+++ test/index.html	2012-12-21 20:59:23 +0000
@@ -21,6 +21,7 @@
 
   <script src="test_d3_components.js"></script>
   <script src="test_topology.js"></script>
+  <script src="test_panzoom.js"></script>
   <script src="test_env.js"></script>
   <script src="test_model.js"></script>
   <script src="test_notifications.js"></script>

=== modified file 'test/test_application_notifications.js'
--- test/test_application_notifications.js	2012-12-13 11:44:57 +0000
+++ test/test_application_notifications.js	2012-12-21 20:59:23 +0000
@@ -4,7 +4,7 @@
   var _setTimeout, _viewsHighlightRow, db, ERR_EV, juju, models, NO_OP,
       viewContainer, views, Y;
 
-  before(function() {
+  before(function(done) {
     Y = YUI(GlobalConfig).use(['node',
       'juju-models',
       'juju-views',
@@ -16,6 +16,7 @@
       juju = Y.namespace('juju');
       models = Y.namespace('juju.models');
       views = Y.namespace('juju.views');
+      done();
     });
 
     ERR_EV = {

=== added file 'test/test_panzoom.js'
--- test/test_panzoom.js	1970-01-01 00:00:00 +0000
+++ test/test_panzoom.js	2012-12-21 20:59:23 +0000
@@ -0,0 +1,149 @@
+'use strict';
+
+describe('pan zoom module', function() {
+  var db, juju, models, viewContainer, views, Y, pz, topo, vis;
+
+  before(function(done) {
+    Y = YUI(GlobalConfig).use(['node',
+      'juju-models',
+      'juju-views',
+      'juju-gui',
+      'juju-env',
+      'juju-tests-utils',
+      'node-event-simulate'],
+    function(Y) {
+      juju = Y.namespace('juju');
+      models = Y.namespace('juju.models');
+      views = Y.namespace('juju.views');
+      done();
+    });
+  });
+
+  beforeEach(function(done) {
+    Y = YUI(GlobalConfig).use(['node',
+      'juju-models',
+      'juju-views',
+      'juju-gui',
+      'juju-env',
+      'juju-tests-utils',
+      'node-event-simulate'],
+    function(Y) {
+      viewContainer = Y.Node.create('<div />');
+      viewContainer.appendTo(Y.one('body'));
+      viewContainer.hide();
+
+      db = new models.Database();
+      var view = new views.environment({container: viewContainer, db: db});
+      view.render();
+      view.postRender();
+      pz = view.topo.modules.PanZoomModule;
+      topo = pz.get('component');
+      vis = topo.vis;
+      done();
+    });
+  });
+
+  afterEach(function() {
+    viewContainer.remove(true);
+  });
+
+  it('initial values are set',
+      function() {
+        pz._translate.should.eql([0, 0]);
+        pz._scale.should.equal(1.0);
+      });
+
+  // Test the zoom handler calculations.
+  it('zoom scale handles fractional values',
+     function() {
+       // Floor is used so the scale will round down.
+       var evt = { scale: 0.609 };
+       var rescaleCalled = false;
+       pz.rescale = function() {
+         rescaleCalled = true;
+       };
+       pz.zoomHandler(evt);
+       pz.slider.get('value').should.equal(60);
+       assert.isTrue(rescaleCalled);
+     });
+
+  it('slider has an upper limit',
+     function() {
+       var evt = { scale: 3.5 };
+       var rescaleCalled = false;
+       pz.rescale = function() {
+         rescaleCalled = true;
+       };
+       pz.zoomHandler(evt);
+       pz.slider.get('value').should.equal(200);
+       assert.isTrue(rescaleCalled);
+     });
+
+  it('slider has a lower limit',
+     function() {
+       var evt = { scale: 0.18 };
+       var rescaleCalled = false;
+       pz.rescale = function() {
+         rescaleCalled = true;
+       };
+       pz.zoomHandler(evt);
+       pz.slider.get('value').should.equal(25);
+       assert.isTrue(rescaleCalled);
+     });
+
+  // Test the zoom calculations.
+  it('rescale handles fractional values within the limit',
+     function(done) {
+       // Floor is used so the scale will round down.
+       var evt =
+           { scale: 0.609,
+             translate: 't'};
+       var rescaled = false;
+       topo.once('rescaled', function() {
+         rescaled = true;
+         done();
+       });
+       pz.rescale(vis, evt);
+       pz._scale.should.equal(0.609);
+       var expected = 'translate(' + evt.translate + ') scale(0.609)';
+       vis.attr('transform').should.equal(expected);
+       assert.isTrue(rescaled);
+     });
+
+  it('rescale sets upper limit',
+     function(done) {
+       var evt =
+           { scale: 2.1,
+             translate: 'u'};
+       var rescaled = false;
+       topo.once('rescaled', function() {
+         rescaled = true;
+         done();
+       });
+       topo.set('scale', 2.0);
+       pz.rescale(vis, evt);
+       pz._scale.should.equal(2.0);
+       var expected = 'translate(' + evt.translate + ') scale(2)';
+       vis.attr('transform').should.equal(expected);
+       assert.isTrue(rescaled);
+     });
+
+  it('rescale sets lower limit',
+     function(done) {
+       var evt =
+           { scale: 0.2,
+             translate: 'v'};
+       var rescaled = false;
+       topo.once('rescaled', function() {
+         rescaled = true;
+         done();
+       });
+       topo.set('scale', 0.25);
+       pz.rescale(vis, evt);
+       pz._scale.should.equal(0.25);
+       var expected = 'translate(' + evt.translate + ') scale(0.25)';
+       vis.attr('transform').should.equal(expected);
+       assert.isTrue(rescaled);
+     });
+
+});