Fix tabs vs spaces in initial workaround commit
[jquery.git] / test / unit / dimensions.js
1 module("dimensions");
2
3 function pass( val ) {
4         return val;
5 }
6
7 function fn( val ) {
8         return function(){ return val; };
9 }
10
11 function testWidth( val ) {
12         expect(8);
13
14         var $div = jQuery("#nothiddendiv");
15         $div.width( val(30) );
16         equals($div.width(), 30, "Test set to 30 correctly");
17         $div.hide();
18         equals($div.width(), 30, "Test hidden div");
19         $div.show();
20         $div.width( val(-1) ); // handle negative numbers by ignoring #1599
21         equals($div.width(), 30, "Test negative width ignored");
22         $div.css("padding", "20px");
23         equals($div.width(), 30, "Test padding specified with pixels");
24         $div.css("border", "2px solid #fff");
25         equals($div.width(), 30, "Test border specified with pixels");
26
27         $div.css({ display: "", border: "", padding: "" });
28
29         jQuery("#nothiddendivchild").css({ width: 20, padding: "3px", border: "2px solid #fff" });
30         equals(jQuery("#nothiddendivchild").width(), 20, "Test child width with border and padding");
31         jQuery("#nothiddendiv, #nothiddendivchild").css({ border: "", padding: "", width: "" });
32
33         var blah = jQuery("blah");
34         equals( blah.width( val(10) ), blah, "Make sure that setting a width on an empty set returns the set." );
35         equals( blah.width(), null, "Make sure 'null' is returned on an empty set");
36 }
37
38 test("width()", function() {
39         testWidth( pass );
40 });
41
42 test("width() with function", function() {
43         testWidth( fn );
44 });
45
46 test("width() with function args", function() {
47         expect( 2 );
48
49         var $div = jQuery("#nothiddendiv");
50         $div.width( 30 ).width(function(i, width) {
51                 equals( width, 30, "Make sure previous value is corrrect." );
52                 return width + 1;
53         });
54
55         equals( $div.width(), 31, "Make sure value was modified correctly." );
56 });
57
58 function testHeight( val ) {
59         expect(8);
60
61         var $div = jQuery("#nothiddendiv");
62         $div.height( val(30) );
63         equals($div.height(), 30, "Test set to 30 correctly");
64         $div.hide();
65         equals($div.height(), 30, "Test hidden div");
66         $div.show();
67         $div.height( val(-1) ); // handle negative numbers by ignoring #1599
68         equals($div.height(), 30, "Test negative height ignored");
69         $div.css("padding", "20px");
70         equals($div.height(), 30, "Test padding specified with pixels");
71         $div.css("border", "2px solid #fff");
72         equals($div.height(), 30, "Test border specified with pixels");
73
74         $div.css({ display: "", border: "", padding: "", height: "1px" });
75
76         jQuery("#nothiddendivchild").css({ height: 20, padding: "3px", border: "2px solid #fff" });
77         equals(jQuery("#nothiddendivchild").height(), 20, "Test child height with border and padding");
78         jQuery("#nothiddendiv, #nothiddendivchild").css({ border: "", padding: "", height: "" });
79
80         var blah = jQuery("blah");
81         equals( blah.height( val(10) ), blah, "Make sure that setting a height on an empty set returns the set." );
82         equals( blah.height(), null, "Make sure 'null' is returned on an empty set");
83 }
84
85 test("height()", function() {
86         testHeight( pass );
87 });
88
89 test("height() with function", function() {
90         testHeight( fn );
91 });
92
93 test("height() with function args", function() {
94         expect( 2 );
95
96         var $div = jQuery("#nothiddendiv");
97         $div.height( 30 ).height(function(i, height) {
98                 equals( height, 30, "Make sure previous value is corrrect." );
99                 return height + 1;
100         });
101
102         equals( $div.height(), 31, "Make sure value was modified correctly." );
103 });
104
105 test("innerWidth()", function() {
106         expect(4);
107
108         var $div = jQuery("#nothiddendiv");
109         // set styles
110         $div.css({
111                 margin: 10,
112                 border: "2px solid #fff",
113                 width: 30
114         });
115
116         equals($div.innerWidth(), 30, "Test with margin and border");
117         $div.css("padding", "20px");
118         equals($div.innerWidth(), 70, "Test with margin, border and padding");
119         $div.hide();
120         equals($div.innerWidth(), 70, "Test hidden div");
121
122         // reset styles
123         $div.css({ display: "", border: "", padding: "", width: "", height: "" });
124
125         var div = jQuery( "<div>" );
126
127         // Temporarily require 0 for backwards compat - should be auto
128         equals( div.innerWidth(), 0, "Make sure that disconnected nodes are handled." );
129 });
130
131 test("innerHeight()", function() {
132         expect(4);
133
134         var $div = jQuery("#nothiddendiv");
135         // set styles
136         $div.css({
137                 margin: 10,
138                 border: "2px solid #fff",
139                 height: 30
140         });
141
142         equals($div.innerHeight(), 30, "Test with margin and border");
143         $div.css("padding", "20px");
144         equals($div.innerHeight(), 70, "Test with margin, border and padding");
145         $div.hide();
146         equals($div.innerHeight(), 70, "Test hidden div");
147
148         // reset styles
149         $div.css({ display: "", border: "", padding: "", width: "", height: "" });
150
151         var div = jQuery( "<div>" );
152
153         // Temporarily require 0 for backwards compat - should be auto
154         equals( div.innerHeight(), 0, "Make sure that disconnected nodes are handled." );
155 });
156
157 test("outerWidth()", function() {
158         expect(7);
159
160         var $div = jQuery("#nothiddendiv");
161         $div.css("width", 30);
162
163         equals($div.outerWidth(), 30, "Test with only width set");
164         $div.css("padding", "20px");
165         equals($div.outerWidth(), 70, "Test with padding");
166         $div.css("border", "2px solid #fff");
167         equals($div.outerWidth(), 74, "Test with padding and border");
168         $div.css("margin", "10px");
169         equals($div.outerWidth(), 74, "Test with padding, border and margin without margin option");
170         $div.css("position", "absolute");
171         equals($div.outerWidth(true), 94, "Test with padding, border and margin with margin option");
172         $div.hide();
173         equals($div.outerWidth(true), 94, "Test hidden div with padding, border and margin with margin option");
174
175         // reset styles
176         $div.css({ position: "", display: "", border: "", padding: "", width: "", height: "" });
177
178         var div = jQuery( "<div>" );
179
180         // Temporarily require 0 for backwards compat - should be auto
181         equals( div.outerWidth(), 0, "Make sure that disconnected nodes are handled." );
182 });
183
184 test("outerHeight()", function() {
185         expect(7);
186
187         var $div = jQuery("#nothiddendiv");
188         $div.css("height", 30);
189
190         equals($div.outerHeight(), 30, "Test with only width set");
191         $div.css("padding", "20px");
192         equals($div.outerHeight(), 70, "Test with padding");
193         $div.css("border", "2px solid #fff");
194         equals($div.outerHeight(), 74, "Test with padding and border");
195         $div.css("margin", "10px");
196         equals($div.outerHeight(), 74, "Test with padding, border and margin without margin option");
197         equals($div.outerHeight(true), 94, "Test with padding, border and margin with margin option");
198         $div.hide();
199         equals($div.outerHeight(true), 94, "Test hidden div with padding, border and margin with margin option");
200
201         // reset styles
202         $div.css({ display: "", border: "", padding: "", width: "", height: "" });
203
204         var div = jQuery( "<div>" );
205
206         // Temporarily require 0 for backwards compat - should be auto
207         equals( div.outerHeight(), 0, "Make sure that disconnected nodes are handled." );
208 });