8275889: Search dialog has redundant scrollbars

Reviewed-by: jjg

Author: hns

src/jdk.javadoc/share/classes/jdk/javadoc/internal/doclets/formats/html/markup/Head.java

@@ -319,6 +319,11 @@ private Comment getGeneratedBy(boolean timestamp, ZonedDateTime buildDate) {
     }
 
     private void addStylesheets(HtmlTree head) {
+        if (index) {
+            // Add JQuery-UI stylesheet first so its rules can be overridden.
+            addStylesheet(head, DocPaths.RESOURCE_FILES.resolve(DocPaths.JQUERY_UI_CSS));
+        }
+
         if (mainStylesheet == null) {
             mainStylesheet = DocPaths.STYLESHEET;
         }
@@ -332,10 +337,6 @@ private void addStylesheets(HtmlTree head) {
             // Local stylesheets are contained in doc-files, so omit resource-files prefix
             addStylesheet(head, path);
         }
-
-        if (index) {
-            addStylesheet(head, DocPaths.RESOURCE_FILES.resolve(DocPaths.JQUERY_UI_CSS));
-        }
     }
 
     private void addStylesheet(HtmlTree head, DocPath stylesheet) {

src/jdk.javadoc/share/classes/jdk/javadoc/internal/doclets/formats/html/resources/stylesheet.css

@@ -692,27 +692,31 @@ nav {
 /*
  * Styles for javadoc search.
  */
-.ui-state-active {
+.ui-menu .ui-state-active {
     /* Overrides the color of selection used in jQuery UI */
     background: var(--selected-background-color);
-    border: 1px solid var(--selected-background-color);
     color: var(--selected-text-color);
+    /* Workaround for browser bug, see JDK-8275889 */
+    margin: -1px 0;
+    border-top: 1px solid var(--selected-background-color);
+    border-bottom: 1px solid var(--selected-background-color);
 }
 .ui-autocomplete-category {
     font-weight:bold;
     font-size:15px;
     padding:7px 0 7px 3px;
     background-color:var(--navbar-background-color);
     color:var(--navbar-text-color);
+    box-sizing: border-box;
 }
 .ui-autocomplete {
     max-height:85%;
     max-width:65%;
     overflow-y:auto;
     overflow-x:auto;
-    scrollbar-width: thin;
     white-space:nowrap;
     box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
+    overscroll-behavior: contain;
 }
 ul.ui-autocomplete {
     position:fixed;
@@ -723,6 +727,7 @@ ul.ui-autocomplete li {
     float:left;
     clear:both;
     min-width:100%;
+    box-sizing: border-box;
 }
 ul.ui-autocomplete li.ui-static-link {
     position:sticky;
@@ -747,6 +752,10 @@ li.ui-static-link a, li.ui-static-link a:visited {
 .ui-autocomplete .result-highlight {
     font-weight:bold;
 }
+.ui-menu .ui-menu-item-wrapper {
+    padding-top: 0.4em;
+    padding-bottom: 0.4em;
+}
 #search-input, #page-search-input {
     background-image:url('glass.png');
     background-size:13px;

test/langtools/jdk/javadoc/doclet/checkStylesheetClasses/CheckStylesheetClasses.java

@@ -137,9 +137,9 @@ void run() throws Exception {
         // used in search.js and search-page.js; may be worth documenting in HtmlStyle
         removeAll(styleSheetNames, "result-highlight", "result-item", "anchor-link",
                 "search-tag-desc-result", "search-tag-holder-result", "page-search-header",
-                "ui-autocomplete", "ui-autocomplete-category", "ui-state-active", "expanded",
-                "search-result-link", "two-column-search-results", "ui-static-link",
-                "sort-asc", "sort-desc", "visible");
+                "ui-autocomplete", "ui-autocomplete-category", "ui-state-active", "ui-menu",
+                "ui-menu-item-wrapper", "ui-static-link", "expanded", "search-result-link",
+                "two-column-search-results", "sort-asc", "sort-desc", "visible");
 
         // very JDK specific
         styleSheetNames.remove("module-graph");