Replace hetero-list YUI button and menu with new style button and tip…

…py.js menu (#8340) * refresh hetero-list UI use new button style replace the YUI menu with a tippy menu * fix lint errors * avoid blanks * prettier * keep button in div * fix test * fix test #2 * convert inputs to buttons for plugins * prettier * remove unnecessary style definition * remove adjunct * adjust filter --------- Co-authored-by: Tim Jacomb <[email protected]>
jenkinsci · Aug 21, 2023 · c1a6c6c · c1a6c6c
1 parent ee02eec
commit c1a6c6c
Show file tree

Hide file tree

Showing 12 changed files with 389 additions and 292 deletions.
diff --git a/core/src/main/resources/lib/form/filter-menu-button/filter-menu-button.js b/core/src/main/resources/lib/form/filter-menu-button/filter-menu-button.js
diff --git a/core/src/main/resources/lib/form/hetero-list.jelly b/core/src/main/resources/lib/form/hetero-list.jelly
@@ -107,8 +107,6 @@ THE SOFTWARE.
     </d:tag>
   </d:taglib>
 
-  <st:adjunct includes="lib.form.hetero-list.hetero-list"/>
-
   <j:set var="targetType" value="${attrs.targetType?:it.class}"/>
   <div class="jenkins-form-item hetero-list-container ${hasHeader?'with-drag-drop':''} ${attrs.oneEach?'one-each':''} ${attrs.honorOrder?'honor-order':''}">
     <!-- display existing items -->
@@ -156,7 +154,8 @@ THE SOFTWARE.
 
     <j:if test="${!readOnlyMode}">
       <div>
-        <input type="button" value="${attrs.addCaption?:'%Add'}" class="hetero-list-add" menualign="${attrs.menuAlign}" suffix="${attrs.name}"/>
+        <button type="button" class="jenkins-button hetero-list-add" menualign="${attrs.menuAlign}" suffix="${attrs.name}">${attrs.addCaption?:'%Add'}<l:icon src="symbol-chevron-down"/>
+        </button>
       </div>
     </j:if>
   </div>

diff --git a/core/src/main/resources/lib/form/hetero-list/hetero-list.js b/core/src/main/resources/lib/form/hetero-list/hetero-list.js
diff --git a/test/src/test/java/lib/form/HeteroListTest.java b/test/src/test/java/lib/form/HeteroListTest.java
@@ -49,7 +49,7 @@
 import org.htmlunit.html.HtmlButton;
 import org.htmlunit.html.HtmlElementUtil;
 import org.htmlunit.html.HtmlPage;
-import org.htmlunit.javascript.host.html.HTMLAnchorElement;
+import org.htmlunit.javascript.host.html.HTMLButtonElement;
 import org.jenkinsci.Symbol;
 import org.junit.Rule;
 import org.junit.Test;
@@ -75,9 +75,9 @@ public void xssPrevented_heteroList_usingDescriptorDisplayName() throws Exceptio
         HtmlPage page = wc.goTo("root");
 
         page.executeJavaScript("document.querySelector('.hetero-list-add').click();");
-        Object result = page.executeJavaScript("document.querySelector('.yuimenuitem a')").getJavaScriptResult();
-        assertThat(result, instanceOf(HTMLAnchorElement.class));
-        HTMLAnchorElement menuItem = (HTMLAnchorElement) result;
+        Object result = page.executeJavaScript("document.querySelector('.jenkins-dropdown__item')").getJavaScriptResult();
+        assertThat(result, instanceOf(HTMLButtonElement.class));
+        HTMLButtonElement menuItem = (HTMLButtonElement) result;
         String menuItemContent = menuItem.getInnerHTML();
         assertThat(menuItemContent, not(containsString("<")));
     }