~lutostag/ubuntu/utopic/maas/1.5.2

« back to all changes in this revision

Viewing changes to src/maasserver/static/jslibs/yui/3.4.1/tests/widget-modality/tests/unit-tests.html

  • Committer: Package Import Robot
  • Author(s): Andres Rodriguez
  • Date: 2012-03-15 18:14:08 UTC
  • mfrom: (1.1.3)
  • Revision ID: package-import@ubuntu.com-20120315181408-zgl94hzo0x4n99an
Tags: 0.1+bzr295+dfsg-0ubuntu2
* debian/patches:
  - 01-fix-database-settings.patch: Update to set PSERV_URL.
  - 02-pserv-config.patch: Set port to 8001.
* debian/maas.postinst: Run maas-import-isos on install.
* debian/control: Depends on rabbitmq-server.

Show diffs side-by-side

added added

removed removed

Lines of Context:
 
1
 
 
2
<!DOCTYPE html> 
 
3
<html> 
 
4
<head> 
 
5
    <title>Overlay  Test</title> 
 
6
        <link type="text/css" rel="stylesheet" href="http://yui.yahooapis.com/3.3.0/build/cssfonts/fonts-min.css" /> 
 
7
        <script src="../../../build/yui/yui-min.js"></script> 
 
8
    <style type="text/css"> 
 
9
      #results {
 
10
                width: 60%;
 
11
      }
 
12
      .yui3-widget-mask { background: rgba(0,0,0,0.8); }
 
13
      .yui3-overlay {
 
14
        border: 1px solid #ccc;
 
15
        border-radius: 5px;
 
16
        background-color: #fff;
 
17
      }
 
18
      body {
 
19
          font-family: sans-serif;
 
20
          font-size:12px;
 
21
          line-height:18px;
 
22
      }
 
23
 
 
24
      #desc {
 
25
        margin-bottom:20px;
 
26
        border-bottom:1px dotted #333;
 
27
      }
 
28
      #desc span {
 
29
        padding:2px;
 
30
      }
 
31
 
 
32
 
 
33
    </style> 
 
34
</head> 
 
35
<body class="yui3-skin-sam yui-skin-sam">
 
36
 
 
37
<div id="desc">
 
38
<h1><code>Y.Plugin.WidgetModal</code> Unit Tests</h1>
 
39
<span>These unit tests for <code>Y.Plugin.Modal</code>cover the general use cases. Namely:
 
40
<ul>
 
41
  <li>Making an overlay modal</li>
 
42
  <li>Nested Modality (modal overlay opening a modal overlay)</li>
 
43
  <li>Various modal widgets (charts & dial)</li>
 
44
  <li>Making sure mask moves around DOM</li>
 
45
</ul>
 
46
 
 
47
Currently there's not a great way to test to make sure that the modal widget is receiving focus. For this, refer to the manual test at <code>modality.html</code>
 
48
 
 
49
</span>
 
50
</div>
 
51
 
 
52
 <div id="overlayContainer"></div>
 
53
<div id="results"></div> 
 
54
<script type="text/javascript"> 
 
55
 
 
56
/* globals YUI */
 
57
YUI({
 
58
  filter: 'raw'
 
59
}).use("overlay", "dial", "charts", "widget-modality", 'test', 'console','dump', function (Y) {
 
60
  
 
61
    var Assert = Y.Assert, r,
 
62
        results = Y.one('#results'), suite,
 
63
        overlayCfg = {
 
64
            id: 'myOverlay',
 
65
            headerContent: 'Demo Overlay',
 
66
            bodyContent: 'This is example overlay content',
 
67
            footerContent: 'Overlay Footer',
 
68
            visible: false,
 
69
            height: 200,
 
70
            width: 400,
 
71
            centered: true,
 
72
            plugins: [Y.Plugin.Modal]
 
73
        };
 
74
 
 
75
        nestedCfg = {
 
76
          id: 'nestedOverlay',
 
77
          headerContent: 'Nested Overlay',
 
78
          bodyContent: 'This is example nestd overlay content',
 
79
          footerContent: 'nested overlay Footer',
 
80
          visible: false,
 
81
          height: 400,
 
82
          width: 500,
 
83
          centered: true,
 
84
          plugins: [Y.Plugin.WidgetModal]
 
85
        }
 
86
 
 
87
 
 
88
    var modalityTests = new Y.Test.Case({
 
89
        name : "Overlay Tests",
 
90
        //---------------------------------------------------------------------
 
91
        // Test methods - names must begin with "test"
 
92
        //---------------------------------------------------------------------
 
93
        
 
94
        overlay: undefined,
 
95
        nested: undefined,
 
96
        dial:undefined,
 
97
        chart:undefined,
 
98
 
 
99
        setUp : function () {
 
100
            
 
101
            var container = Y.Node.create('<div id="overlayContainer"></div>');
 
102
            Y.one('body').appendChild(container);
 
103
 
 
104
            this.overlay = new Y.Overlay(overlayCfg);
 
105
            this.overlay.plug(Y.Plugin.WidgetModal);
 
106
            this.overlay.render('#overlayContainer');
 
107
        },
 
108
 
 
109
        /*
 
110
         * Cleans up everything that was created by setUp().
 
111
         */
 
112
        tearDown : function () {
 
113
          Y.one('#overlayContainer').remove();
 
114
          if (this.overlay) {
 
115
            this.overlay.destroy();
 
116
          }
 
117
          
 
118
          if (this.dial) {
 
119
            this.dial.destroy();
 
120
          }
 
121
 
 
122
          if (this.chart) {
 
123
            this.chart.destroy();
 
124
          }
 
125
          if (this.nested) {
 
126
            this.nested.destroy();
 
127
          }
 
128
          
 
129
 
 
130
        },
 
131
 
 
132
        //instantiates a basic modal overlay and checks to see that mask is displayed, and zIndex is same
 
133
        testDefaultOverlay : function () {
 
134
            this.overlay = new Y.Overlay(overlayCfg);
 
135
            this.overlay.plug(Y.Plugin.WidgetModal);
 
136
            this.overlay.render('#overlayContainer');
 
137
            this.overlay.show();
 
138
 
 
139
            var mask = Y.one(".yui3-widget-mask");
 
140
            var mask_zIndex = parseInt(mask.getStyle('zIndex'));
 
141
 
 
142
 
 
143
            Assert.areSame(mask.getStyle('display'), "block", "Mask should be display:block");
 
144
            Assert.areSame(mask_zIndex, this.overlay.get('zIndex'), "Mask zIndex is not equal to overlay zIndex");
 
145
 
 
146
            Assert.areSame(Y.one('#overlayContainer').get('children')._nodes[0], mask.getDOMNode(), "Mask is not positioned correctly in DOM");
 
147
 
 
148
 
 
149
            this.overlay.hide();
 
150
 
 
151
 
 
152
            Assert.areSame(mask.getStyle('display'), "none", "Mask should be display:none");
 
153
 
 
154
            //Assert.areSame(overlayCfg.headerContent, Y.one('#myOverlay .yui3-widget-hd').get('innerHTML'), "Test Header");
 
155
            //Assert.areSame(overlayCfg.footerContent, Y.one('#myOverlay .yui3-widget-ft').get('innerHTML'), "Test Footer");
 
156
            // A.areSame('block', Y.one('.yui3-overlay-mask').getStyle('display'), "Test Mask");
 
157
            //overlay.hide();
 
158
            //A.isTrue(Y.one('#myOverlay').hasClass('yui3-ia-widget-modaloverlay-hidden'), "Test Overlay");
 
159
            //A.areSame('none', Y.one('.yui3-overlay-mask').getStyle('display'), "Test Mask");
 
160
        },
 
161
 
 
162
 
 
163
        //creates a bunch of widgets one by one, to make sure the mask moves around as needed
 
164
        testMultipleWidgets: function() {
 
165
 
 
166
          var containers = Y.Node.create('<div id="dialContainer"></div><div id="chartContainer"></div>');
 
167
          Y.one("body").appendChild(containers);
 
168
          
 
169
          var mask = Y.one('.yui3-widget-mask');
 
170
          this.overlay = new Y.Overlay(overlayCfg);
 
171
          this.overlay.plug(Y.Plugin.WidgetModal);
 
172
          this.overlay.render('#overlayContainer');
 
173
          this.overlay.show();
 
174
 
 
175
 
 
176
          Assert.areSame(mask.getStyle('display'), "block", "Mask should be display:block");
 
177
          Assert.areSame(parseInt(mask.getStyle('zIndex')), this.overlay.get('zIndex'), "Mask zIndex is not equal to overlay zIndex");
 
178
          Assert.areSame(Y.one('#overlayContainer').get('children')._nodes[0], mask.getDOMNode(), "Mask is not positioned correctly in DOM");
 
179
 
 
180
 
 
181
          this.overlay.hide();
 
182
 
 
183
 
 
184
          this.dial = new Y.Dial({
 
185
             min:-220,
 
186
             max:220,
 
187
             stepsPerRev:100,
 
188
             value: 30,
 
189
           });
 
190
 
 
191
           this.dial.plug(Y.Plugin.Modal);
 
192
 
 
193
           this.dial.render('#dialContainer');
 
194
 
 
195
           Assert.areSame(mask.getStyle('display'), "block", "Mask should be display:block when dial is shown");
 
196
           Assert.areSame(Y.one('#dialContainer').get('children')._nodes[0], mask.getDOMNode(), "Mask is not positioned correctly in DOM for Dial");
 
197
 
 
198
           this.dial.hide();
 
199
 
 
200
           Assert.areSame(mask.getStyle('display'), "none", "Mask should be display:block when dial is hidden");
 
201
 
 
202
           //Charts
 
203
           var myDataValues = [ 
 
204
                {category:"5/1/2010", values:2000}, 
 
205
                {category:"5/2/2010", values:50}, 
 
206
                {category:"5/3/2010", values:400}, 
 
207
                {category:"5/4/2010", values:200}, 
 
208
                {category:"5/5/2010", values:5000}
 
209
            ];
 
210
           
 
211
            this.chart = new Y.Chart({dataProvider:myDataValues});
 
212
            this.chart.plug(Y.Plugin.Modal);
 
213
 
 
214
            this.chart.render('#chartContainer');
 
215
 
 
216
            Assert.areSame(mask.getStyle('display'), "block", "Mask should be display:block when chart is shown");
 
217
            Assert.areSame(Y.one('#chartContainer').get('children')._nodes[0], mask.getDOMNode(), "Mask is not positioned correctly in DOM for Chart");
 
218
 
 
219
            this.chart.hide();
 
220
 
 
221
            Assert.areSame(mask.getStyle('display'), "none", "Mask should be display:block when chart is hidden");
 
222
 
 
223
        },
 
224
 
 
225
 
 
226
        testNesting: function() {
 
227
          
 
228
          var mask = Y.one('.yui3-widget-mask');
 
229
          var self = this;
 
230
          
 
231
          //add dom node
 
232
          Y.one('body').appendChild(Y.Node.create('<div id="nestedContainer"></div>'));
 
233
 
 
234
          //create overlay
 
235
          this.overlay = new Y.Overlay(overlayCfg);
 
236
          this.overlay.plug(Y.Plugin.WidgetModal);
 
237
          this.overlay.render('#overlayContainer');
 
238
          this.overlay.show();
 
239
 
 
240
          //create nested overlay
 
241
          this.overlay.after('render', function() {
 
242
            self.nested = new Y.Overlay(overlayCfg);
 
243
            self.nested.set('zIndex', 5);
 
244
            self.nested.plug(Y.Plugin.WidgetModal);
 
245
            self.nested.render('#nestedContainer');
 
246
            self.nested.show();
 
247
 
 
248
 
 
249
            Assert.areSame(mask.getStyle('display'), "block", "Mask should be display:block when nested overlay is shown");
 
250
            Assert.areSame(Y.one('#nestedContainer').get('children')._nodes[0], mask.getDOMNode(), "Mask is not positioned correctly in DOM for nested overlay");
 
251
            Assert.areSame(parseInt(mask.getStyle('zIndex')), self.nested.get('zIndex'), "Mask zIndex is not equal to overlay zIndex");
 
252
 
 
253
          });
 
254
        },
 
255
 
 
256
 
 
257
        testPluginOnConfig: function() {
 
258
           
 
259
           //Charts
 
260
           var mask = Y.one(".yui3-widget-mask");
 
261
           var myDataValues = [ 
 
262
                {category:"5/1/2010", values:2000}, 
 
263
                {category:"5/2/2010", values:50}, 
 
264
                {category:"5/3/2010", values:400}, 
 
265
                {category:"5/4/2010", values:200}, 
 
266
                {category:"5/5/2010", values:5000}
 
267
            ];
 
268
           
 
269
            this.chart = new Y.Chart({dataProvider:myDataValues, plugins: [Y.Plugin.Modal]});
 
270
 
 
271
            this.chart.render('#chartContainer');
 
272
 
 
273
            Assert.areSame(mask.getStyle('display'), "block", "Mask should be display:block when chart is shown");
 
274
            Assert.areSame(Y.one('#chartContainer').get('children')._nodes[0], mask.getDOMNode(), "Mask is not positioned correctly in DOM for Chart");
 
275
 
 
276
            this.chart.hide();
 
277
 
 
278
            Assert.areSame(mask.getStyle('display'), "none", "Mask should be display:block when chart is hidden");
 
279
        }
 
280
    });
 
281
 
 
282
    //create the console
 
283
    r = new Y.Console({
 
284
        newestOnTop : false
 
285
    });
 
286
 
 
287
    r.render('#log');
 
288
 
 
289
    suite = new Y.Test.Suite("Widget Modality Test Suite");
 
290
    suite.add(modalityTests);
 
291
 
 
292
    Y.Test.Runner.setName("Widget Modality Tests");
 
293
    Y.Test.Runner.add(suite);
 
294
    Y.Test.Runner.run();
 
295
});
 
296
</script> 
 
297
</body> 
 
298
</html> 
 
 
b'\\ No newline at end of file'