|
|
@@ -3,6 +3,8 @@
|
|
|
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
|
|
|
*/
|
|
|
|
|
|
+/* global Event */
|
|
|
+
|
|
|
import ColorInputView from '../../src/ui/colorinputview';
|
|
|
import InputTextView from '@ckeditor/ckeditor5-ui/src/inputtext/inputtextview';
|
|
|
import ColorGridView from '@ckeditor/ckeditor5-ui/src/colorgrid/colorgridview';
|
|
|
@@ -138,7 +140,7 @@ describe( 'ColorInputView', () => {
|
|
|
expect( colorGridView ).to.be.instanceOf( ColorGridView );
|
|
|
} );
|
|
|
|
|
|
- it( 'should set #value upon #execute', () => {
|
|
|
+ it( 'should set ColorInputView#value upon ColorTileView#execute', () => {
|
|
|
expect( view.value ).to.equal( '' );
|
|
|
|
|
|
colorGridView.items.last.fire( 'execute' );
|
|
|
@@ -146,7 +148,7 @@ describe( 'ColorInputView', () => {
|
|
|
expect( view.value ).to.equal( 'rgb(0,0,255)' );
|
|
|
} );
|
|
|
|
|
|
- it( 'should set input text #value to the selected color\'s label upon #execute', () => {
|
|
|
+ it( 'should set InputTextView#value to the selected color\'s label upon ColorTileView#execute', () => {
|
|
|
expect( inputView.value ).to.equal( '' );
|
|
|
|
|
|
colorGridView.items.last.fire( 'execute' );
|
|
|
@@ -154,7 +156,7 @@ describe( 'ColorInputView', () => {
|
|
|
expect( inputView.value ).to.equal( 'Blue' );
|
|
|
} );
|
|
|
|
|
|
- it( 'should close the dropdown upon #execute', () => {
|
|
|
+ it( 'should close the dropdown upon ColorTileView#execute', () => {
|
|
|
view._dropdownView.isOpen = true;
|
|
|
|
|
|
colorGridView.items.last.fire( 'execute' );
|
|
|
@@ -162,7 +164,7 @@ describe( 'ColorInputView', () => {
|
|
|
expect( view._dropdownView.isOpen ).to.be.false;
|
|
|
} );
|
|
|
|
|
|
- it( 'should fire #input upon #execute', () => {
|
|
|
+ it( 'should fire the ColorInputView#input event upon ColorTileView#execute', () => {
|
|
|
const spy = sinon.spy( view, 'fire' );
|
|
|
|
|
|
colorGridView.items.last.fire( 'execute' );
|
|
|
@@ -216,7 +218,7 @@ describe( 'ColorInputView', () => {
|
|
|
expect( inputView.value ).to.equal( 'bar' );
|
|
|
} );
|
|
|
|
|
|
- it( `when the color input value is set to one of defined colors,
|
|
|
+ it( `when the color input value is set to one of defined colors,
|
|
|
should use its label as the text input value`, () => {
|
|
|
view.value = 'rgb(0,255,0)';
|
|
|
expect( inputView.value ).to.equal( 'Green' );
|
|
|
@@ -253,59 +255,70 @@ describe( 'ColorInputView', () => {
|
|
|
expect( view.value ).to.equal( 'bar' );
|
|
|
} );
|
|
|
|
|
|
- it( `when any defined color label is given as the text input #value (case-sensitive),
|
|
|
- should set the color as #value on #input event`, () => {
|
|
|
- inputView.element.value = 'Red';
|
|
|
- inputView.fire( 'input' );
|
|
|
+ it(
|
|
|
+ `when any defined color label is given as the text input #value (case-sensitive),
|
|
|
+ should set the color as #value on #input event`,
|
|
|
+ () => {
|
|
|
+ inputView.element.value = 'Red';
|
|
|
+ inputView.fire( 'input' );
|
|
|
|
|
|
- expect( view.value ).to.equal( 'rgb(255,0,0)' );
|
|
|
+ expect( view.value ).to.equal( 'rgb(255,0,0)' );
|
|
|
|
|
|
- inputView.element.value = 'Green';
|
|
|
- inputView.fire( 'input' );
|
|
|
+ inputView.element.value = 'Green';
|
|
|
+ inputView.fire( 'input' );
|
|
|
|
|
|
- expect( view.value ).to.equal( 'rgb(0,255,0)' );
|
|
|
+ expect( view.value ).to.equal( 'rgb(0,255,0)' );
|
|
|
|
|
|
- inputView.element.value = 'blue';
|
|
|
- inputView.fire( 'input' );
|
|
|
+ inputView.element.value = 'blue';
|
|
|
+ inputView.fire( 'input' );
|
|
|
|
|
|
- expect( view.value ).to.equal( 'blue' );
|
|
|
- } );
|
|
|
+ expect( view.value ).to.equal( 'blue' );
|
|
|
+ }
|
|
|
+ );
|
|
|
|
|
|
- it( `when any defined color label is given as the text input #value (case-sensitive),
|
|
|
- then a non-defined value is set to the color input,
|
|
|
- the latter value should be set to text input`, () => {
|
|
|
- inputView.element.value = 'Red';
|
|
|
- inputView.fire( 'input' );
|
|
|
+ it(
|
|
|
+ `when any defined color label is given as the text input #value (case-sensitive),
|
|
|
+ then a non-defined value is set to the color input,
|
|
|
+ the latter value should be set to text input`,
|
|
|
+ () => {
|
|
|
+ inputView.element.value = 'Red';
|
|
|
+ inputView.fire( 'input' );
|
|
|
|
|
|
- expect( view.value ).to.equal( 'rgb(255,0,0)' );
|
|
|
+ expect( view.value ).to.equal( 'rgb(255,0,0)' );
|
|
|
|
|
|
-
|
|
|
- view.value = 'rgb(0,0,255)';
|
|
|
+ view.value = 'rgb(0,0,255)';
|
|
|
|
|
|
- expect( view.value ).to.equal( 'rgb(0,0,255)' );
|
|
|
- } );
|
|
|
+ expect( view.value ).to.equal( 'rgb(0,0,255)' );
|
|
|
+ }
|
|
|
+ );
|
|
|
|
|
|
- it( `when any defined color value is given as the text input #value (case-sensitive),
|
|
|
- its value should be set to color and text inputs after input event`, () => {
|
|
|
- inputView.element.value = 'rgb(255,0,0)';
|
|
|
- inputView.fire( 'input' );
|
|
|
+ it(
|
|
|
+ `when any defined color value is given as the text input #value (case-sensitive),
|
|
|
+ its value should be set to color and text inputs after input event`,
|
|
|
+ () => {
|
|
|
+ inputView.element.value = 'rgb(255,0,0)';
|
|
|
+ inputView.fire( 'input' );
|
|
|
|
|
|
- expect( view.value ).to.equal( 'rgb(255,0,0)' );
|
|
|
- expect( inputView.element.value ).to.equal( 'rgb(255,0,0)' );
|
|
|
- } );
|
|
|
+ expect( view.value ).to.equal( 'rgb(255,0,0)' );
|
|
|
+ expect( inputView.element.value ).to.equal( 'rgb(255,0,0)' );
|
|
|
+ }
|
|
|
+ );
|
|
|
|
|
|
- it( `when any defined color value is given as the text input #value (case-sensitive),
|
|
|
- its label should be set to text inputs after blur event on input view input element`, () => {
|
|
|
- inputView.element.value = 'rgb(255,0,0)';
|
|
|
+ it(
|
|
|
+ `when any defined color value is given as the text input #value (case-sensitive),
|
|
|
+ its label should be set to text inputs after blur event on input view input element`,
|
|
|
+ () => {
|
|
|
+ inputView.element.value = 'rgb(255,0,0)';
|
|
|
|
|
|
- inputView.fire( 'input' );
|
|
|
+ inputView.fire( 'input' );
|
|
|
|
|
|
- expect( inputView.element.value ).to.equal( 'rgb(255,0,0)' );
|
|
|
+ expect( inputView.element.value ).to.equal( 'rgb(255,0,0)' );
|
|
|
|
|
|
- inputView.element.dispatchEvent( new Event( 'blur' ) );
|
|
|
+ inputView.element.dispatchEvent( new Event( 'blur' ) );
|
|
|
|
|
|
- expect( inputView.element.value ).to.equal( 'Red' );
|
|
|
- } );
|
|
|
+ expect( inputView.element.value ).to.equal( 'Red' );
|
|
|
+ }
|
|
|
+ );
|
|
|
|
|
|
it( 'should have #input event delegated to the color input', () => {
|
|
|
const spy = sinon.spy();
|