From 4394164fe63b98252b2796f9efade1803b75356c Mon Sep 17 00:00:00 2001
From: LucasC <lucas.charpentier@xwiki.com>
Date: Wed, 15 Oct 2025 15:22:10 +0200
Subject: [PATCH] XWIKI-23602: Error boxes expand, but the markup does not
 convey this information to AT users * Converted makeRenderingErrorsExpandable
 to a jquery based function instead of one relying on prototype. * Added the
 appropriate markup for a extend/collapse pattern. * Moved an inline style to
 its block in messages.less

---
 .../resources/flamingo/less/messages.less     |  4 ++
 .../main/webapp/resources/js/xwiki/xwiki.js   | 48 +++++++++++--------
 2 files changed, 33 insertions(+), 19 deletions(-)

diff --git a/xwiki-platform-core/xwiki-platform-flamingo/xwiki-platform-flamingo-skin/xwiki-platform-flamingo-skin-resources/src/main/resources/flamingo/less/messages.less b/xwiki-platform-core/xwiki-platform-flamingo/xwiki-platform-flamingo-skin/xwiki-platform-flamingo-skin-resources/src/main/resources/flamingo/less/messages.less
index a7c84a1d38c5..5ebcb388ab0b 100644
--- a/xwiki-platform-core/xwiki-platform-flamingo/xwiki-platform-flamingo-skin/xwiki-platform-flamingo-skin-resources/src/main/resources/flamingo/less/messages.less
+++ b/xwiki-platform-core/xwiki-platform-flamingo/xwiki-platform-flamingo-skin/xwiki-platform-flamingo-skin-resources/src/main/resources/flamingo/less/messages.less
@@ -107,6 +107,10 @@ div.xwikirenderingerror {
   & + .xwikirenderingerrordescription {
     margin-top: -20px;
   }
+  
+  &[role="button"] {
+    cursor: pointer;
+  }
 }
 
 // In every cases, apply the DANGER styling from bootstrap
diff --git a/xwiki-platform-core/xwiki-platform-web/xwiki-platform-web-war/src/main/webapp/resources/js/xwiki/xwiki.js b/xwiki-platform-core/xwiki-platform-web/xwiki-platform-web-war/src/main/webapp/resources/js/xwiki/xwiki.js
index 86a562eb173e..e20f2e8ea505 100644
--- a/xwiki-platform-core/xwiki-platform-web/xwiki-platform-web-war/src/main/webapp/resources/js/xwiki/xwiki.js
+++ b/xwiki-platform-core/xwiki-platform-web/xwiki-platform-web-war/src/main/webapp/resources/js/xwiki/xwiki.js
@@ -308,24 +308,6 @@ Object.extend(XWiki, {
      }
   },
 
-  /**
-   * Add click listeners on all rendereing error messages to let the user read the detailed error description.
-   * If a content is passed, add click listener for errors reported in this content (usefull for AJAX requests response)
-   * Otherwise make all the document's body errors expandable.
-   */
-  makeRenderingErrorsExpandable: function(content) {
-    $(content || 'body').select(".xwikirenderingerror").each(function(error) {
-        var description = error.next(".xwikirenderingerrordescription");
-        if(description.innerHTML !== "" && description.hasClassName("xwikirenderingerrordescription")) {
-            error.style.cursor="pointer";
-            error.title = "$escapetool.javascript($services.localization.render('platform.core.rendering.error.readTechnicalInformation'))";
-            Event.observe(error, "click", function(event){
-                   event.element().closest(".xwikirenderingerror").next(".xwikirenderingerrordescription").toggleClassName("hidden");
-            });
-        }
-    });
-  },
-
   /**
    * Make links marked with rel="external" in an external window and sets the target attribute to any
    * rel attribute starting with "_". Note that We need to do this in Javascript
@@ -551,7 +533,6 @@ Object.extend(XWiki, {
   _addBehaviour: function(container) {
     container = container || $('body');
 
-    this.makeRenderingErrorsExpandable(container);
     this.fixLinksTargetAttribute(container);
     this.insertSectionEditLinks(container);
     this.registerPanelToggle(container);
@@ -1849,6 +1830,7 @@ require(['jquery', 'xwiki-meta', 'bootstrap'], ($, xm) => {
         if (XWiki.docsyntax !== "xwiki/1.0" && XWiki.contextaction === "view" && XWiki.hasEdit) {
             $(rootElement).find('span.wikicreatelink:not(.skipCreatePagePopup) a').on('click', loadCreateModal);
         }
+        makeRenderingErrorsExpandable(rootElement);
     }
 
     function loadCreateModal(event) {
@@ -1881,6 +1863,34 @@ require(['jquery', 'xwiki-meta', 'bootstrap'], ($, xm) => {
         })
     }
 
+    /**
+     * Add click listeners on all rendering error messages to let the user read the detailed error description.
+     * If a content is passed, add click listener for errors reported in this content (useful for AJAX requests response)
+     * Otherwise make all the document's body errors expandable.
+     */
+    function makeRenderingErrorsExpandable(content) {
+        $(content || 'body').find('.xwikirenderingerror').each(function (index) {
+            let error = $(this);
+            let description = error.next(".xwikirenderingerrordescription");
+            if (description.innerHTML !== "" && description.hasClass("xwikirenderingerrordescription")) {
+                error.attr('id', 'xwikirenderingerror-' + index);
+                error.attr('role', 'button');
+                description.attr('id', 'xwikirenderingerrordescription-' + index);
+                error.attr('aria-controls', 'xwikirenderingerrordescription-' + index);
+                error.attr('aria-expanded', false);
+                let buttonDescription = "$escapetool.javascript($services.localization.render('platform.core.rendering.error.readTechnicalInformation'))"
+                error.attr('title', buttonDescription);
+                error.on("click", function () {
+                    // Toggle both the description class and the aria-expanded attribute of the button.
+                    let error = $(this);
+                    let description = error.next('.xwikirenderingerrordescription');
+                    description.toggleClass("hidden");
+                    error.attr('aria-expanded', error.attr('aria-expanded') === 'true' ? 'false' : 'true')
+                });
+            }
+        });
+    }
+
     $(document).on('xwiki:dom:updated', (event, data) => {
         const containers = data?.elements || [document.documentElement];
         containers.forEach(init);