8
0
Просмотр исходного кода

Move aria-label as observable. Adapt tests to this change.

Mateusz Samsel 6 лет назад
Родитель
Сommit
a0ccee72ce

+ 0 - 3
packages/ckeditor5-ui/src/dropdown/utils.js

@@ -123,9 +123,6 @@ export function createDropdown( locale, ButtonClass = DropdownButtonView ) {
  *		dropdown.render()
  *		document.body.appendChild( dropdown.element );
  *
- * **Please note:** {@link module:ui/toolbar/toolbarview~ToolbarView ToolbarView} instance created for this dropdown has an obligatory
- * {@link module:utils/locale~Locale} argument. This is why the passed dropdownView has to have defined the locale as well.
- *
  * See {@link module:ui/dropdown/utils~createDropdown} and {@link module:ui/toolbar/toolbarview~ToolbarView}.
  *
  * @param {module:ui/dropdown/dropdownview~DropdownView} dropdownView A dropdown instance to which `ToolbarView` will be added.

+ 10 - 8
packages/ckeditor5-ui/src/toolbar/toolbarview.js

@@ -27,23 +27,25 @@ import { attachLinkToDocumentation } from '@ckeditor/ckeditor5-utils/src/ckedito
  */
 export default class ToolbarView extends View {
 	/**
-	 * Creates an instance of the {@link module:ui/view~View} class.
+	 * Creates an instance of the {@link module:ui/toolbar/toolbarview~ToolbarView} class.
 	 *
 	 * Also see {@link #render}.
 	 *
 	 * @param {module:utils/locale~Locale} locale The localization services instance.
-	 * @param {Object} [config]
-	 * @param {String} [config.ariaLabel] Custom label value for assistive technologies
 	 */
-	constructor( locale, { ariaLabel } = {} ) {
+	constructor( locale ) {
 		super( locale );
 
 		const bind = this.bindTemplate;
 		const t = this.t;
 
-		if ( ariaLabel === undefined ) {
-			ariaLabel = t( 'Editor\'s toolbar' );
-		}
+		/**
+		 * Label used by assistive technologies to describe this toolbar element.
+		 *
+		 * @default 'Editor toolbar'
+		 * @member {String} #ariaLabel
+		 */
+		this.set( 'ariaLabel', t( 'Editor toolbar' ) );
 
 		/**
 		 * Collection of the toolbar items (like buttons).
@@ -115,7 +117,7 @@ export default class ToolbarView extends View {
 					bind.to( 'class' )
 				],
 				role: 'toolbar',
-				'aria-label': ariaLabel
+				'aria-label': bind.to( 'ariaLabel' )
 			},
 
 			children: this.items,

+ 6 - 4
packages/ckeditor5-ui/tests/toolbar/toolbarview.js

@@ -25,10 +25,10 @@ describe( 'ToolbarView', () => {
 
 	before( () => {
 		addTranslations( 'pl', {
-			'Editor\'s toolbar': 'Pasek narzędzi edytora'
+			'Editor toolbar': 'Pasek narzędzi edytora'
 		} );
 		addTranslations( 'en', {
-			'Editor\'s toolbar': 'Editor\'s toolbar'
+			'Editor toolbar': 'Editor toolbar'
 		} );
 	} );
 	after( () => {
@@ -339,11 +339,13 @@ describe( 'ToolbarView', () => {
 	describe( 'aria', () => {
 		it( 'should poses required attributes', () => {
 			expect( view.element.getAttribute( 'role' ) ).to.equal( 'toolbar' );
-			expect( view.element.getAttribute( 'aria-label' ) ).to.equal( 'Editor\'s toolbar' );
+			expect( view.element.getAttribute( 'aria-label' ) ).to.equal( 'Editor toolbar' );
 		} );
 
 		it( 'should apply custom aria label', () => {
-			const view = new ToolbarView( locale, { ariaLabel: 'Custom label' } );
+			const view = new ToolbarView( locale );
+
+			view.ariaLabel = 'Custom label';
 
 			view.render();