summaryrefslogtreecommitdiffstats
path: root/framework/src/onos/web/gui/src/main/webapp/tests/app/fw/svg/icon-spec.js
blob: 99d7bc38dbe0053dc848878ab6f02852c52205be (plain)
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
45
46
47
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
103
104
105
106
/*
 * Copyright 2015 Open Networking Laboratory
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

/*
 ONOS GUI -- SVG -- Icon Service - Unit Tests
 */
describe('factory: fw/svg/icon.js', function() {
    var is, d3Elem;

    var viewBox = '0 0 50 50',
        glyphSize = '50',
        iconSize = '20';


    beforeEach(module('onosSvg'));

    beforeEach(inject(function (IconService) {
        is = IconService;
        d3Elem = d3.select('body').append('div').attr('id', 'myDiv');
    }));

    afterEach(function () {
        d3.select('#myDiv').remove();
    });

    it('should define IconService', function () {
        expect(is).toBeDefined();
    });

    function checkElemSize(elem, dim) {
        expect(elem.attr('width')).toEqual(dim);
        expect(elem.attr('height')).toEqual(dim);
    }

    function verifyIconStructure(iconClass, useHref, iSize, vBox, gSize) {
        var isz = iSize || iconSize,
            vbx = vBox || viewBox,
            gsz = gSize || glyphSize;

        var svg = d3Elem.selectAll('svg');
        expect(svg.size()).toBe(1);
        checkElemSize(svg, isz);
        expect(svg.attr('viewBox')).toEqual(vbx);

        var g = svg.selectAll('g');
        expect(g.size()).toBe(1);
        expect(g.classed('icon')).toBeTruthy();
        expect(g.classed(iconClass)).toBeTruthy();

        var rect = g.select('rect');
        expect(rect.size()).toBe(1);
        checkElemSize(rect, gsz);
        expect(rect.attr('rx')).toEqual('5');

        if (useHref) {
            var use = g.select('use');
            expect(use.classed('glyph')).toBeTruthy();
            expect(use.attr('xlink:href')).toEqual(useHref);
            checkElemSize(use, gsz);
        }
    }

    it('should load an icon into a div', function () {
        expect(d3Elem.html()).toEqual('');
        is.loadIconByClass(d3Elem, 'active');
        verifyIconStructure('active', '#checkMark');
    });

    it('should allow us to specify the icon size', function () {
        expect(d3Elem.html()).toEqual('');
        is.loadIconByClass(d3Elem, 'inactive', 32);
        verifyIconStructure('inactive', '#xMark', '32');
    });

    it('should verify triangleUp icon', function () {
        expect(d3Elem.html()).toEqual('');
        is.loadIconByClass(d3Elem, 'upArrow', 10);
        verifyIconStructure('upArrow', '#triangleUp', '10');
    });

    it('should verify triangleDown icon', function () {
        expect(d3Elem.html()).toEqual('');
        is.loadIconByClass(d3Elem, 'downArrow', 10);
        verifyIconStructure('downArrow', '#triangleDown', '10');
    });

    it('should verify no icon is displayed', function () {
        expect(d3Elem.html()).toEqual('');
        is.loadIconByClass(d3Elem, 'tableColSortNone', 10);
        verifyIconStructure('tableColSortNone', null, '10');
    });

});