Parcourir la source

Change #field to #fieldView

panr il y a 5 ans
Parent
commit
8727565cce

+ 3 - 3
packages/ckeditor5-ui/src/labeledfield/labeledfieldview.js

@@ -74,7 +74,7 @@ export default class LabeledFieldView extends View {
 		 *
 		 * @member {module:ui/view~View} #field
 		 */
-		this.field = viewCreator( this, viewUid, statusUid );
+		this.fieldView = viewCreator( this, viewUid, statusUid );
 
 		/**
 		 * The text of the label.
@@ -175,7 +175,7 @@ export default class LabeledFieldView extends View {
 			},
 			children: [
 				this.labelView,
-				this.field,
+				this.fieldView,
 				this.statusView
 			]
 		} );
@@ -236,6 +236,6 @@ export default class LabeledFieldView extends View {
 	 * Focuses the {@link #field}.
 	 */
 	focus() {
-		this.field.focus();
+		this.fieldView.focus();
 	}
 }

+ 51 - 51
packages/ckeditor5-ui/tests/labeledfield/labeledfieldview.js

@@ -10,10 +10,10 @@ import LabelView from '../../src/label/labelview';
 describe( 'LabeledFieldView', () => {
 	const locale = {};
 
-	let labeledFieldView, view;
+	let labeledInput, view;
 
 	beforeEach( () => {
-		labeledFieldView = new LabeledFieldView( locale, ( labeledFieldView, viewUid, statusUid ) => {
+		labeledInput = new LabeledFieldView( locale, ( labeledInput, viewUid, statusUid ) => {
 			view = new View( locale );
 			view.setTemplate( { tag: 'div' } );
 			view.focus = () => {};
@@ -23,120 +23,120 @@ describe( 'LabeledFieldView', () => {
 			return view;
 		} );
 
-		labeledFieldView.render();
+		labeledInput.render();
 	} );
 
 	afterEach( () => {
-		labeledFieldView.destroy();
+		labeledInput.destroy();
 	} );
 
 	describe( 'constructor()', () => {
-		it( 'should set labeledFieldView#locale', () => {
-			expect( labeledFieldView.locale ).to.deep.equal( locale );
+		it( 'should set labeledInput#locale', () => {
+			expect( labeledInput.locale ).to.deep.equal( locale );
 		} );
 
-		it( 'should set labeledFieldView#field', () => {
-			expect( labeledFieldView.field ).to.equal( view );
+		it( 'should set labeledInput#field', () => {
+			expect( labeledInput.fieldView ).to.equal( view );
 		} );
 
-		it( 'should set labeledFieldView#label', () => {
-			expect( labeledFieldView.label ).to.be.undefined;
+		it( 'should set labeledInput#label', () => {
+			expect( labeledInput.label ).to.be.undefined;
 		} );
 
-		it( 'should set labeledFieldView#isEnabled', () => {
-			expect( labeledFieldView.isEnabled ).to.be.true;
+		it( 'should set labeledInput#isEnabled', () => {
+			expect( labeledInput.isEnabled ).to.be.true;
 		} );
 
-		it( 'should set labeledFieldView#errorText', () => {
-			expect( labeledFieldView.errorText ).to.be.null;
+		it( 'should set labeledInput#errorText', () => {
+			expect( labeledInput.errorText ).to.be.null;
 		} );
 
-		it( 'should set labeledFieldView#infoText', () => {
-			expect( labeledFieldView.infoText ).to.be.null;
+		it( 'should set labeledInput#infoText', () => {
+			expect( labeledInput.infoText ).to.be.null;
 		} );
 
-		it( 'should set labeledFieldView#class', () => {
-			expect( labeledFieldView.class ).to.be.undefined;
+		it( 'should set labeledInput#class', () => {
+			expect( labeledInput.class ).to.be.undefined;
 		} );
 
-		it( 'should create labeledFieldView#labelView', () => {
-			expect( labeledFieldView.labelView ).to.instanceOf( LabelView );
+		it( 'should create labeledInput#labelView', () => {
+			expect( labeledInput.labelView ).to.instanceOf( LabelView );
 		} );
 
-		it( 'should create labeledFieldView#statusView', () => {
-			expect( labeledFieldView.statusView ).to.instanceOf( View );
+		it( 'should create labeledInput#statusView', () => {
+			expect( labeledInput.statusView ).to.instanceOf( View );
 
-			expect( labeledFieldView.statusView.element.tagName ).to.equal( 'DIV' );
-			expect( labeledFieldView.statusView.element.classList.contains( 'ck' ) ).to.be.true;
-			expect( labeledFieldView.statusView.element.classList.contains( 'ck-labeled-view__status' ) ).to.be.true;
+			expect( labeledInput.statusView.element.tagName ).to.equal( 'DIV' );
+			expect( labeledInput.statusView.element.classList.contains( 'ck' ) ).to.be.true;
+			expect( labeledInput.statusView.element.classList.contains( 'ck-labeled-view__status' ) ).to.be.true;
 		} );
 
 		it( 'should allow pairing #view and #labelView by unique id', () => {
-			expect( labeledFieldView.labelView.for ).to.equal( view.viewUid );
+			expect( labeledInput.labelView.for ).to.equal( view.viewUid );
 		} );
 
 		it( 'should allow pairing #view and #statusView by unique id', () => {
-			expect( view.statusUid ).to.equal( labeledFieldView.statusView.element.id );
+			expect( view.statusUid ).to.equal( labeledInput.statusView.element.id );
 		} );
 	} );
 
 	describe( 'template', () => {
 		it( 'should have the CSS class', () => {
-			expect( labeledFieldView.element.classList.contains( 'ck' ) ).to.be.true;
-			expect( labeledFieldView.element.classList.contains( 'ck-labeled-view' ) ).to.be.true;
+			expect( labeledInput.element.classList.contains( 'ck' ) ).to.be.true;
+			expect( labeledInput.element.classList.contains( 'ck-labeled-view' ) ).to.be.true;
 		} );
 
-		it( 'should have #labeledFieldView', () => {
-			expect( labeledFieldView.template.children[ 0 ] ).to.equal( labeledFieldView.labelView );
+		it( 'should have #labeledInput', () => {
+			expect( labeledInput.template.children[ 0 ] ).to.equal( labeledInput.labelView );
 		} );
 
 		it( 'should have #view', () => {
-			expect( labeledFieldView.template.children[ 1 ] ).to.equal( view );
+			expect( labeledInput.template.children[ 1 ] ).to.equal( view );
 		} );
 
 		it( 'should have the #statusView container', () => {
-			expect( labeledFieldView.template.children[ 2 ] ).to.equal( labeledFieldView.statusView );
+			expect( labeledInput.template.children[ 2 ] ).to.equal( labeledInput.statusView );
 		} );
 
 		describe( 'DOM bindings', () => {
 			describe( 'class', () => {
-				it( 'should react on labeledFieldView#class', () => {
-					labeledFieldView.class = 'foo';
-					expect( labeledFieldView.element.classList.contains( 'foo' ) ).to.be.true;
+				it( 'should react on labeledInput#class', () => {
+					labeledInput.class = 'foo';
+					expect( labeledInput.element.classList.contains( 'foo' ) ).to.be.true;
 
-					labeledFieldView.class = 'bar';
-					expect( labeledFieldView.element.classList.contains( 'foo' ) ).to.be.false;
-					expect( labeledFieldView.element.classList.contains( 'bar' ) ).to.be.true;
+					labeledInput.class = 'bar';
+					expect( labeledInput.element.classList.contains( 'foo' ) ).to.be.false;
+					expect( labeledInput.element.classList.contains( 'bar' ) ).to.be.true;
 				} );
 			} );
 
 			describe( 'status container', () => {
-				it( 'should react on labeledFieldView#errorText', () => {
-					const statusElement = labeledFieldView.statusView.element;
+				it( 'should react on labeledInput#errorText', () => {
+					const statusElement = labeledInput.statusView.element;
 
-					labeledFieldView.errorText = '';
+					labeledInput.errorText = '';
 					expect( statusElement.classList.contains( 'ck-hidden' ) ).to.be.true;
 					expect( statusElement.classList.contains( 'ck-labeled-view__status_error' ) ).to.be.false;
 					expect( statusElement.hasAttribute( 'role' ) ).to.be.false;
 					expect( statusElement.innerHTML ).to.equal( '' );
 
-					labeledFieldView.errorText = 'foo';
+					labeledInput.errorText = 'foo';
 					expect( statusElement.classList.contains( 'ck-hidden' ) ).to.be.false;
 					expect( statusElement.classList.contains( 'ck-labeled-view__status_error' ) ).to.be.true;
 					expect( statusElement.getAttribute( 'role' ) ).to.equal( 'alert' );
 					expect( statusElement.innerHTML ).to.equal( 'foo' );
 				} );
 
-				it( 'should react on labeledFieldView#infoText', () => {
-					const statusElement = labeledFieldView.statusView.element;
+				it( 'should react on labeledInput#infoText', () => {
+					const statusElement = labeledInput.statusView.element;
 
-					labeledFieldView.infoText = '';
+					labeledInput.infoText = '';
 					expect( statusElement.classList.contains( 'ck-hidden' ) ).to.be.true;
 					expect( statusElement.classList.contains( 'ck-labeled-view__status_error' ) ).to.be.false;
 					expect( statusElement.hasAttribute( 'role' ) ).to.be.false;
 					expect( statusElement.innerHTML ).to.equal( '' );
 
-					labeledFieldView.infoText = 'foo';
+					labeledInput.infoText = 'foo';
 					expect( statusElement.classList.contains( 'ck-hidden' ) ).to.be.false;
 					expect( statusElement.classList.contains( 'ck-labeled-view__status_error' ) ).to.be.false;
 					expect( statusElement.hasAttribute( 'role' ) ).to.be.false;
@@ -147,10 +147,10 @@ describe( 'LabeledFieldView', () => {
 	} );
 
 	describe( 'binding', () => {
-		it( 'should bind labeledFieldView#label to labeledFieldView.labelView#label', () => {
-			labeledFieldView.label = 'Foo bar';
+		it( 'should bind labeledInput#label to labeledInput.labelView#label', () => {
+			labeledInput.label = 'Foo bar';
 
-			expect( labeledFieldView.labelView.text ).to.equal( 'Foo bar' );
+			expect( labeledInput.labelView.text ).to.equal( 'Foo bar' );
 		} );
 	} );
 
@@ -158,7 +158,7 @@ describe( 'LabeledFieldView', () => {
 		it( 'should focus the #view in DOM', () => {
 			const spy = sinon.spy( view, 'focus' );
 
-			labeledFieldView.focus();
+			labeledInput.focus();
 
 			sinon.assert.calledOnce( spy );
 		} );

+ 34 - 34
packages/ckeditor5-ui/tests/labeledfield/utils.js

@@ -23,86 +23,86 @@ describe( 'LabeledFieldView utils', () => {
 	} );
 
 	describe( 'createLabeledInputText()', () => {
-		let labeledFieldView;
+		let labeledInput;
 
 		beforeEach( () => {
-			labeledFieldView = new LabeledFieldView( locale, createLabeledInputText );
+			labeledInput = new LabeledFieldView( locale, createLabeledInputText );
 		} );
 
 		afterEach( () => {
-			labeledFieldView.destroy();
+			labeledInput.destroy();
 		} );
 
 		it( 'should create an InputTextView instance', () => {
-			expect( labeledFieldView.field ).to.be.instanceOf( InputTextView );
+			expect( labeledInput.fieldView ).to.be.instanceOf( InputTextView );
 		} );
 
 		it( 'should pass the Locale to the input', () => {
-			expect( labeledFieldView.field.locale ).to.equal( locale );
+			expect( labeledInput.fieldView.locale ).to.equal( locale );
 		} );
 
 		it( 'should set input #id and #ariaDescribedById', () => {
-			labeledFieldView.render();
+			labeledInput.render();
 
-			expect( labeledFieldView.field.id ).to.equal( labeledFieldView.labelView.for );
-			expect( labeledFieldView.field.ariaDescribedById ).to.equal( labeledFieldView.statusView.element.id );
+			expect( labeledInput.fieldView.id ).to.equal( labeledInput.labelView.for );
+			expect( labeledInput.fieldView.ariaDescribedById ).to.equal( labeledInput.statusView.element.id );
 		} );
 
-		it( 'should bind input\'s #isReadOnly to LabeledFieldView#isEnabled', () => {
-			labeledFieldView.isEnabled = true;
-			expect( labeledFieldView.field.isReadOnly ).to.be.false;
+		it( 'should bind input\'s #isReadOnly to labeledInput#isEnabled', () => {
+			labeledInput.isEnabled = true;
+			expect( labeledInput.fieldView.isReadOnly ).to.be.false;
 
-			labeledFieldView.isEnabled = false;
-			expect( labeledFieldView.field.isReadOnly ).to.be.true;
+			labeledInput.isEnabled = false;
+			expect( labeledInput.fieldView.isReadOnly ).to.be.true;
 		} );
 
-		it( 'should bind input\'s #hasError to LabeledFieldView#errorText', () => {
-			labeledFieldView.errorText = 'some error';
-			expect( labeledFieldView.field.hasError ).to.be.true;
+		it( 'should bind input\'s #hasError to labeledInput#errorText', () => {
+			labeledInput.errorText = 'some error';
+			expect( labeledInput.fieldView.hasError ).to.be.true;
 
-			labeledFieldView.errorText = null;
-			expect( labeledFieldView.field.hasError ).to.be.false;
+			labeledInput.errorText = null;
+			expect( labeledInput.fieldView.hasError ).to.be.false;
 		} );
 
-		it( 'should clean LabeledFieldView#errorText upon input\'s DOM "update" event', () => {
-			labeledFieldView.errorText = 'some error';
-			labeledFieldView.field.fire( 'input' );
-			expect( labeledFieldView.errorText ).to.be.null;
+		it( 'should clean labeledInput#errorText upon input\'s DOM "update" event', () => {
+			labeledInput.errorText = 'some error';
+			labeledInput.fieldView.fire( 'input' );
+			expect( labeledInput.errorText ).to.be.null;
 		} );
 	} );
 
 	describe( 'createLabeledDropdown', () => {
-		let labeledFieldView;
+		let labeledDropdown;
 
 		beforeEach( () => {
-			labeledFieldView = new LabeledFieldView( locale, createLabeledDropdown );
+			labeledDropdown = new LabeledFieldView( locale, createLabeledDropdown );
 		} );
 
 		afterEach( () => {
-			labeledFieldView.destroy();
+			labeledDropdown.destroy();
 		} );
 
 		it( 'should create a DropdownView', () => {
-			expect( labeledFieldView.field ).to.be.instanceOf( DropdownView );
+			expect( labeledDropdown.fieldView ).to.be.instanceOf( DropdownView );
 		} );
 
 		it( 'should pass the Locale to the dropdown', () => {
-			expect( labeledFieldView.field.locale ).to.equal( locale );
+			expect( labeledDropdown.fieldView.locale ).to.equal( locale );
 		} );
 
 		it( 'should set dropdown\'s #id and #ariaDescribedById', () => {
-			labeledFieldView.render();
+			labeledDropdown.render();
 
-			expect( labeledFieldView.field.id ).to.equal( labeledFieldView.labelView.for );
-			expect( labeledFieldView.field.ariaDescribedById ).to.equal( labeledFieldView.statusView.element.id );
+			expect( labeledDropdown.fieldView.id ).to.equal( labeledDropdown.labelView.for );
+			expect( labeledDropdown.fieldView.ariaDescribedById ).to.equal( labeledDropdown.statusView.element.id );
 		} );
 
 		it( 'should bind dropdown\'s #isEnabled to the labeled view', () => {
-			labeledFieldView.isEnabled = true;
-			expect( labeledFieldView.field.isEnabled ).to.be.true;
+			labeledDropdown.isEnabled = true;
+			expect( labeledDropdown.fieldView.isEnabled ).to.be.true;
 
-			labeledFieldView.isEnabled = false;
-			expect( labeledFieldView.field.isEnabled ).to.be.false;
+			labeledDropdown.isEnabled = false;
+			expect( labeledDropdown.fieldView.isEnabled ).to.be.false;
 		} );
 	} );
 } );