From f76842e9ceabb15fe9b5731d8cee8aecae01cc51 Mon Sep 17 00:00:00 2001 From: panr Date: Wed, 25 Mar 2020 16:03:35 +0100 Subject: [PATCH] Change #field to #fieldView --- src/labeledfield/labeledfieldview.js | 6 +- tests/labeledfield/labeledfieldview.js | 102 ++++++++++++------------- tests/labeledfield/utils.js | 68 ++++++++--------- 3 files changed, 88 insertions(+), 88 deletions(-) diff --git a/src/labeledfield/labeledfieldview.js b/src/labeledfield/labeledfieldview.js index 90aa546b..793de6a4 100644 --- a/src/labeledfield/labeledfieldview.js +++ b/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(); } } diff --git a/tests/labeledfield/labeledfieldview.js b/tests/labeledfield/labeledfieldview.js index 561fd548..21d709cb 100644 --- a/tests/labeledfield/labeledfieldview.js +++ b/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 ); } ); diff --git a/tests/labeledfield/utils.js b/tests/labeledfield/utils.js index 86ababeb..72bb84b4 100644 --- a/tests/labeledfield/utils.js +++ b/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; } ); } ); } );