From 9da3949c47dc114581d29f2999ab0530bd4a7356 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bartosz=20Dziewo=C5=84ski?= <matma.rex@gmail.com>
Date: Wed, 17 Mar 2021 18:54:55 +0100
Subject: [PATCH] Add accessibility labels to a few controls

Topic title field and old wikitext reply field had only placeholders,
but no labels.

Mode selector had labels on individual items, but not on the main
control.

Change-Id: I422e7e5baa8711340a1bb82255e788f2272c45c9
---
 extension.json                    | 3 ++-
 modules/NewTopicController.js     | 1 +
 modules/dt.ui.ReplyWidget.js      | 1 +
 modules/dt.ui.ReplyWidgetPlain.js | 1 +
 4 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/extension.json b/extension.json
index 496795781..722f0f2b4 100644
--- a/extension.json
+++ b/extension.json
@@ -151,7 +151,8 @@
 				"discussiontools-replywidget-transcluded",
 				"visualeditor-key-ctrl",
 				"visualeditor-key-enter",
-				"visualeditor-key-escape"
+				"visualeditor-key-escape",
+				"visualeditor-mweditmode-tooltip"
 			],
 			"dependencies": [
 				"oojs-ui-widgets",
diff --git a/modules/NewTopicController.js b/modules/NewTopicController.js
index 8aa03408e..a31048f83 100644
--- a/modules/NewTopicController.js
+++ b/modules/NewTopicController.js
@@ -19,6 +19,7 @@ function NewTopicController( $pageContainer, $replyLink ) {
 		placeholder: mw.msg( 'discussiontools-newtopic-placeholder-title' ),
 		spellcheck: true
 	} );
+	this.sectionTitle.$input.attr( 'aria-label', mw.msg( 'discussiontools-newtopic-placeholder-title' ) );
 	this.sectionTitleField = new OO.ui.FieldLayout( this.sectionTitle, {
 		align: 'top'
 	} );
diff --git a/modules/dt.ui.ReplyWidget.js b/modules/dt.ui.ReplyWidget.js
index 44b7db1c1..8c89032b8 100644
--- a/modules/dt.ui.ReplyWidget.js
+++ b/modules/dt.ui.ReplyWidget.js
@@ -100,6 +100,7 @@ function ReplyWidget( commentController, comment, pageName, oldId, config ) {
 		],
 		framed: false
 	} );
+	this.modeTabSelect.$element.attr( 'aria-label', mw.msg( 'visualeditor-mweditmode-tooltip' ) );
 	// Make the option for the current mode disabled, to make it un-interactable
 	// (we override the styles to make it look as if it was selected)
 	this.modeTabSelect.findItemFromData( this.getMode() ).setDisabled( true );
diff --git a/modules/dt.ui.ReplyWidgetPlain.js b/modules/dt.ui.ReplyWidgetPlain.js
index 523ba4e79..7330ff6cc 100644
--- a/modules/dt.ui.ReplyWidgetPlain.js
+++ b/modules/dt.ui.ReplyWidgetPlain.js
@@ -40,6 +40,7 @@ ReplyWidgetPlain.prototype.createReplyBodyWidget = function ( config ) {
 		// * mw-editfont-serif
 		classes: [ 'mw-editfont-' + mw.user.options.get( 'editfont' ) ]
 	}, config ) );
+	textInput.$input.attr( 'aria-label', config.placeholder );
 	// Fix jquery.ime position (T255191)
 	textInput.$input.addClass( 'ime-position-inside' );
 	return textInput;