← Back to branch summary

~didrocks/+junk/face-detection-15.04

« back to all changes in this revision

Viewing changes to facedetection/www/bower_components/iron-iconset-svg/test/iron-iconset-svg.html

  • Committer: Didier Roche
  • Date: 2016-05-10 23:09:11 UTC
  • Revision ID: didier.roche@canonical.com-20160510230911-c7xr490zrj3yrzxd
New version

Show diffs side-by-side

added added

removed removed

Lines of Context:
facedetection/www/bower_components/iron-iconset-svg/test/iron-iconset-svg.html
 
1
<!doctype html>
 
2
<!--
 
3
@license
 
4
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
 
5
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
 
6
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
 
7
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
 
8
Code distributed by Google as part of the polymer project is also
 
9
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
 
10
-->
 
11
 
 
12
<html>
 
13
<head>
 
14
 
 
15
  <title>iron-iconset-svg</title>
 
16
  <meta charset="utf-8">
 
17
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
18
 
 
19
  <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
 
20
  <script src="../../web-component-tester/browser.js"></script>
 
21
  <script src="../../test-fixture/test-fixture-mocha.js"></script>
 
22
 
 
23
  <link rel="import" href="../iron-iconset-svg.html">
 
24
  <link rel="import" href="../../iron-meta/iron-meta.html">
 
25
  <link rel="import" href="../../promise-polyfill/promise-polyfill.html">
 
26
  <link rel="import" href="../../test-fixture/test-fixture.html">
 
27
 
 
28
</head>
 
29
<body>
 
30
 
 
31
  <test-fixture id="TrivialIconsetSvg">
 
32
    <template>
 
33
      <iron-iconset-svg name="foo"></iron-iconset-svg>
 
34
      <iron-meta type="iconset"></iron-meta>
 
35
    </template>
 
36
  </test-fixture>
 
37
 
 
38
  <test-fixture id="StandardIconsetSvg">
 
39
    <template>
 
40
      <iron-iconset-svg name="my-icons" size="20">
 
41
        <svg>
 
42
          <defs>
 
43
            <circle id="circle" cx="20" cy="20" r="10"></circle>
 
44
            <rect id="square" x="0" y="0" width="20" height="20"></rect>
 
45
            <symbol id="rect" viewBox="0 0 50 25">
 
46
              <rect x="0" y="0" width="50" height="25"></rect>
 
47
            </symbol>
 
48
          </defs>
 
49
        </svg>
 
50
      </iron-iconset-svg>
 
51
      <div></div>
 
52
    </template>
 
53
  </test-fixture>
 
54
 
 
55
  <script>
 
56
 
 
57
    suite('<iron-iconset>', function () {
 
58
 
 
59
      suite('basic behavior', function () {
 
60
        var iconset;
 
61
        var meta;
 
62
        var loadedPromise;
 
63
 
 
64
        setup(function () {
 
65
          loadedPromise = new Promise(function(resolve) {
 
66
            window.addEventListener('iron-iconset-added', function(ev) {
 
67
              if (ev && ev.detail === iconset) {
 
68
                resolve();
 
69
              }
 
70
            });
 
71
          });
 
72
          var elements = fixture('TrivialIconsetSvg');
 
73
          iconset = elements[0];
 
74
          meta = elements[1];
 
75
        });
 
76
 
 
77
        test('it can be accessed via iron-meta', function () {
 
78
          expect(meta.byKey('foo')).to.be.equal(iconset);
 
79
        });
 
80
 
 
81
        test('it does not have a size', function () {
 
82
          var rect = iconset.getBoundingClientRect();
 
83
          expect(rect.width).to.be.equal(0);
 
84
          expect(rect.height).to.be.equal(0);
 
85
        });
 
86
 
 
87
        test('it fires an iron-iconset-added event on the window', function() {
 
88
          return loadedPromise;
 
89
        });
 
90
      });
 
91
 
 
92
      suite('when paired with a size and SVG definition', function () {
 
93
        var iconset;
 
94
        var div;
 
95
 
 
96
        setup(function () {
 
97
          var elements = fixture('StandardIconsetSvg');
 
98
          iconset = elements[0];
 
99
          div = elements[1];
 
100
        });
 
101
 
 
102
        test('it does not have a size', function () {
 
103
          var rect = iconset.getBoundingClientRect();
 
104
          expect(rect.width).to.be.equal(0);
 
105
          expect(rect.height).to.be.equal(0);
 
106
        });
 
107
        
 
108
        test('appends a child to the target element', function () {
 
109
          expect(div.firstElementChild).to.not.be.ok;
 
110
          iconset.applyIcon(div, 'circle');
 
111
          expect(div.firstElementChild).to.be.ok;
 
112
        });
 
113
 
 
114
        test('can be queried for all available icons', function () {
 
115
          expect(iconset.getIconNames()).to.deep.eql(['my-icons:circle', 'my-icons:square', 'my-icons:rect']);
 
116
        });
 
117
 
 
118
        test('supports any icon defined in the svg', function () {
 
119
          var lastSvgIcon;
 
120
 
 
121
          iconset.getIconNames().forEach(function (iconName) {
 
122
            iconset.applyIcon(div, iconName.split(':').pop());
 
123
            expect(div.firstElementChild).to.not.be.equal(lastSvgIcon);
 
124
            lastSvgIcon = div.firstElementChild;
 
125
          });
 
126
        });
 
127
 
 
128
        test('prefers a viewBox attribute over the iconset size', function () {
 
129
          iconset.applyIcon(div, 'rect');
 
130
          expect(div.firstElementChild.getAttribute('viewBox')).to.be.equal('0 0 50 25');
 
131
        });
 
132
 
 
133
        test('uses the iconset size when viewBox is not defined on the element', function () {
 
134
          iconset.applyIcon(div, 'circle');
 
135
          expect(div.firstElementChild.getAttribute('viewBox')).to.be.equal('0 0 20 20');
 
136
        });
 
137
 
 
138
      });
 
139
 
 
140
    });
 
141
 
 
142
  </script>
 
143
 
 
144
</body>
 
145
</html>