浏览代码

Tests: Added tests for the SpecialCharactersUI class.

Aleksander Nowodzinski 6 年之前
父节点
当前提交
ce16203827

+ 12 - 5
packages/ckeditor5-special-characters/src/specialcharactersui.js

@@ -20,6 +20,13 @@ import SpecialCharactersNavigationView from './ui/specialcharactersnavigationvie
  * @extends module:core/plugin~Plugin
  */
 export default class SpecialCharactersUI extends Plugin {
+	/**
+	 * @inheritDoc
+	 */
+	static get pluginName() {
+		return 'SpecialCharactersUI';
+	}
+
 	init() {
 		const editor = this.editor;
 		const t = editor.t;
@@ -32,18 +39,18 @@ export default class SpecialCharactersUI extends Plugin {
 		editor.ui.componentFactory.add( 'specialCharacters', locale => {
 			const dropdownView = createDropdown( locale );
 			const navigationView = new SpecialCharactersNavigationView( locale, specialCharsPlugin.getGroups() );
-			const symbolGridView = new CharacterGridView( this.locale, {
+			const gridView = new CharacterGridView( this.locale, {
 				columns: 10
 			} );
 
-			symbolGridView.delegate( 'execute' ).to( dropdownView );
+			gridView.delegate( 'execute' ).to( dropdownView );
 
 			// Set the initial content of the special characters grid.
-			this._updateGrid( specialCharsPlugin, navigationView.currentGroupName, symbolGridView );
+			this._updateGrid( specialCharsPlugin, navigationView.currentGroupName, gridView );
 
 			// Update the grid of special characters when a user changed the character group.
 			navigationView.on( 'execute', () => {
-				this._updateGrid( specialCharsPlugin, navigationView.currentGroupName, symbolGridView );
+				this._updateGrid( specialCharsPlugin, navigationView.currentGroupName, gridView );
 			} );
 
 			dropdownView.buttonView.set( {
@@ -61,7 +68,7 @@ export default class SpecialCharactersUI extends Plugin {
 			} );
 
 			dropdownView.panelView.children.add( navigationView );
-			dropdownView.panelView.children.add( symbolGridView );
+			dropdownView.panelView.children.add( gridView );
 
 			return dropdownView;
 		} );

+ 128 - 0
packages/ckeditor5-special-characters/tests/specialcharactersui.js

@@ -0,0 +1,128 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/* global document */
+
+import SpecialCharacters from '../src/specialcharacters';
+import SpecialCharactersMathematical from '../src/specialcharactersmathematical';
+import SpecialCharactersArrows from '../src/specialcharactersarrows';
+import SpecialCharactersUI from '../src/specialcharactersui';
+import SpecialCharactersNavigationView from '../src/ui/specialcharactersnavigationview';
+import CharacterGridView from '../src/ui/charactergridview';
+import ClassicTestEditor from '@ckeditor/ckeditor5-core/tests/_utils/classictesteditor';
+import specialCharactersIcon from '../theme/icons/specialcharacters.svg';
+import EventInfo from '@ckeditor/ckeditor5-utils/src/eventinfo';
+
+describe( 'SpecialCharactersUI', () => {
+	let editor, command, element;
+
+	beforeEach( () => {
+		element = document.createElement( 'div' );
+		document.body.appendChild( element );
+
+		return ClassicTestEditor
+			.create( element, {
+				plugins: [
+					SpecialCharacters,
+					SpecialCharactersMathematical,
+					SpecialCharactersArrows,
+					SpecialCharactersUI
+				]
+			} )
+			.then( newEditor => {
+				editor = newEditor;
+				command = editor.commands.get( 'specialCharacters' );
+			} );
+	} );
+
+	afterEach( () => {
+		element.remove();
+
+		return editor.destroy();
+	} );
+
+	it( 'should be named', () => {
+		expect( SpecialCharactersUI.pluginName ).to.equal( 'SpecialCharactersUI' );
+	} );
+
+	describe( '"specialCharacters" dropdown', () => {
+		let dropdown;
+
+		beforeEach( () => {
+			dropdown = editor.ui.componentFactory.create( 'specialCharacters' );
+		} );
+
+		afterEach( () => {
+			dropdown.destroy();
+		} );
+
+		it( 'has a navigation view', () => {
+			expect( dropdown.panelView.children.first ).to.be.instanceOf( SpecialCharactersNavigationView );
+		} );
+
+		it( 'has a grid view', () => {
+			expect( dropdown.panelView.children.last ).to.be.instanceOf( CharacterGridView );
+		} );
+
+		describe( '#buttonView', () => {
+			it( 'should get basic properties', () => {
+				expect( dropdown.buttonView.label ).to.equal( 'Special characters' );
+				expect( dropdown.buttonView.icon ).to.equal( specialCharactersIcon );
+				expect( dropdown.buttonView.tooltip ).to.be.true;
+			} );
+
+			it( 'should bind #isEnabled to the command', () => {
+				expect( dropdown.isEnabled ).to.be.true;
+
+				command.isEnabled = false;
+				expect( dropdown.isEnabled ).to.be.false;
+			} );
+		} );
+
+		it( 'executes a command and focuses the editing view', () => {
+			const grid = dropdown.panelView.children.last;
+			const executeSpy = sinon.stub( editor, 'execute' );
+			const focusSpy = sinon.stub( editor.editing.view, 'focus' );
+
+			grid.tiles.get( 2 ).fire( 'execute' );
+
+			sinon.assert.calledOnce( executeSpy );
+			sinon.assert.calledOnce( focusSpy );
+			sinon.assert.calledWithExactly( executeSpy.firstCall, 'specialCharacters', {
+				item: 'greek small letter delta'
+			} );
+		} );
+
+		describe( 'grid view', () => {
+			let grid;
+
+			beforeEach( () => {
+				grid = dropdown.panelView.children.last;
+			} );
+
+			it( 'delegates #execute to the dropdown', () => {
+				const spy = sinon.spy();
+
+				dropdown.on( 'execute', spy );
+				grid.fire( 'execute', { name: 'foo' } );
+
+				sinon.assert.calledOnce( spy );
+			} );
+
+			it( 'has default contents', () => {
+				expect( grid.tiles ).to.have.length.greaterThan( 10 );
+			} );
+
+			it( 'is updated when navigation view fires #execute', () => {
+				const navigation = dropdown.panelView.children.first;
+
+				expect( grid.tiles.get( 0 ).label ).to.equal( 'α' );
+				navigation.groupDropdownView.fire( new EventInfo( { label: 'Arrows' }, 'execute' ) );
+
+				expect( grid.tiles.get( 0 ).label ).to.equal( '⇐' );
+			} );
+		} );
+	} );
+} );