Add tests for truncate directives

src/kibana/directives/css_truncate.js

@@ -18,7 +18,9 @@ define(function (require) {
 
         if (!_.isUndefined(attrs.cssTruncateExpandable)) {
           $elem.css({'cursor': 'pointer'});
-          $elem.bind('click', $scope.toggle);
+          $elem.bind('click', function () {
+            $scope.toggle();
+          });
         }
 
         $scope.toggle = function () {

test/unit/specs/directives/css_truncate.js

@@ -0,0 +1,70 @@
+define(function (require) {
+  var angular = require('angular');
+  var mocks = require('angular-mocks');
+  var $ = require('jquery');
+
+  // Load the kibana app dependencies.
+  require('angular-route');
+
+  // Load kibana and its applications
+  require('index');
+
+  require('apps/discover/index');
+
+  var $parentScope, $scope, $elem;
+
+  var init = function (expandable) {
+    // Load the application
+    module('kibana');
+
+    // Create the scope
+    inject(function ($rootScope, $compile) {
+
+      // Give us a scope
+      $parentScope = $rootScope;
+
+      // Create the element
+      $elem = angular.element(
+        '<span css-truncate ' + (expandable ? 'css-truncate-expandable' : '') + '>this isnt important</span>'
+      );
+
+      // And compile it
+      $compile($elem)($parentScope);
+
+      // Fire a digest cycle
+      $elem.scope().$digest();
+
+      // Grab the isolate scope so we can test it
+      $scope = $elem.isolateScope();
+    });
+  };
+
+
+  describe('cssTruncate directive', function () {
+
+    describe('expandable', function () {
+
+      beforeEach(function () {
+        init(true);
+      });
+
+      it('should set text-overflow to ellipsis and whitespace to nowrap', function (done) {
+        expect($elem.css('text-overflow')).to.be('ellipsis');
+        expect($elem.css('white-space')).to.be('nowrap');
+        done();
+      });
+
+      it('should set white-space to normal when clicked, and back to nowrap when clicked again', function (done) {
+        $scope.toggle();
+        expect($elem.css('white-space')).to.be('normal');
+
+        $scope.toggle();
+        expect($elem.css('white-space')).to.be('nowrap');
+        done();
+      });
+
+    });
+
+  });
+
+});

test/unit/specs/directives/timepicker.js

@@ -291,18 +291,6 @@ define(function (require) {
         done();
       });
 
-      it('should highlight the right day on the calendar', function (done) {
-        $scope.from = moment('2012-02-05');
-        $scope.to = moment('2012-02-09');
-        $scope.setMode('absolute');
-
-        $scope.$digest();
-
-        expect(inputs.fromCalendar.find('.btn-info').text()).to.be('05');
-        expect(inputs.toCalendar.find('.btn-info').text()).to.be('09');
-        done();
-      });
-
       it('should disable the "Go" button if from > to', function (done) {
         $scope.absolute.from = moment('2012-02-01');
         $scope.absolute.to = moment('2012-02-11');

test/unit/specs/directives/truncate.js

@@ -0,0 +1,97 @@
+define(function (require) {
+  var angular = require('angular');
+  var mocks = require('angular-mocks');
+  var $ = require('jquery');
+
+  // Load the kibana app dependencies.
+  require('angular-route');
+
+  // Load kibana and its applications
+  require('index');
+
+  require('apps/discover/index');
+
+  var $parentScope, $scope, $elem;
+
+  var init = function (text) {
+    // Load the application
+    module('kibana');
+
+    // Create the scope
+    inject(function ($rootScope, $compile) {
+
+      // Give us a scope
+      $parentScope = $rootScope;
+
+      // Create the element
+      $elem = angular.element(
+        '<kbn-truncated orig="' + text + '" length="10"></kbn-timepicker>'
+      );
+
+      // And compile it
+      $compile($elem)($parentScope);
+
+      // Fire a digest cycle
+      $elem.scope().$digest();
+
+      // Grab the isolate scope so we can test it
+      $scope = $elem.isolateScope();
+    });
+  };
+
+
+  describe('kbnTruncate directive', function () {
+
+    describe('long strings', function () {
+
+      beforeEach(function () {
+        init('some string of text over 10 characters');
+      });
+
+      it('should trim long strings', function (done) {
+        expect($elem.text()).to.be('some strin... more');
+        done();
+      });
+
+      it('should have a link to see more text', function (done) {
+        expect($elem.find('[ng-click="toggle()"]').text()).to.be('more');
+        done();
+      });
+
+      it('should should more text if the link is clicked and less text if clicked again', function (done) {
+        $scope.toggle();
+        $scope.$digest();
+        expect($elem.text()).to.be('some string of text over 10 characters less');
+        expect($elem.find('[ng-click="toggle()"]').text()).to.be('less');
+
+        $scope.toggle();
+        $scope.$digest();
+        expect($elem.text()).to.be('some strin... more');
+        expect($elem.find('[ng-click="toggle()"]').text()).to.be('more');
+
+        done();
+      });
+
+    });
+
+    describe('short strings', function () {
+
+      beforeEach(function () {
+        init('short');
+      });
+
+      it('should not trim short strings', function (done) {
+        expect($elem.text()).to.be('short');
+        done();
+      });
+
+      it('should not have a link', function (done) {
+        expect($elem.find('[ng-click="toggle()"]').length).to.be(0);
+        done();
+      });
+
+    });
+
+  });
+
+});