GUI -- Implemented createToolbar in ToolbarService.
- Will log warnings if no toolbar id is given, there are no tools, and if the tool's ids are duplicated
- creates toolbar div and calls add button functions based on tool input
- Created skeleton dispatchers to ButtonService
- Wrote unit tests for current ToolbarService
Change-Id: I3d05158c5ce132cb94d465674949ade81ed12664
diff --git a/web/gui/src/main/webapp/tests/app/fw/layer/panel-spec.js b/web/gui/src/main/webapp/tests/app/fw/layer/panel-spec.js
index 8637258..079b236 100644
--- a/web/gui/src/main/webapp/tests/app/fw/layer/panel-spec.js
+++ b/web/gui/src/main/webapp/tests/app/fw/layer/panel-spec.js
@@ -108,7 +108,7 @@
it('should note when there is no panel to destroy', function () {
spyOn($log, 'debug');
ps.destroyPanel('bar');
- expect($log.debug).toHaveBeenCalledWith('no panel to destroy:', 'bar')
+ expect($log.debug).toHaveBeenCalledWith('no panel to destroy:', 'bar');
});
it('should destroy the panel', function () {
@@ -117,7 +117,7 @@
expect(floatPanelSelection().size()).toBe(1);
ps.destroyPanel('foo');
- expect($log.debug).toHaveBeenCalledWith('destroying panel:', 'foo')
+ expect($log.debug).toHaveBeenCalledWith('destroying panel:', 'foo');
expect(floatPanelSelection().size()).toBe(0);
});
diff --git a/web/gui/src/main/webapp/tests/app/fw/widget/toolbar-spec.js b/web/gui/src/main/webapp/tests/app/fw/widget/toolbar-spec.js
index 2269642..30eec65 100644
--- a/web/gui/src/main/webapp/tests/app/fw/widget/toolbar-spec.js
+++ b/web/gui/src/main/webapp/tests/app/fw/widget/toolbar-spec.js
@@ -18,26 +18,82 @@
ONOS GUI -- Widget -- Toolbar Service - Unit Tests
*/
describe('factory: fw/widget/toolbar.js', function () {
- var $log, fs, tbs;
+ var $log, fs, tbs, ps,
+ d3Elem;
- beforeEach(module('onosWidget', 'onosUtil'));
+ beforeEach(module('onosWidget', 'onosUtil', 'onosLayer'));
- beforeEach(inject(function (_$log_, FnService, ToolbarService) {
+ beforeEach(inject(function (_$log_, FnService,
+ ToolbarService, PanelService) {
$log = _$log_;
fs = FnService;
tbs = ToolbarService;
+ ps = PanelService;
}));
+ beforeEach(function () {
+ d3Elem = d3.select('body').append('div').attr('id', 'floatpanels');
+ tbs.init();
+ ps.init();
+ });
+
+ afterEach(function () {
+ d3.select('#floatpanels').remove();
+ tbs.init();
+ ps.init();
+ });
+
it('should define ToolbarService', function () {
expect(tbs).toBeDefined();
});
it('should define api functions', function () {
expect(fs.areFunctions(tbs, [
- 'makeButton', 'makeToggle', 'makeRadio', 'separator', 'createToolbar'
+ 'init', 'makeButton', 'makeToggle', 'makeRadio', 'separator',
+ 'createToolbar'
])).toBeTruthy();
});
+ function toolbarSelection() {
+ return d3Elem.selectAll('.toolbar');
+ }
+
+ it('should have no toolbars to start', function () {
+ expect(toolbarSelection().size()).toBe(0);
+ });
+
+ it('should log a warning if no ID is given', function () {
+ spyOn($log, 'warn');
+ var tbar = tbs.createToolbar();
+ expect(tbar).toBeNull();
+ expect($log.warn).toHaveBeenCalledWith('createToolbar: no ID given');
+ expect(toolbarSelection().size()).toBe(0);
+ });
+
+ it('should log a warning if no tools are given', function () {
+ spyOn($log, 'warn');
+ var tbar = tbs.createToolbar(true);
+ expect(tbar).toBeNull();
+ expect($log.warn).toHaveBeenCalledWith('createToolbar: no tools given');
+ expect(toolbarSelection().size()).toBe(0);
+ });
+
+ it('should log a warning if tools are not an array', function () {
+ spyOn($log, 'warn');
+ var tbar = tbs.createToolbar(true, {});
+ expect(tbar).toBeNull();
+ expect($log.warn).toHaveBeenCalledWith('createToolbar: no tools given');
+ expect(toolbarSelection().size()).toBe(0);
+ });
+
+ it('should log a warning if tools array is empty', function () {
+ spyOn($log, 'warn');
+ var tbar = tbs.createToolbar(true, []);
+ expect(tbar).toBeNull();
+ expect($log.warn).toHaveBeenCalledWith('createToolbar: no tools given');
+ expect(toolbarSelection().size()).toBe(0);
+ });
+
it("should verify makeButton's returned object", function () {
var button = tbs.makeButton('foo', 'glyph-bar', function () {});
@@ -57,16 +113,48 @@
});
it("should verify makeRadio's returned object", function () {
- // TODO: finish this
+ var rFoo0 = tbs.makeRadio('foo', 'glyph-foo0', function () {});
+ var rFoo1 = tbs.makeRadio('foo', 'glyph-foo1', function () {});
+ var rFoo2 = tbs.makeRadio('foo', 'glyph-foo2', function () {});
+ var rBar0 = tbs.makeRadio('bar', 'glyph-bar0', function () {});
+ var rBar1 = tbs.makeRadio('bar', 'glyph-bar1', function () {});
+ var rFoo3 = tbs.makeRadio('foo', 'glyph-foo3', function () {});
- //var rFoo1 = tbs.makeRadio('foo', function () {});
- //var rFoo2 = tbs.makeRadio('foo', function () {});
- //var rFoo3 = tbs.makeRadio('foo', function () {});
- //var rBar1 = tbs.makeRadio('bar', function () {});
- //
- //expect(radio1.t).toBe('rad');
- //expect(radio1.id).toBe('foo');
- //expect(fs.isF(radio1.cb)).toBeTruthy();
+ expect(rFoo0.t).toBe('rad');
+ expect(rFoo0.id).toBe('foo-0');
+ expect(rFoo0.rid).toBe('0');
+ expect(rFoo0.gid).toBe('glyph-foo0');
+ expect(fs.isF(rFoo0.cb)).toBeTruthy();
+
+ expect(rFoo1.t).toBe('rad');
+ expect(rFoo1.id).toBe('foo-1');
+ expect(rFoo1.rid).toBe('1');
+ expect(rFoo1.gid).toBe('glyph-foo1');
+ expect(fs.isF(rFoo1.cb)).toBeTruthy();
+
+ expect(rFoo2.t).toBe('rad');
+ expect(rFoo2.id).toBe('foo-2');
+ expect(rFoo2.rid).toBe('2');
+ expect(rFoo2.gid).toBe('glyph-foo2');
+ expect(fs.isF(rFoo2.cb)).toBeTruthy();
+
+ expect(rFoo3.t).toBe('rad');
+ expect(rFoo3.id).toBe('foo-3');
+ expect(rFoo3.rid).toBe('3');
+ expect(rFoo3.gid).toBe('glyph-foo3');
+ expect(fs.isF(rFoo3.cb)).toBeTruthy();
+
+ expect(rBar0.t).toBe('rad');
+ expect(rBar0.id).toBe('bar-0');
+ expect(rBar0.rid).toBe('0');
+ expect(rBar0.gid).toBe('glyph-bar0');
+ expect(fs.isF(rBar0.cb)).toBeTruthy();
+
+ expect(rBar1.t).toBe('rad');
+ expect(rBar1.id).toBe('bar-1');
+ expect(rBar1.rid).toBe('1');
+ expect(rBar1.gid).toBe('glyph-bar1');
+ expect(fs.isF(rBar1.cb)).toBeTruthy();
});
it("should verify separator's returned object", function () {
@@ -74,4 +162,106 @@
expect(separator.t).toBe('sep');
});
+ it('should log a warning if btn id is already in use', function () {
+ var tools = [
+ tbs.makeButton('id0', 'glyph-id0', function () {}),
+ tbs.makeButton('id0', 'glyph-id0', function () {})
+ ];
+
+ spyOn($log, 'warn');
+ var tbar = tbs.createToolbar('someId', tools);
+ expect(tbar).toBeNull();
+ expect($log.warn).toHaveBeenCalledWith('createToolbar: item with id ' +
+ 'id0 already exists');
+ expect(toolbarSelection().size()).toBe(0);
+ });
+
+ it('should log a warning if tog id is already in use', function () {
+ var tools = [
+ tbs.makeToggle('id0', 'glyph-id0', function () {}),
+ tbs.makeToggle('id1', 'glyph-id1', function () {}),
+ tbs.makeToggle('id0', 'glyph-id0', function () {})
+ ];
+
+ spyOn($log, 'warn');
+ var tbar = tbs.createToolbar('someId', tools);
+ expect(tbar).toBeNull();
+ expect($log.warn).toHaveBeenCalledWith('createToolbar: item with id ' +
+ 'id0 already exists');
+ expect(toolbarSelection().size()).toBe(0);
+ });
+
+ it('should create a toolbar', function () {
+ // need to create a button so it does not throw errors
+ var tools = [
+ tbs.makeButton('btn0', 'glyph0', function () {})
+ ];
+ spyOn($log, 'warn');
+ var tbar = tbs.createToolbar('test', tools);
+ expect($log.warn).not.toHaveBeenCalled();
+ expect(toolbarSelection().size()).toBe(1);
+ });
+
+ it('should test multiple separators in a row', function () {
+ var tools = [
+ tbs.separator(),
+ tbs.separator(),
+ tbs.separator()
+ ];
+ spyOn($log, 'warn');
+ var tbar = tbs.createToolbar('test', tools);
+ expect($log.warn).not.toHaveBeenCalled();
+ expect(toolbarSelection().size()).toBe(1);
+ });
+
+ it('should create a button div', function () {
+ var tools = [
+ tbs.makeButton('btn0', 'glyph0', function () {})
+ ];
+ spyOn($log, 'warn');
+ var tbar = tbs.createToolbar('test', tools);
+ expect($log.warn).not.toHaveBeenCalled();
+ expect(toolbarSelection().size()).toBe(1);
+
+ expect(d3Elem.select('.btn')).toBeTruthy();
+ });
+
+ it('should create a toggle div', function () {
+ var tools = [
+ tbs.makeToggle('tog0', 'glyph0', function () {})
+ ];
+ spyOn($log, 'warn');
+ var tbar = tbs.createToolbar('test', tools);
+ expect($log.warn).not.toHaveBeenCalled();
+ expect(toolbarSelection().size()).toBe(1);
+
+ expect(d3Elem.select('.tog')).toBeTruthy();
+ });
+
+ it('should create a radio btn div', function () {
+ var tools = [
+ tbs.makeRadio('rad0', 'glyph0', function () {})
+ ];
+ spyOn($log, 'warn');
+ var tbar = tbs.createToolbar('test', tools);
+ expect($log.warn).not.toHaveBeenCalled();
+ expect(toolbarSelection().size()).toBe(1);
+
+ expect(d3Elem.select('.rad')).toBeTruthy();
+ });
+
+
+ it('should create a separator div', function () {
+ var tools = [
+ tbs.separator()
+ ];
+ tbs.createToolbar('test', tools);
+
+ var sepDiv = d3Elem.select('.sep');
+ expect(sepDiv).toBeTruthy();
+ expect(sepDiv.style('width')).toBe('2px');
+ expect(sepDiv.style('border-width')).toBe('1px');
+ expect(sepDiv.style('border-style')).toBe('solid');
+ });
+
});