Merge pull request #201 from ckeditor/t/ckeditor5/1404

Other: The table widget toolbar should have a proper `aria-label` attribute (see ckeditor/ckeditor5#1404).

Author: oleq

lang/contexts.json

@@ -16,5 +16,6 @@
 	"Merge cell left": "Label for the merge table cell left button.",
 	"Split cell vertically": "Label for the split table cell vertically button.",
 	"Split cell horizontally": "Label for the split table cell horizontally button.",
-	"Merge cells": "Label for the merge table cells button."
+	"Merge cells": "Label for the merge table cells button.",
+	"Table toolbar": "The label used by assistive technologies describing a table toolbar attached to a table widget."
 }

src/tabletoolbar.js

@@ -42,6 +42,7 @@ export default class TableToolbar extends Plugin {
 	 */
 	afterInit() {
 		const editor = this.editor;
+		const t = editor.t;
 		const widgetToolbarRepository = editor.plugins.get( WidgetToolbarRepository );
 
 		const tableContentToolbarItems = editor.config.get( 'table.contentToolbar' );
@@ -50,13 +51,15 @@ export default class TableToolbar extends Plugin {
 
 		if ( tableContentToolbarItems ) {
 			widgetToolbarRepository.register( 'tableContent', {
+				ariaLabel: t( 'Table toolbar' ),
 				items: tableContentToolbarItems,
 				getRelatedElement: getTableWidgetAncestor
 			} );
 		}
 
 		if ( tableToolbarItems ) {
 			widgetToolbarRepository.register( 'table', {
+				ariaLabel: t( 'Table toolbar' ),
 				items: tableToolbarItems,
 				getRelatedElement: getSelectedTableWidget
 			} );

tests/tabletoolbar.js

@@ -94,6 +94,14 @@ describe( 'TableToolbar', () => {
 					balloonClassName: 'ck-toolbar-container'
 				} );
 			} );
+
+			it( 'should set aria-label attribute', () => {
+				toolbar.render();
+
+				expect( toolbar.element.getAttribute( 'aria-label' ) ).to.equal( 'Table toolbar' );
+
+				toolbar.destroy();
+			} );
 		} );
 
 		describe( 'integration with the editor focus', () => {