diff --git a/client/core/src/dialog/dialog.js b/client/core/src/dialog/dialog.js index 5c85ea14d3..3e4ac3eb57 100644 --- a/client/core/src/dialog/dialog.js +++ b/client/core/src/dialog/dialog.js @@ -20,13 +20,13 @@ export default class Dialog extends Component { */ show() { let style = this.dialog.style; - let screenMargin = 20; - let window = this.window; let innerWidth = window.innerWidth; let innerHeight = window.innerHeight; let width = this.dialog.offsetWidth; let height = this.dialog.offsetHeight; + let screenMargin = 20; + let dblMargin = screenMargin * 2; if (width + screenMargin > innerWidth) { width = innerWidth - dblMargin; @@ -37,10 +37,8 @@ export default class Dialog extends Component { style.height = height + 'px'; } - this.keypressHandler = - event => this.onKeypress(event); - this.document.addEventListener('keypress', - this.keypressHandler); + this.keypressHandler = event => this.onKeypress(event); + this.document.addEventListener('keypress', this.keypressHandler); this.element.style.display = 'block'; if (this.onOpen) @@ -68,12 +66,12 @@ export default class Dialog extends Component { realHide() { this.element.style.display = 'none'; - this.document.removeEventListener('keypress', - this.keypressHandler); + this.document.removeEventListener('keypress', this.keypressHandler); this.lastEvent = null; } onButtonClick(event) { + console.log(event); let buttonBar = this.element.querySelector('.button-bar'); let buttons = buttonBar.querySelector('tpl-buttons'); let node = event.target; @@ -111,8 +109,8 @@ module.component('vnDialog', { tplButtons: 'tplButtons' }, bindings: { - onOpen: '&', - onResponse: '&' + onOpen: '&?', + onResponse: '&?' }, controller: Dialog }); diff --git a/client/core/src/dialog/dialog.spec.js b/client/core/src/dialog/dialog.spec.js new file mode 100644 index 0000000000..25df231a77 --- /dev/null +++ b/client/core/src/dialog/dialog.spec.js @@ -0,0 +1,91 @@ +import './dialog.js'; + +describe('Component vnDialog', () => { + let $componentController; + let $element; + + beforeEach(() => { + angular.mock.module('client'); + }); + + beforeEach(angular.mock.inject(_$componentController_ => { + $componentController = _$componentController_; + $element = angular.element('
'); + })); + + describe('show()', () => { + it(`should define keypressHandler function, call addEventListener function and define element.style.display to block then call onOpen function`, () => { + window.innerHeight = 600; + window.innerWidth = 800; + let controller = $componentController('vnDialog', {$element}, {onOpen: () => {}, dialog: {style: {}, offsetWidth: 780, offsetHeight: 581}}); + spyOn(controller.document, 'addEventListener'); + spyOn(controller, 'onOpen'); + controller.show(); + + expect(controller.keypressHandler).toBeDefined(); + expect(controller.document.addEventListener).toHaveBeenCalledWith('keypress', controller.keypressHandler); + expect(controller.element.style.display).toEqual('block'); + expect(controller.onOpen).toHaveBeenCalledWith(); + }); + + it(`should define keypressHandler function, call addEventListener function and define element.style.display to block and never call onOpen function`, () => { + window.innerHeight = 600; + window.innerWidth = 800; + let controller = $componentController('vnDialog', {$element}, {dialog: {style: {}, offsetWidth: 781, offsetHeight: 581}}); + spyOn(controller.document, 'addEventListener'); + controller.show(); + + expect(controller.keypressHandler).toBeDefined(); + expect(controller.document.addEventListener).toHaveBeenCalledWith('keypress', controller.keypressHandler); + expect(controller.element.style.display).toEqual('block'); + expect(controller.onOpen).not.toBeDefined(); + }); + }); + + describe('hide()', () => { + it(`should call fireResponse() and realHide()`, () => { + let controller = $componentController('vnDialog', {$element}); + spyOn(controller, 'fireResponse'); + spyOn(controller, 'realHide'); + controller.hide(); + + expect(controller.fireResponse).toHaveBeenCalledWith(); + expect(controller.realHide).toHaveBeenCalledWith(); + }); + }); + + describe('fireResponse()', () => { + it(`should return cancel as false`, () => { + let controller = $componentController('vnDialog', {$element}); + let result = controller.fireResponse('I am the answer!'); + + expect(controller.onResponse).not.toBeDefined(); + expect(result).toEqual(false); + }); + + it(`should return onResponse()`, () => { + let text = 'I am the answer!'; + let controller = $componentController('vnDialog', {$element}, {onResponse: () => { + return {response: text}; + }}); + let result = controller.fireResponse(text); + + expect(result.response).toEqual(text); + }); + }); + + describe('realHide()', () => { + it(`should set element.style.display and lastEvent properties and call removeEvenListener()`, () => { + let controller = $componentController('vnDialog', {$element}); + spyOn(controller.document, 'removeEventListener'); + + expect(controller.element.style.display).not.toEqual('none'); + expect(controller.lastEvent).not.toBeDefined(); + controller.realHide(); + + expect(controller.element.style.display).toEqual('none'); + expect(controller.document.removeEventListener).toHaveBeenCalledWith('keypress', controller.keypressHandler); + expect(controller.lastEvent).toEqual(null); + }); + }); +});