From 725d8d9f8137f31cfa609f9a263f0d27d8c89b38 Mon Sep 17 00:00:00 2001
From: Thomas Deuling <info@coding.ms>
Date: Mon, 27 Mar 2017 22:18:44 +0200
Subject: [PATCH] [TASK] Add data attributes in backend toolbar and menu
 components

Add data attributes in backend toolbar and backend menu components,
to have general identifier for binding guided tours popover and
more features that can be based on this.

Resolves: #80500
Releases: master, 8.7
Change-Id: I2add8b8c28ecd37967b7b23f71392aa71f209da5
Reviewed-on: https://review.typo3.org/52197
Tested-by: TYPO3com <no-reply@typo3.com>
Reviewed-by: Mathias Schreiber <mathias.schreiber@typo3.com>
Tested-by: Mathias Schreiber <mathias.schreiber@typo3.com>
Reviewed-by: Frank Naegler <frank.naegler@typo3.org>
Tested-by: Frank Naegler <frank.naegler@typo3.org>
---
 .../backend/Classes/Controller/BackendController.php | 10 ++++++++--
 .../Classes/Template/Components/Menu/Menu.php        | 12 ++++++++++++
 .../backend/Classes/Utility/BackendUtility.php       | 10 ++++++++--
 .../Resources/Private/Partials/Backend/Topbar.html   |  4 ++--
 .../Private/Partials/Menus/SelectBoxJumpMenu.html    |  4 ++--
 5 files changed, 32 insertions(+), 8 deletions(-)

diff --git a/typo3/sysext/backend/Classes/Controller/BackendController.php b/typo3/sysext/backend/Classes/Controller/BackendController.php
index 140b5ebb0469..cde55f54e2ce 100644
--- a/typo3/sysext/backend/Classes/Controller/BackendController.php
+++ b/typo3/sysext/backend/Classes/Controller/BackendController.php
@@ -350,12 +350,18 @@ protected function renderToolbar()
                 }
 
                 // Create a unique id from class name
-                $className = get_class($toolbarItem);
-                $className = GeneralUtility::underscoredToLowerCamelCase($className);
+                $fullyQualifiedClassName = get_class($toolbarItem);
+                $className = GeneralUtility::underscoredToLowerCamelCase($fullyQualifiedClassName);
                 $className = GeneralUtility::camelCaseToLowerCaseUnderscored($className);
                 $className = str_replace(['_', '\\'], '-', $className);
                 $liAttributes[] = 'id="' . $className . '"';
 
+                // Create data attribute identifier
+                $shortName = substr($fullyQualifiedClassName, strrpos($fullyQualifiedClassName, '\\') + 1);
+                $dataToolbarIdentifier = GeneralUtility::camelCaseToLowerCaseUnderscored($shortName);
+                $dataToolbarIdentifier = str_replace('_', '-', $dataToolbarIdentifier);
+                $liAttributes[] = 'data-toolbar-identifier="' . htmlspecialchars($dataToolbarIdentifier) . '"';
+
                 $toolbar[] = '<li ' . implode(' ', $liAttributes) . '>';
 
                 if ($hasDropDown) {
diff --git a/typo3/sysext/backend/Classes/Template/Components/Menu/Menu.php b/typo3/sysext/backend/Classes/Template/Components/Menu/Menu.php
index fbaaf0c9093e..6ac05f0b0b15 100644
--- a/typo3/sysext/backend/Classes/Template/Components/Menu/Menu.php
+++ b/typo3/sysext/backend/Classes/Template/Components/Menu/Menu.php
@@ -115,6 +115,18 @@ public function getIdentifier()
         return $this->identifier;
     }
 
+    /**
+     * Get identifier for data attribute
+     *
+     * @return string
+     */
+    public function getDataIdentifier(): string
+    {
+        $dataMenuIdentifier = GeneralUtility::camelCaseToLowerCaseUnderscored($this->identifier);
+        $dataMenuIdentifier = str_replace('_', '-', $dataMenuIdentifier);
+        return $dataMenuIdentifier;
+    }
+
     /**
      * MenuItem Factory Method
      *
diff --git a/typo3/sysext/backend/Classes/Utility/BackendUtility.php b/typo3/sysext/backend/Classes/Utility/BackendUtility.php
index fbb81ffc3d89..4b6edc15e021 100644
--- a/typo3/sysext/backend/Classes/Utility/BackendUtility.php
+++ b/typo3/sysext/backend/Classes/Utility/BackendUtility.php
@@ -2811,12 +2811,15 @@ public static function getFuncMenu(
                 . ((string)$currentValue === (string)$value ? ' selected="selected"' : '') . '>'
                 . htmlspecialchars($label, ENT_COMPAT, 'UTF-8', false) . '</option>';
         }
+        $dataMenuIdentifier = str_replace(['SET[', ']'], '', $elementName);
+        $dataMenuIdentifier = GeneralUtility::camelCaseToLowerCaseUnderscored($dataMenuIdentifier);
+        $dataMenuIdentifier = str_replace('_', '-', $dataMenuIdentifier);
         if (!empty($options)) {
             $onChange = 'jumpToUrl(' . GeneralUtility::quoteJSvalue($scriptUrl . '&' . $elementName . '=') . '+this.options[this.selectedIndex].value,this);';
             return '
 
 				<!-- Function Menu of module -->
-				<select class="form-control" name="' . $elementName . '" onchange="' . htmlspecialchars($onChange) . '">
+				<select class="form-control" name="' . $elementName . '" onchange="' . htmlspecialchars($onChange) . '" data-menu-identifier="' . htmlspecialchars($dataMenuIdentifier) . '">
 					' . implode('
 					', $options) . '
 				</select>
@@ -2858,12 +2861,15 @@ public static function getDropdownMenu(
                 . ((string)$currentValue === (string)$value ? ' selected="selected"' : '') . '>'
                 . htmlspecialchars($label, ENT_COMPAT, 'UTF-8', false) . '</option>';
         }
+        $dataMenuIdentifier = str_replace(['SET[', ']'], '', $elementName);
+        $dataMenuIdentifier = GeneralUtility::camelCaseToLowerCaseUnderscored($dataMenuIdentifier);
+        $dataMenuIdentifier = str_replace('_', '-', $dataMenuIdentifier);
         if (!empty($options)) {
             $onChange = 'jumpToUrl(' . GeneralUtility::quoteJSvalue($scriptUrl . '&' . $elementName . '=') . '+this.options[this.selectedIndex].value,this);';
             return '
 			<div class="form-group">
 				<!-- Function Menu of module -->
-				<select class="form-control input-sm" name="' . htmlspecialchars($elementName) . '" onchange="' . htmlspecialchars($onChange) . '">
+				<select class="form-control input-sm" name="' . htmlspecialchars($elementName) . '" onchange="' . htmlspecialchars($onChange) . '" data-menu-identifier="' . htmlspecialchars($dataMenuIdentifier) . '">
 					' . implode(LF, $options) . '
 				</select>
 			</div>
diff --git a/typo3/sysext/backend/Resources/Private/Partials/Backend/Topbar.html b/typo3/sysext/backend/Resources/Private/Partials/Backend/Topbar.html
index b1626a19e865..4b64fc207638 100644
--- a/typo3/sysext/backend/Resources/Private/Partials/Backend/Topbar.html
+++ b/typo3/sysext/backend/Resources/Private/Partials/Backend/Topbar.html
@@ -1,4 +1,4 @@
-<div class="scaffold-topbar t3js-scaffold-topbar">
+<div class="scaffold-topbar t3js-scaffold-topbar" data-topbar-identifier="topbar">
 	<div class="topbar">
 		<div class="topbar-header t3js-topbar-header">
 			<button class="topbar-button topbar-button-modulemenu t3js-topbar-button-modulemenu">
@@ -27,7 +27,7 @@
 		</div>
 	</div>
 </div>
-<div class="scaffold-toolbar t3js-scaffold-toolbar">
+<div class="scaffold-toolbar t3js-scaffold-toolbar" data-toolbar-identifier="toolbar">
 	<div class="toolbar t3js-topbar-toolbar">
 		<ul class="toolbar-list" data-typo3-role="typo3-module-menu">
 			<f:format.raw>{toolbar}</f:format.raw>
diff --git a/typo3/sysext/backend/Resources/Private/Partials/Menus/SelectBoxJumpMenu.html b/typo3/sysext/backend/Resources/Private/Partials/Menus/SelectBoxJumpMenu.html
index c6c7e7d673e3..bfa9bbbf227c 100644
--- a/typo3/sysext/backend/Resources/Private/Partials/Menus/SelectBoxJumpMenu.html
+++ b/typo3/sysext/backend/Resources/Private/Partials/Menus/SelectBoxJumpMenu.html
@@ -1,5 +1,5 @@
-{menu.label} <select class="form-control t3-js-jumpMenuBox" name="{menu.identifier}" onchange="if(this.options[this.selectedIndex].value){window.location.href=(this.options[this.selectedIndex].value);}">
+{menu.label} <select class="form-control t3-js-jumpMenuBox" name="{menu.identifier}" data-menu-identifier="{menu.dataIdentifier}" onchange="if(this.options[this.selectedIndex].value){window.location.href=(this.options[this.selectedIndex].value);}">
 	<f:for each="{menu.menuItems}" as="menuItem">
 		<option value="{menuItem.href}" {f:if(condition: '{menuItem.active}', then: ' selected="selected"')}>{menuItem.title}</option>
 	</f:for>
-</select>
\ No newline at end of file
+</select>