Bladeren bron

Tests: Added tests for the SpecialCharactersNavigationView class.

Aleksander Nowodzinski 6 jaren geleden
bovenliggende
commit
b1d71b7b21

+ 3 - 3
packages/ckeditor5-special-characters/src/ui/specialcharactersnavigationview.js

@@ -48,7 +48,7 @@ export default class SpecialCharactersNavigationView extends View {
 		 *
 		 * @member {module:ui/dropdown/dropdownview~DropdownView}
 		 */
-		this.groupDropdownView = this._createGroupSelector( groupNames );
+		this.groupDropdownView = this._createGroupDropdown( groupNames );
 
 		this.setTemplate( {
 			tag: 'div',
@@ -81,7 +81,7 @@ export default class SpecialCharactersNavigationView extends View {
 	 * @param {Iterable.<String>} groupNames Names of the character groups.
 	 * @returns {module:ui/dropdown/dropdownview~DropdownView}
 	 */
-	_createGroupSelector( groupNames ) {
+	_createGroupDropdown( groupNames ) {
 		const locale = this.locale;
 		const t = locale.t;
 		const dropdown = createDropdown( locale );
@@ -94,7 +94,7 @@ export default class SpecialCharactersNavigationView extends View {
 		dropdown.buttonView.set( {
 			isOn: false,
 			withText: true,
-			tooltip: t( 'Character category' )
+			tooltip: t( 'Character categories' )
 		} );
 
 		dropdown.on( 'execute', evt => {

+ 1 - 1
packages/ckeditor5-special-characters/tests/ui/charactergridview.js

@@ -8,7 +8,7 @@ import ViewCollection from '@ckeditor/ckeditor5-ui/src/viewcollection';
 import ButtonView from '@ckeditor/ckeditor5-ui/src/button/buttonview';
 import testUtils from '@ckeditor/ckeditor5-core/tests/_utils/utils';
 
-describe.only( 'CharacterGridView', () => {
+describe( 'CharacterGridView', () => {
 	let view;
 
 	testUtils.createSinonSandbox();

+ 115 - 0
packages/ckeditor5-special-characters/tests/ui/specialcharactersnavigationview.js

@@ -0,0 +1,115 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+import SpecialCharactersNavigationView from '../../src/ui/specialcharactersnavigationview';
+import LabelView from '@ckeditor/ckeditor5-ui/src/label/labelview';
+import testUtils from '@ckeditor/ckeditor5-core/tests/_utils/utils';
+
+describe( 'SpecialCharactersNavigationView', () => {
+	let view, locale;
+
+	testUtils.createSinonSandbox();
+
+	beforeEach( () => {
+		locale = {
+			t: val => val
+		};
+
+		view = new SpecialCharactersNavigationView( locale, [ 'groupA', 'groupB' ] );
+		view.render();
+	} );
+
+	afterEach( () => {
+		view.destroy();
+	} );
+
+	describe( 'constructor()', () => {
+		it( 'creates #labelView', () => {
+			expect( view.labelView ).to.be.instanceOf( LabelView );
+			expect( view.labelView.text ).to.equal( 'Special characters' );
+		} );
+
+		it( 'creates #groupDropdownView', () => {
+		} );
+
+		it( 'creates #element from template', () => {
+			expect( view.element.classList.contains( 'ck' ) ).to.be.true;
+			expect( view.element.classList.contains( 'ck-special-characters-navigation' ) ).to.be.true;
+
+			expect( view.element.firstChild ).to.equal( view.labelView.element );
+			expect( view.element.lastChild ).to.equal( view.groupDropdownView.element );
+		} );
+	} );
+
+	describe( 'currentGroupName()', () => {
+		it( 'returns the #value of #groupDropdownView', () => {
+			expect( view.currentGroupName ).to.equal( 'groupA' );
+
+			view.groupDropdownView.listView.items.last.children.first.fire( 'execute' );
+			expect( view.currentGroupName ).to.equal( 'groupB' );
+		} );
+	} );
+
+	describe( '#groupDropdownView', () => {
+		let groupDropdownView;
+
+		beforeEach( () => {
+			groupDropdownView = view.groupDropdownView;
+		} );
+
+		it( 'has a default #value', () => {
+			expect( view.currentGroupName ).to.equal( 'groupA' );
+		} );
+
+		it( 'binds its buttonView#label to #value', () => {
+			expect( groupDropdownView.buttonView.label ).to.equal( 'groupA' );
+
+			groupDropdownView.listView.items.last.children.first.fire( 'execute' );
+			expect( groupDropdownView.buttonView.label ).to.equal( 'groupB' );
+		} );
+
+		it( 'configures the #buttonView', () => {
+			expect( groupDropdownView.buttonView.isOn ).to.be.false;
+			expect( groupDropdownView.buttonView.withText ).to.be.true;
+			expect( groupDropdownView.buttonView.tooltip ).to.equal( 'Character categories' );
+		} );
+
+		it( 'delegates #execute to the naviation view', () => {
+			const spy = sinon.spy();
+
+			view.on( 'execute', spy );
+
+			groupDropdownView.fire( 'execute' );
+			sinon.assert.calledOnce( spy );
+		} );
+
+		describe( 'character group list items', () => {
+			it( 'have basic properties', () => {
+				expect( groupDropdownView.listView.items
+					.map( item => {
+						const { label, withText } = item.children.first;
+
+						return { label, withText };
+					} ) )
+					.to.deep.equal( [
+						{ label: 'groupA', withText: true },
+						{ label: 'groupB', withText: true },
+					] );
+			} );
+
+			it( 'bind #isOn to the #value of the dropdown', () => {
+				const firstButton = groupDropdownView.listView.items.first.children.last;
+				const lastButton = groupDropdownView.listView.items.last.children.last;
+
+				expect( firstButton.isOn ).to.be.true;
+				expect( lastButton.isOn ).to.be.false;
+
+				groupDropdownView.value = 'groupB';
+				expect( firstButton.isOn ).to.be.false;
+				expect( lastButton.isOn ).to.be.true;
+			} );
+		} );
+	} );
+} );