GUI -- TopoView - re-implemented All/Pkt/Opt filter radio buttons.

Change-Id: I41cf0eca60a685606a631c0edf4779d7730bb649
diff --git a/web/gui/src/main/webapp/tests/app/view/topo/topoFilter-spec.js b/web/gui/src/main/webapp/tests/app/view/topo/topoFilter-spec.js
index 983469c..79a4398 100644
--- a/web/gui/src/main/webapp/tests/app/view/topo/topoFilter-spec.js
+++ b/web/gui/src/main/webapp/tests/app/view/topo/topoFilter-spec.js
@@ -18,25 +18,80 @@
  ONOS GUI -- Topo View -- Topo Filter Service - Unit Tests
  */
 describe('factory: view/topo/topoFilter.js', function() {
-    var $log, fs, filter;
+    var $log, fs, fltr, d3Elem, api;
+
+    var mockNodes = {
+            each: function () {},
+            classed: function () {}
+        },
+        mockLinks = {
+            each: function () {},
+            classed: function () {}
+        };
 
     beforeEach(module('ovTopo', 'onosUtil', 'onosLayer'));
 
     beforeEach(inject(function (_$log_, FnService, TopoFilterService) {
         $log = _$log_;
         fs = FnService;
-        filter = TopoFilterService;
+        fltr = TopoFilterService;
+        d3Elem = d3.select('body').append('div').attr('id', 'myMastDiv');
+
+        api = {
+            node: function () { return mockNodes; },
+            link: function () { return mockLinks; }
+        };
     }));
 
+    afterEach(function () {
+        d3.select('#myMastDiv').remove();
+    });
+
     it('should define TopoFilterService', function () {
-        expect(filter).toBeDefined();
+        expect(fltr).toBeDefined();
     });
 
     it('should define api functions', function () {
-        expect(fs.areFunctions(filter, [
-            'initFilter', 'destroyFilter'
+        expect(fs.areFunctions(fltr, [
+            'initFilter', 'destroyFilter',
+            'clickAction', 'selected'
         ])).toBeTruthy();
     });
 
-    // TODO: more tests...
+    it('should inject the buttons into the given div', function () {
+        fltr.initFilter(api, d3Elem);
+        var grpdiv = d3Elem.select('#topo-radio-group');
+        expect(grpdiv.size()).toBe(1);
+
+        var btns = grpdiv.selectAll('span');
+        expect(btns.size()).toBe(3);
+
+        var prefix = 'topo-rb-',
+            expIds = [ 'all', 'pkt', 'opt' ];
+
+        btns.each(function (d, i) {
+            var b = d3.select(this);
+            expect(b.attr('id')).toEqual(prefix + expIds[i]);
+            // 0th button is active - others are not
+            expect(b.classed('active')).toEqual(i === 0);
+        });
+    });
+
+    it('should remove the buttons from the given div', function () {
+        fltr.initFilter(api, d3Elem);
+        var grpdiv = d3Elem.select('#topo-radio-group');
+        expect(grpdiv.size()).toBe(1);
+
+        fltr.destroyFilter();
+        grpdiv = d3Elem.select('#topo-radio-group');
+        expect(grpdiv.size()).toBe(0);
+    });
+
+    it('should report the selected button', function () {
+        fltr.initFilter(api, d3Elem);
+        expect(fltr.selected()).toEqual('all');
+    });
+
+    // TODO: figure out how to trigger the click function on the spans..
+
 });