~ubuntu-branches/ubuntu/trusty/unity8/trusty-proposed

« back to all changes in this revision

Viewing changes to tests/qmltests/Dash/tst_Card.qml

  • Committer: Package Import Robot
  • Author(s): Didier Roche
  • Date: 2014-02-03 16:56:47 UTC
  • mfrom: (1.1.64)
  • Revision ID: package-import@ubuntu.com-20140203165647-ik9w833cac4zu9da
Tags: 7.84+14.04.20140130.is.7.84+14.04.20131220-0ubuntu1
Reverting to last known good version, as after installing a click
application, it redirects you to the first click application everytime.
(LP: #1275832)

Show diffs side-by-side

added added

removed removed

Lines of Context:
1
 
/*
2
 
 * Copyright (C) 2013 Canonical, Ltd.
3
 
 *
4
 
 * This program is free software; you can redistribute it and/or modify
5
 
 * it under the terms of the GNU General Public License as published by
6
 
 * the Free Software Foundation; version 3.
7
 
 *
8
 
 * This program is distributed in the hope that it will be useful,
9
 
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
10
 
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
11
 
 * GNU General Public License for more details.
12
 
 *
13
 
 * You should have received a copy of the GNU General Public License
14
 
 * along with this program.  If not, see <http://www.gnu.org/licenses/>.
15
 
 */
16
 
 
17
 
import QtQuick 2.0
18
 
import QtTest 1.0
19
 
import Ubuntu.Components 0.1
20
 
import Unity.Test 0.1 as UT
21
 
import "../../../qml/Dash"
22
 
import "CardHelpers.js" as Helpers
23
 
 
24
 
Rectangle {
25
 
    id: root
26
 
    width: units.gu(80)
27
 
    height: units.gu(72)
28
 
    color: "#88FFFFFF"
29
 
 
30
 
    property string defaultLayout: '
31
 
    {
32
 
      "schema-version": 1,
33
 
      "template": {
34
 
        "category-layout": "grid",
35
 
        "card-layout": "vertical",
36
 
        "card-size": "medium",
37
 
        "overlay-mode": null,
38
 
        "collapsed-rows": 2
39
 
      },
40
 
      "components": {
41
 
        "title": null,
42
 
        "art": {
43
 
            "aspect-ratio": 1.0,
44
 
            "fill-mode": "crop"
45
 
        },
46
 
        "subtitle": null,
47
 
        "mascot": null,
48
 
        "emblem": null,
49
 
        "old-price": null,
50
 
        "price": null,
51
 
        "alt-price": null,
52
 
        "rating": {
53
 
          "type": "stars",
54
 
          "range": [0, 5],
55
 
          "full": "image://theme/rating-star-full",
56
 
          "half": "image://theme/rating-star-half",
57
 
          "empty": "image://theme/rating-star-empty"
58
 
        },
59
 
        "alt-rating": null,
60
 
        "summary": null
61
 
      },
62
 
      "resources": {}
63
 
    }'
64
 
 
65
 
    property string cardData: '
66
 
    {
67
 
      "art": "../../tests/qmltests/Dash/artwork/music-player-design.png",
68
 
      "mascot": "../../tests/qmltests/Dash/artwork/avatar.png",
69
 
      "title": "foo",
70
 
      "subtitle": "bar",
71
 
      "summary": "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
72
 
    }'
73
 
 
74
 
    property string fullMapping: '
75
 
    {
76
 
      "title": "title",
77
 
      "art": "art",
78
 
      "subtitle": "subtitle",
79
 
      "mascot": "mascot",
80
 
      "summary": "summary"
81
 
    }'
82
 
 
83
 
    property var cardsModel: [
84
 
        {
85
 
            "name": "Art, header, summary - vertical",
86
 
            "layout": { "components": JSON.parse(fullMapping) }
87
 
        },
88
 
        {
89
 
            "name": "Art, header, summary - vertical, small",
90
 
            "layout": { "template": { "card-size": "small" }, "components": JSON.parse(fullMapping) }
91
 
        },
92
 
        {
93
 
            "name": "Art, header, summary - vertical, large",
94
 
            "layout": { "template": { "card-size": "large" }, "components": JSON.parse(fullMapping) }
95
 
        },
96
 
        {
97
 
            "name": "Art, header, summary - vertical, wide",
98
 
            "layout": { "components": Helpers.update(JSON.parse(root.fullMapping), { "art": { "aspect-ratio": 2 } }) }
99
 
        },
100
 
        {
101
 
            "name": "Art, title - vertical, fitted",
102
 
            "layout": { "components": Helpers.update(JSON.parse(root.fullMapping), { "art": { "fill-mode": "fit" } }) }
103
 
        },
104
 
        {
105
 
            "name": "Art, header, summary - horizontal",
106
 
            "layout": { "template": { "card-layout": "horizontal" },
107
 
                        "components": JSON.parse(fullMapping) }
108
 
        },
109
 
        {
110
 
            "name": "Art, header - vertical",
111
 
            "layout": { "components": Helpers.update(JSON.parse(root.fullMapping), { "summary": undefined }) }
112
 
        },
113
 
        {
114
 
            "name": "Header title only - horizontal",
115
 
            "layout": { "template": { "card-layout": "horizontal" },
116
 
                        "components": { "title": "title" } }
117
 
        },
118
 
    ]
119
 
 
120
 
    Card {
121
 
        id: card
122
 
        anchors { top: parent.top; left: parent.left; margins: units.gu(1) }
123
 
 
124
 
        template: Helpers.update(JSON.parse(root.defaultLayout), Helpers.tryParse(layoutArea.text, layoutError))['template'];
125
 
        components: Helpers.update(JSON.parse(root.defaultLayout), Helpers.tryParse(layoutArea.text, layoutError))['components'];
126
 
        cardData: Helpers.mapData(dataArea.text, components, dataError)
127
 
    }
128
 
 
129
 
    Rectangle {
130
 
        anchors { top: parent.top; bottom: parent.bottom; right: parent.right}
131
 
        width: units.gu(40)
132
 
        color: "lightgrey"
133
 
 
134
 
        Column {
135
 
            anchors { fill: parent; margins: units.gu(1) }
136
 
            spacing: units.gu(1)
137
 
 
138
 
            OptionSelector {
139
 
                id: selector
140
 
                model: cardsModel
141
 
                delegate: OptionSelectorDelegate { text: modelData.name }
142
 
                onSelectedIndexChanged: updateAreas()
143
 
                Component.onCompleted: updateAreas()
144
 
 
145
 
                function updateAreas() {
146
 
                    var element = cardsModel[selectedIndex];
147
 
                    if (element) {
148
 
                        layoutArea.text = JSON.stringify(element.layout, undefined, 2) || "{}";
149
 
                        // FIXME: don't overwrite data
150
 
                        var data = JSON.parse(root.cardData);
151
 
                        Helpers.update(data, element.data);
152
 
                        dataArea.text = JSON.stringify(data, undefined, 2) || "{}";
153
 
                    } else {
154
 
                        layoutArea.text = "";
155
 
                        dataArea.text = "";
156
 
                    }
157
 
 
158
 
                }
159
 
            }
160
 
 
161
 
            TextArea {
162
 
                id: layoutArea
163
 
                anchors { left: parent.left; right: parent.right }
164
 
                height: units.gu(25)
165
 
            }
166
 
 
167
 
            Label {
168
 
                id: layoutError
169
 
                anchors { left: parent.left; right: parent.right }
170
 
                height: units.gu(4)
171
 
                color: "orange"
172
 
            }
173
 
 
174
 
            TextArea {
175
 
                id: dataArea
176
 
                anchors { left: parent.left; right: parent.right }
177
 
                height: units.gu(25)
178
 
            }
179
 
 
180
 
            Label {
181
 
                id: dataError
182
 
                anchors { left: parent.left; right: parent.right }
183
 
                height: units.gu(4)
184
 
                color: "orange"
185
 
            }
186
 
        }
187
 
    }
188
 
 
189
 
    UT.UnityTestCase {
190
 
        id: testCase
191
 
        name: "Card"
192
 
 
193
 
        when: windowShown
194
 
 
195
 
        property Item header: findChild(card, "cardHeader")
196
 
        property Item art: findChild(card, "artShape")
197
 
        property Item artImage: findChild(card, "artImage")
198
 
        property Item summary: findChild(card, "summaryLabel")
199
 
 
200
 
        function initTestCase() {
201
 
            verify(typeof testCase.header === "object", "Couldn't find header object.");
202
 
            verify(typeof testCase.art === "object", "Couldn't find art object.");
203
 
            verify(typeof testCase.artImage === "object", "Couldn't find artImage object.");
204
 
            verify(typeof testCase.summary === "object", "Couldn't find summary object.");
205
 
        }
206
 
 
207
 
        function cleanup() {
208
 
            selector.selectedIndex = -1;
209
 
        }
210
 
 
211
 
 
212
 
        function test_header_binding_data() {
213
 
            return [
214
 
                { tag: "Mascot", property: "mascot", value: Qt.resolvedUrl("artwork/avatar.png"), index: 0 },
215
 
                { tag: "Title", property: "title", value: "foo", index: 0 },
216
 
                { tag: "Subtitle", property: "subtitle", value: "bar", index: 0 },
217
 
            ];
218
 
        }
219
 
 
220
 
        function test_header_binding(data) {
221
 
            selector.selectedIndex = data.index;
222
 
            tryCompare(testCase.header, data.property, data.value);
223
 
        }
224
 
 
225
 
        function test_card_binding_data() {
226
 
            return [
227
 
                { tag: "Art", object: artImage, property: "source", value: Qt.resolvedUrl("artwork/music-player-design.png"), index: 0 },
228
 
                { tag: "Summary", object: summary, property: "text", field: "summary", index: 0 },
229
 
                { tag: "Fit", object: art, fill: Image.PreserveAspectFit, index: 4 },
230
 
            ];
231
 
        }
232
 
 
233
 
        function test_card_binding(data) {
234
 
            selector.selectedIndex = data.index;
235
 
 
236
 
            if (data.hasOwnProperty('value')) {
237
 
                tryCompare(data.object, data.property, data.value);
238
 
            }
239
 
 
240
 
            if (data.hasOwnProperty('field')) {
241
 
                tryCompare(data.object, data.property, card.cardData[data.field]);
242
 
            }
243
 
        }
244
 
 
245
 
        function test_card_size_data() {
246
 
            return [
247
 
                { tag: "Medium", width: units.gu(18.5), index: 0 },
248
 
                { tag: "Small", width: units.gu(12), size: "small", index: 0 },
249
 
                { tag: "Large", width: units.gu(38), size: "large", index: 0 },
250
 
                { tag: "Wide", width: units.gu(18.5), aspect: 0.5, index: 0 },
251
 
                { tag: "Horizontal", width: units.gu(38), index: 5 },
252
 
                // Make sure card ends with header when there's no summary
253
 
                { tag: "NoSummary", height: function() { return header.y + header.height }, index: 6 },
254
 
                { tag: "HorizontalNoSummary", height: function() { return header.height }, card_layout: "horizontal", index: 6 },
255
 
            ]
256
 
        }
257
 
 
258
 
        function test_card_size(data) {
259
 
            selector.selectedIndex = data.index;
260
 
 
261
 
            if (data.hasOwnProperty("size")) {
262
 
                card.template['card-size'] = data.size;
263
 
                card.templateChanged();
264
 
            }
265
 
 
266
 
            if (data.hasOwnProperty("card_layout")) {
267
 
                card.template['card-layout'] = data.card_layout;
268
 
                card.templateChanged();
269
 
            }
270
 
 
271
 
            if (data.hasOwnProperty("aspect")) {
272
 
                card.components['art']['aspect-ratio'] = data.aspect;
273
 
                card.componentsChanged();
274
 
            }
275
 
 
276
 
            if (data.hasOwnProperty("width")) {
277
 
                tryCompare(card, "width", data.width);
278
 
            }
279
 
 
280
 
            if (typeof data.height === "function") {
281
 
                tryCompareFunction(function() { return card.height === data.height() }, true);
282
 
            } else if (data.hasOwnProperty("height")) {
283
 
                tryCompare(card, "height", data.height);
284
 
            }
285
 
        }
286
 
 
287
 
        function test_art_size_data() {
288
 
            return [
289
 
                { tag: "Medium", width: units.gu(18.5), fill: Image.PreserveAspectCrop, index: 0 },
290
 
                { tag: "Small", width: units.gu(12), index: 1 },
291
 
                { tag: "Large", width: units.gu(38), index: 2 },
292
 
                { tag: "Wide", height: units.gu(19), size: "large", index: 3 },
293
 
                { tag: "Fit", height: units.gu(38), size: "large", width: units.gu(19), index: 4 },
294
 
                { tag: "VerticalWidth", width: function() { return header.width }, index: 0 },
295
 
                { tag: "HorizontalHeight", height: function() { return header.height }, index: 5 },
296
 
                { tag: "HorizontalWidth", width: function() { return header.x }, index: 5 },
297
 
            ]
298
 
        }
299
 
 
300
 
        function test_art_size(data) {
301
 
            selector.selectedIndex = data.index;
302
 
 
303
 
            if (data.hasOwnProperty("size")) {
304
 
                card.template['card-size'] = data.size;
305
 
                card.templateChanged();
306
 
            }
307
 
 
308
 
            if (data.hasOwnProperty("aspect")) {
309
 
                card.components['art']['aspect-ratio'] = data.aspect;
310
 
                card.componentsChanged();
311
 
            }
312
 
 
313
 
            if (data.hasOwnProperty("width")) {
314
 
                if (typeof data.width === "function") {
315
 
                    tryCompareFunction(function() { return art.width === data.width() }, true);
316
 
                } else tryCompare(art, "width", data.width);
317
 
            }
318
 
 
319
 
            if (data.hasOwnProperty("height")) {
320
 
                if (typeof data.height === "function") {
321
 
                    tryCompareFunction(function() { return art.height === data.height() }, true);
322
 
                } else tryCompare(art, "height", data.height);
323
 
            }
324
 
 
325
 
            if (data.hasOwnProperty("fill")) {
326
 
                tryCompare(artImage, "fillMode", data.fill);
327
 
            }
328
 
        }
329
 
 
330
 
        function test_art_layout_data() {
331
 
            return [
332
 
                { tag: "Vertical", left: function() { return 0 }, index: 0},
333
 
                { tag: "Horizontal", left: function() { return art.width }, index: 5 },
334
 
            ];
335
 
        }
336
 
 
337
 
        function test_art_layout(data) {
338
 
            selector.selectedIndex = data.index;
339
 
 
340
 
            tryCompare(testCase.header, "x", data.left());
341
 
        }
342
 
 
343
 
        function test_header_layout_data() {
344
 
            return [
345
 
                { tag: "Vertical", top: function() { return art.y + art.height },
346
 
                  left: function() { return art.x }, index: 0 },
347
 
                { tag: "Horizontal", top: function() { return art.y },
348
 
                  left: function() { return art.x + art.width }, index: 5 },
349
 
            ]
350
 
        }
351
 
 
352
 
        function test_header_layout(data) {
353
 
            selector.selectedIndex = data.index;
354
 
 
355
 
            tryCompareFunction(function() { return testCase.header.y === data.top() }, true);
356
 
            tryCompareFunction(function() { return testCase.header.x === data.left() }, true);
357
 
        }
358
 
 
359
 
        function test_art_visibility() {
360
 
            selector.selectedIndex = 7
361
 
 
362
 
            tryCompare(testCase.artImage, "source", "")
363
 
            compare(testCase.art.visible, false)
364
 
            compare(testCase.art.height, 0)
365
 
            compare(testCase.art.width, 0)
366
 
        }
367
 
    }
368
 
}