adjust .ck-content aria values (label, describedby)

src/Field.php

@@ -317,6 +317,8 @@ protected function inputHtml(mixed $value, ElementInterface $element = null): st
         $baseConfig = [
             'defaultTransform' => $defaultTransform?->handle,
             'elementSiteId' => $element?->siteId,
+            'fieldName' => Craft::t('site', $this->name),
+            'describedBy' => $this->_describedBy($view),
             'findAndReplace' => [
                 'uiType' => 'dropdown',
             ],
@@ -910,4 +912,25 @@ private function _adjustPurifierConfig(HTMLPurifier_Config $purifierConfig): HTM
 
         return $purifierConfig;
     }
+
+    /**
+     * Namespaces field's $describedBy value to be passed to the field.
+     *
+     * @param View $view
+     * @return string
+     */
+    private function _describedBy(View $view): string
+    {
+        if (!empty($this->describedBy)) {
+            $describedByArray = explode(' ', $this->describedBy);
+            $namespace = trim(preg_replace('/\[|\]/', '-', $view->getNamespace()), '-');
+            foreach ($describedByArray as $key => $item) {
+                $describedByArray[$key] = "$namespace-$item";
+            }
+
+            return implode(' ', $describedByArray);
+        }
+
+        return '';
+    }
 }

src/web/assets/ckeditor/src/ckeditor5-craftcms.js

@@ -404,6 +404,30 @@ export const create = async function (element, config) {
     Object.assign({plugins}, config),
   );
 
+  // accessibility: https://github.com/craftcms/ckeditor/issues/74
+  editor.editing.view.change((writer) => {
+    const viewEditableRoot = editor.editing.view.document.getRoot();
+
+    // adjust aria-label
+    if (typeof config.fieldName != 'undefined' && config.fieldName.length) {
+      let ariaLabel = viewEditableRoot.getAttribute('aria-label');
+      writer.setAttribute(
+        'aria-label',
+        config.fieldName + ', ' + ariaLabel,
+        viewEditableRoot,
+      );
+    }
+
+    // adjust aria-describedby
+    if (typeof config.describedBy != 'undefined' && config.describedBy.length) {
+      writer.setAttribute(
+        'aria-describedby',
+        config.describedBy,
+        viewEditableRoot,
+      );
+    }
+  });
+
   // Update the source element before the initial form value has been recorded,
   // in case the value needs to be normalized
   editor.updateSourceElement();