mirror of
https://github.com/elastic/kibana.git
synced 2025-04-24 01:38:56 -04:00
Added a few more tests for the timepicker
This commit is contained in:
parent
c024963c72
commit
21f883471f
2 changed files with 127 additions and 54 deletions
|
@ -64,37 +64,38 @@
|
|||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- TODO: Add a section for custom intervals -->
|
||||
</div>
|
||||
<div ng-switch-when="relative">
|
||||
|
||||
|
||||
<div class="kbn-timepicker-section">
|
||||
|
||||
|
||||
<form class="form-inline" role="form">
|
||||
<label>
|
||||
From:
|
||||
From:
|
||||
<span ng-show="relative.preview">{{relative.preview}}</span><span ng-hide="relative.preview"><i>Invalid Expression</i></span>
|
||||
</label><br>
|
||||
<div class="form-group">
|
||||
<input type="number" class="form-control"
|
||||
ng-model="relative.count"
|
||||
<input type="number" class="form-control"
|
||||
ng-model="relative.count"
|
||||
ng-change="formatRelative()">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<select class="form-control col-xs-2"
|
||||
ng-model="relative.unit"
|
||||
<select class="form-control col-xs-2"
|
||||
ng-model="relative.unit"
|
||||
ng-options="opt.value as opt.text for opt in relativeOptions"
|
||||
ng-change="formatRelative()">
|
||||
</select>
|
||||
</div>
|
||||
<br>
|
||||
<div class="small">
|
||||
<input type="checkbox"
|
||||
ng-model="relative.round"
|
||||
ng-checked="relative.round"
|
||||
<input type="checkbox"
|
||||
ng-model="relative.round"
|
||||
ng-checked="relative.round"
|
||||
ng-change="formatRelative()"/> round to the {{units[relative.unit]}}
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div class="kbn-timepicker-section">
|
||||
|
@ -104,7 +105,7 @@
|
|||
</label><br>
|
||||
<div class="form-group">
|
||||
<input type="text" disabled class="form-control" value="Now">
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
|
@ -155,9 +156,9 @@
|
|||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -18,61 +18,64 @@ define(function (require) {
|
|||
// TODO: This should not be needed, timefilter is only included here, it should move
|
||||
require('apps/discover/index');
|
||||
|
||||
var $parentScope, $scope, $elem;
|
||||
var clock, anchor = '2014-01-01T06:06:06.666Z';
|
||||
|
||||
describe('Modes', function () {
|
||||
var $scope, $elem, $isolateScope;
|
||||
var init = function () {
|
||||
// Load the application
|
||||
module('kibana');
|
||||
|
||||
var clock, anchor = '2014-01-01T06:06:06.666Z';
|
||||
// Stub out the clock so 'now' doesn't move
|
||||
clock = sinon.useFakeTimers(moment(anchor).valueOf());
|
||||
|
||||
// Create the scope
|
||||
inject(function ($rootScope, $compile) {
|
||||
|
||||
// Give us a scope
|
||||
$parentScope = $rootScope;
|
||||
|
||||
// Add some parameters to it
|
||||
$parentScope.time = {
|
||||
from: moment().subtract(15, 'minutes'),
|
||||
to: moment(),
|
||||
mode: undefined // Any isolate scope var using '=' must be passed, even if undefined
|
||||
};
|
||||
|
||||
// Create the element
|
||||
$elem = angular.element(
|
||||
'<kbn-timepicker from="time.from" to="time.to" mode="time.mode"></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('mode setting', function () {
|
||||
|
||||
beforeEach(function () {
|
||||
// Load the application
|
||||
module('kibana');
|
||||
|
||||
// Stub out the clock so 'now' doesn't move
|
||||
clock = sinon.useFakeTimers(moment(anchor).valueOf());
|
||||
|
||||
// Create the scope
|
||||
inject(function ($rootScope, $compile) {
|
||||
|
||||
// Give us a scope
|
||||
$scope = $rootScope;
|
||||
|
||||
// Add some parameters to it
|
||||
$scope.time = {
|
||||
from: moment().subtract(15, 'minutes'),
|
||||
to: moment(),
|
||||
mode: undefined // Any isolate scope var using '=' must be passed, even if undefined
|
||||
};
|
||||
|
||||
// Create the element
|
||||
$elem = angular.element(
|
||||
'<kbn-timepicker from="time.from" to="time.to" mode="time.mode"></kbn-timepicker>'
|
||||
);
|
||||
|
||||
// And compile it
|
||||
$compile($elem)($scope);
|
||||
|
||||
// Fire a digest cycle
|
||||
$elem.scope().$apply();
|
||||
|
||||
// Grab the isolate scope so we can test it
|
||||
$isolateScope = $elem.isolateScope();
|
||||
});
|
||||
|
||||
init();
|
||||
});
|
||||
|
||||
it('should be in quick mode by default', function (done) {
|
||||
expect($isolateScope.mode).to.be('quick');
|
||||
expect($scope.mode).to.be('quick');
|
||||
done();
|
||||
});
|
||||
|
||||
it('should highlight the right mode', function (done) {
|
||||
expect($elem.find('.kbn-timepicker-modes .active').text()).to.be('quick');
|
||||
|
||||
// Each of the 3 modes
|
||||
var modes = ['absolute', 'relative', 'quick'];
|
||||
_.each(modes, function (mode) {
|
||||
$isolateScope.setMode(mode);
|
||||
$isolateScope.$apply();
|
||||
$scope.setMode(mode);
|
||||
$scope.$digest();
|
||||
expect($elem.find('.kbn-timepicker-modes .active').text()).to.be(mode);
|
||||
});
|
||||
|
||||
|
@ -81,4 +84,73 @@ define(function (require) {
|
|||
|
||||
});
|
||||
|
||||
describe('quick mode', function () {
|
||||
|
||||
beforeEach(function () {
|
||||
init();
|
||||
$scope.setMode('quick');
|
||||
$scope.$digest();
|
||||
});
|
||||
|
||||
it('should contain 3 lists of options', function (done) {
|
||||
expect($elem.find('.kbn-timepicker-section .list-unstyled').length).to.be(3);
|
||||
done();
|
||||
});
|
||||
|
||||
it('should have a $scope.setQuick() that sets the to and from variables to strings', function (done) {
|
||||
$scope.setQuick('now', 'now');
|
||||
expect($scope.from).to.be('now');
|
||||
expect($scope.to).to.be('now');
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
describe('relative mode', function () {
|
||||
|
||||
beforeEach(function () {
|
||||
init();
|
||||
$scope.setMode('relative');
|
||||
$scope.$digest();
|
||||
});
|
||||
|
||||
it('has a preview of the "from" input', function (done) {
|
||||
var preview = $elem.find('.kbn-timepicker-section span[ng-show="relative.preview"]');
|
||||
expect(preview.text()).to.be(moment().subtract(1, 'minutes').format($scope.format));
|
||||
done();
|
||||
});
|
||||
|
||||
it('has a disabled "to" field that contains "Now"', function (done) {
|
||||
expect($elem.find('.kbn-timepicker-section input[disabled]').val()).to.be('Now');
|
||||
done();
|
||||
});
|
||||
|
||||
it('has a dropdown bound to relative.unit that contains all of the intervals', function (done) {
|
||||
var select = $elem.find('.kbn-timepicker-section select[ng-model="relative.unit"]');
|
||||
expect(select.length).to.be(1);
|
||||
expect(select.find('option').length).to.be(7);
|
||||
|
||||
// Check each relative option, make sure it is in the list
|
||||
_.each($scope.relativeOptions, function (unit, i) {
|
||||
expect(select.find('option')[i].text).to.be(unit.text);
|
||||
});
|
||||
done();
|
||||
});
|
||||
|
||||
it('has a checkbox that is checked when rounding is enabled', function (done) {
|
||||
var checkbox = $elem.find('.kbn-timepicker-section input[ng-model="relative.round"]');
|
||||
expect(checkbox.length).to.be(1);
|
||||
|
||||
// Rounding is disabled by default
|
||||
expect(checkbox.attr('checked')).to.be(undefined);
|
||||
|
||||
// Enable rounding
|
||||
$scope.relative.round = true;
|
||||
$scope.$digest();
|
||||
expect(checkbox.attr('checked')).to.be('checked');
|
||||
|
||||
done();
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
Loading…
Add table
Add a link
Reference in a new issue