[jquery] width and height methods on JQuery can return undefined on empty sets.

Add tests for CSS-related methods on JQuery.
This commit is contained in:
Leonard Thieu
2017-06-18 18:19:18 -04:00
parent cb59acb817
commit 89b331e304
3 changed files with 475 additions and 17 deletions
+10 -9
View File
@@ -932,7 +932,7 @@ interface JQuery<TElement extends Node = HTMLElement> {
* @see {@link https://api.jquery.com/height/}
* @since 1.0
*/
height(): number;
height(): number | undefined;
/**
* Hide the matched elements.
*
@@ -1024,7 +1024,7 @@ interface JQuery<TElement extends Node = HTMLElement> {
* @see {@link https://api.jquery.com/innerHeight/}
* @since 1.2.6
*/
innerHeight(): number;
innerHeight(): number | undefined;
/**
* Set the CSS inner width of each element in the set of matched elements.
*
@@ -1044,7 +1044,7 @@ interface JQuery<TElement extends Node = HTMLElement> {
* @see {@link https://api.jquery.com/innerWidth/}
* @since 1.2.6
*/
innerWidth(): number;
innerWidth(): number | undefined;
/**
* Insert every element in the set of matched elements after the target.
*
@@ -1534,7 +1534,7 @@ interface JQuery<TElement extends Node = HTMLElement> {
* @see {@link https://api.jquery.com/outerHeight/}
* @since 1.2.6
*/
outerHeight(includeMargin?: boolean): number;
outerHeight(includeMargin?: boolean): number | undefined;
/**
* Set the CSS outer width of each element in the set of matched elements.
*
@@ -1554,7 +1554,7 @@ interface JQuery<TElement extends Node = HTMLElement> {
* @see {@link https://api.jquery.com/outerWidth/}
* @since 1.2.6
*/
outerWidth(includeMargin?: boolean): number;
outerWidth(includeMargin?: boolean): number | undefined;
/**
* Get the parent of each element in the current set of matched elements, optionally filtered by a selector.
*
@@ -2177,10 +2177,11 @@ interface JQuery<TElement extends Node = HTMLElement> {
* @since 1.3
* @since 1.4
*/
toggleClass(className: string | ((this: TElement, index: number, className: string, state: boolean) => string),
state?: boolean): this;
toggleClass<TState extends boolean>(className: string | ((this: TElement, index: number, className: string, state: TState) => string),
state?: TState): this;
/**
*
* Add or remove one or more classes from each element in the set of matched elements, depending on
* either the class's presence or the value of the state argument.
*
* @param state A boolean value to determine whether the class should be added or removed.
* @see {@link https://api.jquery.com/toggleClass/}
@@ -2314,7 +2315,7 @@ interface JQuery<TElement extends Node = HTMLElement> {
* @see {@link https://api.jquery.com/width/}
* @since 1.0
*/
width(): number;
width(): number | undefined;
/**
* Wrap an HTML structure around each element in the set of matched elements.
*
+457
View File
@@ -249,6 +249,463 @@ function JQuery() {
}
}
function css() {
// TODO: .css() getters can return 'undefined' for properties that don't exist. Consider changing the return types to reflect this after adding specialized signatures.
function css() {
// $ExpectType JQuery<HTMLElement>
$('p').css('cssProp', 'value');
// $ExpectType JQuery<HTMLElement>
$('p').css('cssProp', 20);
// $ExpectType JQuery<HTMLElement>
$('p').css('cssProp', function(index, value) {
// $ExpectType HTMLElement
this;
// $ExpectType number
index;
// $ExpectType string
value;
return 'value';
});
// $ExpectType JQuery<HTMLElement>
$('p').css('cssProp', function(index, value) {
// $ExpectType HTMLElement
this;
// $ExpectType number
index;
// $ExpectType string
value;
return 20;
});
// $ExpectType JQuery<HTMLElement>
$('p').css('cssProp', function(index, value) {
// $ExpectType HTMLElement
this;
// $ExpectType number
index;
// $ExpectType string
value;
});
// $ExpectType JQuery<HTMLElement>
$('p').css('cssProp', function(index, value) {
// $ExpectType HTMLElement
this;
// $ExpectType number
index;
// $ExpectType string
value;
return undefined;
});
// $ExpectType JQuery<HTMLElement>
$('p').css({
myProp1: 'value',
myProp2: 20,
myProp3(index, value) {
// $ExpectType HTMLElement
this;
// $ExpectType number
index;
// $ExpectType string
value;
return 'value';
},
myProp4(index, value) {
// $ExpectType HTMLElement
this;
// $ExpectType number
index;
// $ExpectType string
value;
return 20;
},
myProp5(index, value) {
// $ExpectType HTMLElement
this;
// $ExpectType number
index;
// $ExpectType string
value;
},
myProp6(index, value) {
// $ExpectType HTMLElement
this;
// $ExpectType number
index;
// $ExpectType string
value;
return undefined;
}
});
// $ExpectType string
$('p').css('myProp');
// $ExpectType PlainObject<string>
$('p').css([
'myProp1',
'myProp2'
]);
}
function height() {
// $ExpectType JQuery<HTMLElement>
$('p').height('200px');
// $ExpectType JQuery<HTMLElement>
$('p').height(400);
// $ExpectType JQuery<HTMLElement>
$('p').height(function(index, height) {
// $ExpectType HTMLElement
this;
// $ExpectType number
index;
// $ExpectType number
height;
return '200px';
});
// $ExpectType JQuery<HTMLElement>
$('p').height(function(index, height) {
// $ExpectType HTMLElement
this;
// $ExpectType number
index;
// $ExpectType number
height;
return 400;
});
// $ExpectType number | undefined
$('p').height();
}
function innerHeight() {
// $ExpectType JQuery<HTMLElement>
$('p').innerHeight('200px');
// $ExpectType JQuery<HTMLElement>
$('p').innerHeight(400);
// $ExpectType JQuery<HTMLElement>
$('p').innerHeight(function(index, height) {
// $ExpectType HTMLElement
this;
// $ExpectType number
index;
// $ExpectType number
height;
return '200px';
});
// $ExpectType JQuery<HTMLElement>
$('p').innerHeight(function(index, height) {
// $ExpectType HTMLElement
this;
// $ExpectType number
index;
// $ExpectType number
height;
return 400;
});
// $ExpectType number | undefined
$('p').innerHeight();
}
function outerHeight() {
// $ExpectType JQuery<HTMLElement>
$('p').outerHeight('200px');
// $ExpectType JQuery<HTMLElement>
$('p').outerHeight(400);
// $ExpectType JQuery<HTMLElement>
$('p').outerHeight(function(index, height) {
// $ExpectType HTMLElement
this;
// $ExpectType number
index;
// $ExpectType number
height;
return '200px';
});
// $ExpectType JQuery<HTMLElement>
$('p').outerHeight(function(index, height) {
// $ExpectType HTMLElement
this;
// $ExpectType number
index;
// $ExpectType number
height;
return 400;
});
// $ExpectType number | undefined
$('p').outerHeight();
// $ExpectType number | undefined
$('p').outerHeight(true);
}
function width() {
// $ExpectType JQuery<HTMLElement>
$('p').width('200px');
// $ExpectType JQuery<HTMLElement>
$('p').width(400);
// $ExpectType JQuery<HTMLElement>
$('p').width(function(index, width) {
// $ExpectType HTMLElement
this;
// $ExpectType number
index;
// $ExpectType number
width;
return '200px';
});
// $ExpectType JQuery<HTMLElement>
$('p').width(function(index, width) {
// $ExpectType HTMLElement
this;
// $ExpectType number
index;
// $ExpectType number
width;
return 400;
});
// $ExpectType number | undefined
$('p').width();
}
function innerWidth() {
// $ExpectType JQuery<HTMLElement>
$('p').innerWidth('200px');
// $ExpectType JQuery<HTMLElement>
$('p').innerWidth(400);
// $ExpectType JQuery<HTMLElement>
$('p').innerWidth(function(index, width) {
// $ExpectType HTMLElement
this;
// $ExpectType number
index;
// $ExpectType number
width;
return '200px';
});
// $ExpectType JQuery<HTMLElement>
$('p').innerWidth(function(index, width) {
// $ExpectType HTMLElement
this;
// $ExpectType number
index;
// $ExpectType number
width;
return 400;
});
// $ExpectType number | undefined
$('p').innerWidth();
}
function outerWidth() {
// $ExpectType JQuery<HTMLElement>
$('p').outerWidth('200px');
// $ExpectType JQuery<HTMLElement>
$('p').outerWidth(400);
// $ExpectType JQuery<HTMLElement>
$('p').outerWidth(function(index, width) {
// $ExpectType HTMLElement
this;
// $ExpectType number
index;
// $ExpectType number
width;
return '200px';
});
// $ExpectType JQuery<HTMLElement>
$('p').outerWidth(function(index, width) {
// $ExpectType HTMLElement
this;
// $ExpectType number
index;
// $ExpectType number
width;
return 400;
});
// $ExpectType number | undefined
$('p').outerWidth();
// $ExpectType number | undefined
$('p').outerWidth(true);
}
function offset() {
// $ExpectType JQuery<HTMLElement>
$('p').offset({
left: 20,
top: 50
});
// $ExpectType JQuery<HTMLElement>
$('p').offset(function(index, coords) {
// $ExpectType HTMLElement
this;
// $ExpectType number
index;
// $ExpectType Coordinates
coords;
return {
left: 20,
top: 50
};
});
// $ExpectType Coordinates
$('p').offset();
}
function position() {
// $ExpectType Coordinates
$('p').position();
}
function scrollLeft() {
// $ExpectType JQuery<HTMLElement>
$('p').scrollLeft(200);
// $ExpectType number
$('p').scrollLeft();
}
function scrollTop() {
// $ExpectType JQuery<HTMLElement>
$('p').scrollTop(200);
// $ExpectType number
$('p').scrollTop();
}
function addClass() {
// $ExpectType JQuery<HTMLElement>
$('p').addClass('className');
// $ExpectType JQuery<HTMLElement>
$('p').addClass(function(index, currentClassName) {
// $ExpectType HTMLElement
this;
// $ExpectType number
index;
// $ExpectType string
currentClassName;
return 'className';
});
}
function hasClass() {
// $ExpectType boolean
$('p').hasClass('className');
}
function removeClass() {
// $ExpectType JQuery<HTMLElement>
$('p').removeClass('className');
// $ExpectType JQuery<HTMLElement>
$('p').removeClass(function(index, currentClassName) {
// $ExpectType HTMLElement
this;
// $ExpectType number
index;
// $ExpectType string
currentClassName;
return 'className';
});
// $ExpectType JQuery<HTMLElement>
$('p').removeClass();
}
function toggleClass() {
// $ExpectType JQuery<HTMLElement>
$('p').toggleClass('className', true);
// $ExpectType JQuery<HTMLElement>
$('p').toggleClass(function(index, className, state) {
// $ExpectType HTMLElement
this;
// $ExpectType number
index;
// $ExpectType string
className;
// $ExpectType true
state;
return 'className';
}, true);
// $ExpectType JQuery<HTMLElement>
$('p').toggleClass('className');
// $ExpectType JQuery<HTMLElement>
$('p').toggleClass(function(index, className, state) {
// $ExpectType HTMLElement
this;
// $ExpectType number
index;
// $ExpectType string
className;
// $ExpectType boolean
state;
return 'className';
});
// $ExpectType JQuery<HTMLElement>
$('p').toggleClass(false);
// $ExpectType JQuery<HTMLElement>
$('p').toggleClass();
}
}
function on() {
function false_handler_shorthand() {
$().on('events', false);
+8 -8
View File
@@ -1822,8 +1822,8 @@ function examples() {
}
function finish_0() {
var horiz = $('#path').width() - 20,
vert = $('#path').height() - 20;
var horiz = $('#path').width()! - 20,
vert = $('#path').height()! - 20;
var btns: { [key: string]: () => void; } = {
bstt: function() {
@@ -1992,13 +1992,13 @@ function examples() {
}
$('#getp').click(function() {
showHeight('paragraph', $('p').height());
showHeight('paragraph', $('p').height()!);
});
$('#getd').click(function() {
showHeight('document', $(document).height());
showHeight('document', $(document).height()!);
});
$('#getw').click(function() {
showHeight('window', $(window).height());
showHeight('window', $(window).height()!);
});
}
@@ -4935,13 +4935,13 @@ function examples() {
}
$('#getp').click(function() {
showWidth('paragraph', $('p').width());
showWidth('paragraph', $('p').width()!);
});
$('#getd').click(function() {
showWidth('document', $(document).width());
showWidth('document', $(document).width()!);
});
$('#getw').click(function() {
showWidth('window', $(window).width());
showWidth('window', $(window).width()!);
});
}