| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142 |
- /**
- * @license Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
- */
- /* global document, Event */
- import clickOutsideHandler from '../../src/bindings/clickoutsidehandler';
- import DomEmitterMixin from '@ckeditor/ckeditor5-utils/src/dom/emittermixin';
- import testUtils from '@ckeditor/ckeditor5-core/tests/_utils/utils';
- testUtils.createSinonSandbox();
- describe( 'clickOutsideHandler', () => {
- let activator, actionSpy, contextElement1, contextElement2;
- beforeEach( () => {
- activator = testUtils.sinon.stub().returns( false );
- contextElement1 = document.createElement( 'div' );
- contextElement2 = document.createElement( 'div' );
- actionSpy = testUtils.sinon.spy();
- document.body.appendChild( contextElement1 );
- document.body.appendChild( contextElement2 );
- clickOutsideHandler( {
- emitter: Object.create( DomEmitterMixin ),
- activator,
- contextElements: [ contextElement1, contextElement2 ],
- callback: actionSpy
- } );
- } );
- afterEach( () => {
- document.body.removeChild( contextElement1 );
- document.body.removeChild( contextElement2 );
- } );
- it( 'should fired callback after clicking out of context element when listener is active', () => {
- activator.returns( true );
- document.body.dispatchEvent( new Event( 'mousedown', { bubbles: true } ) );
- sinon.assert.calledOnce( actionSpy );
- } );
- it( 'should not fired callback after clicking out of context element when listener is not active', () => {
- activator.returns( false );
- document.body.dispatchEvent( new Event( 'mousedown', { bubbles: true } ) );
- sinon.assert.notCalled( actionSpy );
- } );
- it( 'should not fired callback after clicking on context element when listener is active', () => {
- activator.returns( true );
- contextElement1.dispatchEvent( new Event( 'mouseup', { bubbles: true } ) );
- sinon.assert.notCalled( actionSpy );
- contextElement2.dispatchEvent( new Event( 'mouseup', { bubbles: true } ) );
- sinon.assert.notCalled( actionSpy );
- } );
- it( 'should not fired callback after clicking on context element when listener is not active', () => {
- activator.returns( false );
- contextElement1.dispatchEvent( new Event( 'mouseup', { bubbles: true } ) );
- sinon.assert.notCalled( actionSpy );
- contextElement2.dispatchEvent( new Event( 'mouseup', { bubbles: true } ) );
- sinon.assert.notCalled( actionSpy );
- } );
- it( 'should listen when model initial `ifActive` value was `true`', () => {
- const spy = testUtils.sinon.spy();
- activator.returns( true );
- clickOutsideHandler( {
- emitter: Object.create( DomEmitterMixin ),
- activator,
- contextElements: [ contextElement1 ],
- callback: spy
- } );
- document.body.dispatchEvent( new Event( 'mousedown', { bubbles: true } ) );
- sinon.assert.calledOnce( spy );
- } );
- it( 'should not listen when model initial `ifActive` value was `false`', () => {
- const spy = testUtils.sinon.spy();
- activator.returns( false );
- clickOutsideHandler( {
- emitter: Object.create( DomEmitterMixin ),
- activator,
- contextElements: [ contextElement1 ],
- callback: spy
- } );
- document.body.dispatchEvent( new Event( 'mousedown', { bubbles: true } ) );
- sinon.assert.notCalled( spy );
- } );
- it( 'should react on model `ifActive` property change', () => {
- activator.returns( true );
- document.body.dispatchEvent( new Event( 'mousedown', { bubbles: true } ) );
- sinon.assert.calledOnce( actionSpy );
- activator.returns( false );
- document.body.dispatchEvent( new Event( 'mousedown', { bubbles: true } ) );
- // Still called once, was not called second time.
- sinon.assert.calledOnce( actionSpy );
- activator.returns( true );
- document.body.dispatchEvent( new Event( 'mousedown', { bubbles: true } ) );
- // Called one more time.
- sinon.assert.calledTwice( actionSpy );
- } );
- it( 'should not execute the callback if one of #contextElements contains the DOM event target', () => {
- const target = document.createElement( 'div' );
- activator.returns( true );
- contextElement2.appendChild( target );
- target.dispatchEvent( new Event( 'mousedown', { bubbles: true } ) );
- sinon.assert.notCalled( actionSpy );
- } );
- } );
|