1 files changed, 31 insertions, 0 deletions
diff --git a/core/misc/details.js b/core/misc/details.js
new file mode 100644
index 00000000000..53927987d1c
--- /dev/null
+++ b/core/misc/details.js
@@ -0,0 +1,31 @@
+/**
+ * @file
+ * Additional functionality for HTML5 details elements.
+ */
+
+(function ($) {
+  /**
+   * Open parent details elements of a targeted page fragment.
+   *
+   * Opens all (nested) details element on a hash change or fragment link click
+   * when the target is a child element, in order to make sure the targeted
+   * element is visible. Aria attributes on the summary
+   * are set by triggering the click event listener in details-aria.js.
+   *
+   * @param {jQuery.Event} e
+   *   The event triggered.
+   * @param {jQuery} $target
+   *   The targeted node as a jQuery object.
+   */
+  const handleFragmentLinkClickOrHashChange = (e, $target) => {
+    $target.parents('details').not('[open]').find('> summary').trigger('click');
+  };
+
+  /**
+   * Binds a listener to handle fragment link clicks and URL hash changes.
+   */
+  $('body').on(
+    'formFragmentLinkClickOrHashChange.details',
+    handleFragmentLinkClickOrHashChange,
+  );
+})(jQuery);