Skip to content
This repository has been archived by the owner on May 29, 2019. It is now read-only.

Commit

Permalink
feat(timepicker): remove replace usage
Browse files Browse the repository at this point in the history 
- Remove `replace: true` usage

BREAKING CHANGE: This removes `replace: true`, which changes the HTML structure slightly - see the documentation examples to see it in action.

Closes #5997
  • Loading branch information
@wesleycho
wesleycho committed Jun 14, 2016
1 parent 4e68778 commit 7518821
Show file tree
Hide file tree
Showing 3 changed files with 31 additions and 31 deletions.
2 changes: 1 addition & 1 deletion src/timepicker/docs/demo.html
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<div ng-controller="TimepickerDemoCtrl">

<uib-timepicker ng-model="mytime" ng-change="changed()" hour-step="hstep" minute-step="mstep" show-meridian="ismeridian"></uib-timepicker>
<div uib-timepicker ng-model="mytime" ng-change="changed()" hour-step="hstep" minute-step="mstep" show-meridian="ismeridian"></div>

<pre class="alert alert-info">Time is: {{mytime | date:'shortTime' }}</pre>

Expand Down
58 changes: 29 additions & 29 deletions src/timepicker/test/timepicker.spec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ describe('timepicker directive', function() {
$rootScope.time = newTime(14, 40, 25);
$templateCache = _$templateCache_;

element = $compile('<uib-timepicker ng-model="time"></uib-timepicker>')($rootScope);
element = $compile('<div uib-timepicker ng-model="time"></div>')($rootScope);
$rootScope.$digest();

modelCtrl = element.controller('ngModel');
Expand Down Expand Up @@ -130,7 +130,7 @@ describe('timepicker directive', function() {

it('has `selected` current time when model is initially cleared', function() {
$rootScope.time = null;
element = $compile('<uib-timepicker ng-model="time"></uib-timepicker>')($rootScope);
element = $compile('<div uib-timepicker ng-model="time"></div>')($rootScope);
$rootScope.$digest();

expect($rootScope.time).toBe(null);
Expand Down Expand Up @@ -385,7 +385,7 @@ describe('timepicker directive', function() {
});

it('changes only the time part when minutes change', function() {
element = $compile('<uib-timepicker ng-model="time" minute-step="15"></uib-timepicker>')($rootScope);
element = $compile('<div uib-timepicker ng-model="time" minute-step="15"></div>')($rootScope);
$rootScope.time = newTime(0, 0, 0);
$rootScope.$digest();

Expand Down Expand Up @@ -648,7 +648,7 @@ describe('timepicker directive', function() {
$rootScope.mstep = 30;
$rootScope.sstep = 30;
$rootScope.time = newTime(14, 0 , 0);
element = $compile('<uib-timepicker ng-model="time" hour-step="hstep" minute-step="mstep" second-step="sstep"></uib-timepicker>')($rootScope);
element = $compile('<div uib-timepicker ng-model="time" hour-step="hstep" minute-step="mstep" second-step="sstep"></div>')($rootScope);
$rootScope.$digest();
});

Expand Down Expand Up @@ -840,7 +840,7 @@ describe('timepicker directive', function() {
beforeEach(function(){
$rootScope.displaysSeconds = false;
$rootScope.time = newTime(14,40,35);
element = $compile('<uib-timepicker ng-model="time" show-seconds="displaysSeconds"></uib-timepicker>')($rootScope);
element = $compile('<div uib-timepicker ng-model="time" show-seconds="displaysSeconds"></div>')($rootScope);
$rootScope.$digest();
});

Expand Down Expand Up @@ -914,7 +914,7 @@ describe('timepicker directive', function() {
beforeEach(function() {
$rootScope.meridian = false;
$rootScope.time = newTime(14, 10, 20);
element = $compile('<uib-timepicker ng-model="time" show-meridian="meridian"></uib-timepicker>')($rootScope);
element = $compile('<div uib-timepicker ng-model="time" show-meridian="meridian"></div>')($rootScope);
$rootScope.$digest();
});

Expand Down Expand Up @@ -946,7 +946,7 @@ describe('timepicker directive', function() {

it('handles correctly initially empty model on parent element', function() {
$rootScope.time = null;
element = $compile('<span ng-model="time"><uib-timepicker show-meridian="meridian"></uib-timepicker></span>')($rootScope);
element = $compile('<span ng-model="time"><div uib-timepicker show-meridian="meridian"></div></span>')($rootScope);
$rootScope.$digest();

expect($rootScope.time).toBe(null);
Expand All @@ -956,7 +956,7 @@ describe('timepicker directive', function() {
describe('`meridians` attribute', function() {
beforeEach(inject(function() {
$rootScope.meridiansArray = ['am', 'pm'];
element = $compile('<uib-timepicker ng-model="time" meridians="meridiansArray"></uib-timepicker>')($rootScope);
element = $compile('<div uib-timepicker ng-model="time" meridians="meridiansArray"></div>')($rootScope);
$rootScope.$digest();
}));

Expand All @@ -974,7 +974,7 @@ describe('timepicker directive', function() {
describe('`readonly-input` attribute', function() {
beforeEach(inject(function() {
$rootScope.meridiansArray = ['am', 'pm'];
element = $compile('<uib-timepicker ng-model="time" readonly-input="true"></uib-timepicker>')($rootScope);
element = $compile('<div uib-timepicker ng-model="time" readonly-input="true"></div>')($rootScope);
$rootScope.$digest();
}));

Expand All @@ -993,7 +993,7 @@ describe('timepicker directive', function() {
}

it('should pad the hours by default', function() {
element = $compile('<uib-timepicker ng-model="time"></uib-timepicker>')($rootScope);
element = $compile('<div uib-timepicker ng-model="time"></div>')($rootScope);
$rootScope.$digest();

var inputs = element.find('input');
Expand All @@ -1005,7 +1005,7 @@ describe('timepicker directive', function() {
});

it('should not pad the hours', function() {
element = $compile('<uib-timepicker ng-model="time" pad-hours="false"></uib-timepicker>')($rootScope);
element = $compile('<div uib-timepicker ng-model="time" pad-hours="false"></div>')($rootScope);
$rootScope.$digest();

var inputs = element.find('input');
Expand All @@ -1025,7 +1025,7 @@ describe('timepicker directive', function() {
uibTimepickerConfig.minuteStep = 10;
uibTimepickerConfig.secondStep = 10;
uibTimepickerConfig.showMeridian = false;
element = $compile('<uib-timepicker ng-model="time"></uib-timepicker>')($rootScope);
element = $compile('<div uib-timepicker ng-model="time"></div>')($rootScope);
$rootScope.$digest();
}));

Expand Down Expand Up @@ -1086,7 +1086,7 @@ describe('timepicker directive', function() {
angular.extend(originalConfig, uibTimepickerConfig);
uibTimepickerConfig.meridians = ['π.μ.', 'μ.μ.'];
uibTimepickerConfig.showMeridian = true;
element = $compile('<uib-timepicker ng-model="time"></uib-timepicker>')($rootScope);
element = $compile('<div uib-timepicker ng-model="time"></div>')($rootScope);
$rootScope.$digest();
}));
afterEach(inject(function(uibTimepickerConfig) {
Expand Down Expand Up @@ -1116,7 +1116,7 @@ describe('timepicker directive', function() {
$templateCache.put(newTemplateUrl, '<div>baz</div>');
uibTimepickerConfig.templateUrl = newTemplateUrl;

element = $compile('<uib-timepicker ng-model="time"></uib-timepicker>')($rootScope);
element = $compile('<div uib-timepicker ng-model="time"></div>')($rootScope);
$rootScope.$digest();
}));
afterEach(inject(function(uibTimepickerConfig) {
Expand All @@ -1126,7 +1126,7 @@ describe('timepicker directive', function() {

it('should use a custom template', function() {
expect(element[0].tagName.toLowerCase()).toBe('div');
expect(element.html()).toBe('baz');
expect(element.html()).toBe('<div>baz</div>');
});
});

Expand Down Expand Up @@ -1328,7 +1328,7 @@ describe('timepicker directive', function() {

it('handles 12/24H mode change', function() {
$rootScope.meridian = true;
element = $compile('<uib-timepicker ng-model="time" show-meridian="meridian"></uib-timepicker>')($rootScope);
element = $compile('<div uib-timepicker ng-model="time" show-meridian="meridian"></div>')($rootScope);
$rootScope.$digest();

var el = getHoursInputEl();
Expand All @@ -1346,14 +1346,14 @@ describe('timepicker directive', function() {
});

it('should have a default tabindex of 0', function() {
element = $compile('<uib-timepicker ng-model="time"></uib-timepicker>')($rootScope);
element = $compile('<div uib-timepicker ng-model="time"></div>')($rootScope);
$rootScope.$digest();

expect(element.isolateScope().tabindex).toBe(0);
});

it('should have the correct tabindex', function() {
element = $compile('<uib-timepicker ng-model="time" tabindex="5"></uib-timepicker>')($rootScope);
element = $compile('<div uib-timepicker ng-model="time" tabindex="5"></div>')($rootScope);
$rootScope.$digest();

expect(element.attr('tabindex')).toBe(undefined);
Expand All @@ -1363,7 +1363,7 @@ describe('timepicker directive', function() {

describe('when model is not a Date', function() {
beforeEach(inject(function() {
element = $compile('<uib-timepicker ng-model="time"></uib-timepicker>')($rootScope);
element = $compile('<div uib-timepicker ng-model="time"></div>')($rootScope);
}));

it('should not be invalid when the model is null', function() {
Expand Down Expand Up @@ -1415,7 +1415,7 @@ describe('timepicker directive', function() {
describe('use with `ng-required` directive', function() {
beforeEach(inject(function() {
$rootScope.time = null;
element = $compile('<uib-timepicker ng-model="time" ng-required="true"></uib-timepicker>')($rootScope);
element = $compile('<div uib-timepicker ng-model="time" ng-required="true"></div>')($rootScope);
$rootScope.$digest();
}));

Expand All @@ -1434,7 +1434,7 @@ describe('timepicker directive', function() {
beforeEach(inject(function() {
$rootScope.changeHandler = jasmine.createSpy('changeHandler');
$rootScope.time = new Date();
element = $compile('<uib-timepicker ng-model="time" ng-change="changeHandler()"></uib-timepicker>')($rootScope);
element = $compile('<div uib-timepicker ng-model="time" ng-change="changeHandler()"></div>')($rootScope);
$rootScope.$digest();
}));

Expand Down Expand Up @@ -1465,7 +1465,7 @@ describe('timepicker directive', function() {
describe('when used with min', function() {
var changeInputValueTo;
beforeEach(inject(function($sniffer) {
element = $compile('<uib-timepicker ng-model="time" min="min"></uib-timepicker>')($rootScope);
element = $compile('<div uib-timepicker ng-model="time" min="min"></div>')($rootScope);
$rootScope.$digest();
changeInputValueTo = function(inputEl, value) {
inputEl.val(value);
Expand Down Expand Up @@ -1792,7 +1792,7 @@ describe('timepicker directive', function() {
describe('when used with max', function() {
var changeInputValueTo;
beforeEach(inject(function($sniffer) {
element = $compile('<uib-timepicker ng-model="time" max="max"></uib-timepicker>')($rootScope);
element = $compile('<div uib-timepicker ng-model="time" max="max"></div>')($rootScope);
$rootScope.$digest();
changeInputValueTo = function(inputEl, value) {
inputEl.val(value);
Expand Down Expand Up @@ -2121,16 +2121,16 @@ describe('timepicker directive', function() {
it('should allow custom templates', function() {
$templateCache.put('foo/bar.html', '<div>baz</div>');

element = $compile('<uib-timepicker ng-model="time" template-url="foo/bar.html"></uib-timepicker>')($rootScope);
element = $compile('<div uib-timepicker ng-model="time" template-url="foo/bar.html"></div>')($rootScope);
$rootScope.$digest();
expect(element[0].tagName.toLowerCase()).toBe('div');
expect(element.html()).toBe('baz');
expect(element.html()).toBe('<div>baz</div>');
});

it('should expose the controller on the view', function() {
$templateCache.put('uib/template/timepicker/timepicker.html', '<div><div>{{timepicker.text}}</div></div>');

element = $compile('<uib-timepicker ng-model="time"></uib-timepicker>')($rootScope);
element = $compile('<div uib-timepicker ng-model="time"></div>')($rootScope);
$rootScope.$digest();

var ctrl = element.controller('uibTimepicker');
Expand All @@ -2139,14 +2139,14 @@ describe('timepicker directive', function() {
ctrl.text = 'foo';
$rootScope.$digest();

expect(element.html()).toBe('<div class="ng-binding">foo</div>');
expect(element.html()).toBe('<div><div class="ng-binding">foo</div></div>');
});
});

describe('ngDisabled', function() {
it('prevents modifying date via controls when true', function() {
$rootScope.disabled = false;
element = $compile('<uib-timepicker ng-model="time" ng-disabled="disabled"></uib-timepicker')($rootScope);
element = $compile('<div uib-timepicker ng-model="time" ng-disabled="disabled"></div>')($rootScope);
$rootScope.$digest();

var inputs = element.find('input');
Expand Down Expand Up @@ -2250,7 +2250,7 @@ describe('timepicker directive', function() {
var $scope;
beforeEach(inject(function() {
$scope = $rootScope.$new();
element = $compile('<uib-timepicker ng-model="time"></uib-timepicker>')($scope);
element = $compile('<div uib-timepicker ng-model="time"></div>')($scope);
$rootScope.$digest();
}));

Expand Down
2 changes: 1 addition & 1 deletion src/timepicker/timepicker.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -547,9 +547,9 @@ angular.module('ui.bootstrap.timepicker', [])
.directive('uibTimepicker', ['uibTimepickerConfig', function(uibTimepickerConfig) {
return {
require: ['uibTimepicker', '?^ngModel'],
restrict: 'A',
controller: 'UibTimepickerController',
controllerAs: 'timepicker',
replace: true,
scope: {},
templateUrl: function(element, attrs) {
return attrs.templateUrl || uibTimepickerConfig.templateUrl;
Expand Down

0 comments on commit 7518821

Please sign in to comment.