Accessibility: CodeMirror editing areas minor improvements.

- properly labels all the code editor areas (Theme/Plugin, Custom HTML widget, Additional CSS), whether CodeMirror is enabled or disabled
- adds `role="textbox"` and `aria-multiline="true"` to the CodeMirror editing area to allow assistive technologies properly identify it as a textarea
- standardizes the "keyboard trap" help text across the admin and keeps it as a list for better readability
- use the Help text elements as target for `aria-describedby`, to make screen readers read out the help text when focusing the editors
- fixes the `aria-expanded` attribute usage in the Customizer "Additional CSS" help toggle
- moves focus to the CodeMirror editing area when clicking on the associated label
- in the Plugin editor screen: changes a `<big>` element to `<h2>` for better semantics and consistency with the Theme editor screen
- also, removes a few textdomain leftovers, see `better-code-editing` and `default`

Props westonruter, melchoyce, afercia.
Fixes #41872.


git-svn-id: https://develop.svn.wordpress.org/trunk@41586 602fd350-edb4-49c9-b593-d223f7449a82

src/wp-admin/js/theme-plugin-editor.js

@@ -83,6 +83,20 @@ wp.themePluginEditor = (function( $ ) {
 
 		editor = wp.codeEditor.initialize( $( '#newcontent' ), codeEditorSettings );
 
+		// Improve the editor accessibility.
+		$( editor.codemirror.display.lineDiv )
+			.attr({
+				role: 'textbox',
+				'aria-multiline': 'true',
+				'aria-labelledby': 'theme-plugin-editor-label',
+				'aria-describedby': 'editor-keyboard-trap-help-1 editor-keyboard-trap-help-2 editor-keyboard-trap-help-3 editor-keyboard-trap-help-4'
+			});
+
+		// Focus the editor when clicking on its label.
+		$( '#theme-plugin-editor-label' ).on( 'click', function() {
+			editor.codemirror.focus();
+		});
+
 		component.instance = editor;
 	};