Blame view

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