Merge branch 'add-search-keyboard-shortcut' into new-search-bar-compo…

…nent
janfaracik · Jul 21, 2022 · 1f5c74e · 1f5c74e
2 parents 9878cac + 6f7a259
commit 1f5c74e
Show file tree

Hide file tree

Showing 14 changed files with 11,310 additions and 7,917 deletions.
diff --git a/.gitattributes b/.gitattributes
@@ -38,3 +38,7 @@
 *.png           binary
 *.war           binary
 *.zip           binary
+
+# Yarn
+# https://yarnpkg.com/getting-started/qa#which-files-should-be-gitignored
+/war/.yarn/plugins/** binary
diff --git a/.github/dependabot.yml b/.github/dependabot.yml
@@ -59,16 +59,3 @@ updates:
       # Contains incompatible API changes and needs compatibility work. See:
       # https://github.com/jenkinsci/jenkins/pull/4224
       - dependency-name: "org.jfree:jfreechart"
-  - package-ecosystem: "npm"
-    directory: "/war"
-    schedule:
-      interval: "daily"
-    reviewers:
-      - jenkinsci/sig-ux
-    ignore:
-      # Handlebars (*.hbs) require a few tweaks in order to comply with 4.x' standards:
-      # https://issues.jenkins.io/browse/JENKINS-68926
-      - dependency-name: "handlebars"
-
-      # A test case needs an update: https://issues.jenkins.io/browse/JENKINS-68975
-      - dependency-name: "jest"
diff --git a/core/src/main/resources/lib/layout/layout.jelly b/core/src/main/resources/lib/layout/layout.jelly
@@ -100,8 +100,8 @@ THE SOFTWARE.
 <x:doctype name="html" />
 <html>
   <head data-rooturl="${rootURL}" data-resurl="${resURL}" data-imagesurl="${imagesURL}" resURL="${resURL}"
-        data-extensions-available="${extensionsAvailable}" 
-        data-crumb-header="${h.getCrumbRequestField()}" data-crumb-value="${h.getCrumb(request)}" 
+        data-extensions-available="${extensionsAvailable}"
+        data-crumb-header="${h.getCrumbRequestField()}" data-crumb-value="${h.getCrumb(request)}"
         data-unit-test="${h.isUnitTest}">
     ${h.checkPermission(it,permission)}
     ${h.checkAnyPermission(it, permissions)}
@@ -236,6 +236,8 @@ THE SOFTWARE.
       </div>
     </footer>
     </j:if>
+
+    <script src="${resURL}/jsbundles/keyboard-shortcuts.js" type="text/javascript"/>
   </body>
 </html>
 </l:view>

diff --git a/renovate.json b/renovate.json
@@ -0,0 +1,32 @@
+{
+  "extends": [
+    "config:base",
+    ":disableDependencyDashboard",
+    ":semanticCommitsDisabled"
+  ],
+  "enabledManagers": [
+    "npm"
+  ],
+  "packageRules": [
+    {
+      "matchDatasources": ["npm"],
+      "addLabels": ["javascript"],
+      "stabilityDays": 3,
+      "reviewers": ["team:sig-ux"]
+    },
+    {
+      "matchPackageNames": ["handlebars"],
+      "allowedVersions": "<=3.0.8",
+      "description": "https://issues.jenkins.io/browse/JENKINS-68926",
+      "enabled": false
+    },
+    {
+      "matchPackageNames": ["jest"],
+      "allowedVersions": "<=26.0.1",
+      "description": "https://issues.jenkins.io/browse/JENKINS-68975",
+      "enabled": false
+    }
+  ],
+  "labels": ["dependencies"],
+  "rebaseWhen": "conflicted"
+}
diff --git a/test/pom.xml b/test/pom.xml
@@ -168,7 +168,7 @@ THE SOFTWARE.
     <dependency>
       <groupId>org.jenkins-ci.plugins</groupId>
       <artifactId>mailer</artifactId>
-      <version>414.vcc4c33714601</version>
+      <version>438.v02c7f0a_12fa_4</version>
       <scope>test</scope>
     </dependency>
     <dependency>

diff --git a/test/src/test/java/hudson/util/BootFailureTest.java b/test/src/test/java/hudson/util/BootFailureTest.java
@@ -19,7 +19,6 @@
 import javax.servlet.ServletContext;
 import javax.servlet.ServletContextEvent;
 import jenkins.model.Jenkins;
-import org.eclipse.jetty.util.component.AbstractLifeCycle;
 import org.junit.After;
 import org.junit.Rule;
 import org.junit.Test;
@@ -73,11 +72,11 @@ public WebAppMain.FileAndDescription getHomeDir(ServletContextEvent event) {
                 assertNotNull(noListenerConfiguration);
                 if (noListenerConfiguration != null) {
                     context.removeBean(noListenerConfiguration);
-                    context.addBean(new AbstractLifeCycle() {
+                    context.addBean(new NoListenerConfiguration(context) {
                         @Override
                         protected void doStart() {
                             // default behavior of noListenerConfiguration
-                            context.setEventListeners(null);
+                            super.doStart();
                             // ensuring our custom context will received the contextInitialized event
                             context.addEventListener(wa);
                         }

diff --git a/war/.gitignore b/war/.gitignore
@@ -2,6 +2,15 @@ work
 /rebel.xml
 junit.xml
 
+# Yarn
+# https://yarnpkg.com/getting-started/qa#which-files-should-be-gitignored
+.pnp.*
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/sdks
+!.yarn/versions
+
 # Node
 node/
 node_modules/

diff --git a/war/.yarnrc.yml b/war/.yarnrc.yml
@@ -0,0 +1,8 @@
+# Defines what linker should be used for installing Node packages (useful to
+# enable the node-modules plugin), one of: pnp, pnpm and node-modules.
+nodeLinker: node-modules
+
+# The yarnPath setting is currently the preferred way to install Yarn within a
+# project, as it ensures that your whole team will use the exact same Yarn
+# version, without having to individually keep it up-to-date.
+yarnPath: .yarn/releases/yarn-3.2.0.cjs
diff --git a/war/package.json b/war/package.json
@@ -21,44 +21,45 @@
     "lint": "yarn lint:js && yarn lint:css"
   },
   "devDependencies": {
-    "@babel/cli": "^7.18.9",
-    "@babel/core": "^7.18.9",
-    "@jenkins-cd/js-test": "^1.2.3",
-    "autoprefixer": "^10.4.7",
-    "clean-webpack-plugin": "^4.0.0",
-    "copy-webpack-plugin": "^11.0.0",
-    "css-loader": "^6.7.1",
-    "css-minimizer-webpack-plugin": "^4.0.0",
-    "eslint": "^8.20.0",
+    "@babel/cli": "7.18.9",
+    "@babel/core": "7.18.9",
+    "@jenkins-cd/js-test": "1.2.3",
+    "autoprefixer": "10.4.7",
+    "clean-webpack-plugin": "4.0.0",
+    "copy-webpack-plugin": "11.0.0",
+    "css-loader": "6.7.1",
+    "css-minimizer-webpack-plugin": "4.0.0",
+    "eslint": "8.20.0",
     "handlebars": "^3.0.8",
-    "handlebars-loader": "^1.7.2",
+    "handlebars-loader": "1.7.2",
     "jest": "^26.0.1",
-    "jest-handlebars": "^1.0.1",
-    "jest-junit": "^14.0.0",
-    "jest-standard-reporter": "^2.0.0",
-    "less": "^4.1.3",
-    "less-loader": "^11.0.0",
-    "mini-css-extract-plugin": "^2.6.1",
-    "postcss": "^8.4.14",
-    "postcss-loader": "^7.0.1",
-    "style-loader": "^3.3.1",
-    "stylelint": "^14.9.1",
-    "stylelint-config-standard": "^26.0.0",
-    "webpack": "^5.73.0",
-    "webpack-cli": "^4.10.0",
-    "webpack-remove-empty-scripts": "^0.8.1"
+    "jest-handlebars": "1.0.1",
+    "jest-junit": "14.0.0",
+    "jest-standard-reporter": "2.0.0",
+    "less": "4.1.3",
+    "less-loader": "11.0.0",
+    "mini-css-extract-plugin": "2.6.1",
+    "postcss": "8.4.14",
+    "postcss-loader": "7.0.1",
+    "style-loader": "3.3.1",
+    "stylelint": "14.9.1",
+    "stylelint-config-standard": "26.0.0",
+    "webpack": "5.73.0",
+    "webpack-cli": "4.10.0",
+    "webpack-remove-empty-scripts": "0.8.1"
   },
   "dependencies": {
-    "@babel/preset-env": "^7.18.9",
-    "babel-loader": "^8.2.5",
+    "@babel/preset-env": "7.18.9",
+    "babel-loader": "8.2.5",
     "bootstrap": "3.4.1",
-    "jenkins-js-modules": "^1.5.0",
+    "hotkeys-js": "^3.9.4",
+    "jenkins-js-modules": "1.5.4",
     "jquery": "3.6.0",
-    "lodash": "^4.17.21",
-    "postcss-less": "^6.0.0",
-    "sortablejs": "^1.15.0",
-    "stylelint-checkstyle-reporter": "^0.2.0",
-    "window-handle": "^1.0.0"
+    "lodash": "4.17.21",
+    "postcss-less": "6.0.0",
+    "sortablejs": "1.15.0",
+    "stylelint-checkstyle-reporter": "0.2.0",
+    "window-handle": "1.0.1"
   },
   "browserslist": [
     "defaults",

diff --git a/war/pom.xml b/war/pom.xml
@@ -47,7 +47,11 @@ THE SOFTWARE.
     <!-- HTTP listener port -->
     <port>8080</port>
     <node.version>16.15.1</node.version>
+    <!-- frontend-maven-plugin will install this Yarn version as bootstrap, then hand over control to Yarn Berry. -->
     <yarn.version>1.22.19</yarn.version>
+    <!-- maven-antrun-plugin will download this Yarn version. -->
+    <yarn-berry.version>3.2.0</yarn-berry.version>
+    <yarn-berry.sha256sum>99a7f42f678b8ccd9c8e97a9e65fe7a5043033dd0e074e6d1f13fbe2d5ff2734</yarn-berry.sha256sum>
   </properties>
 
   <dependencyManagement>
@@ -696,6 +700,32 @@ THE SOFTWARE.
               </execution>
             </executions>
           </plugin>
+          <plugin>
+            <groupId>org.apache.maven.plugins</groupId>
+            <artifactId>maven-antrun-plugin</artifactId>
+            <executions>
+              <execution>
+                <id>download-yarn</id>
+                <goals>
+                  <goal>run</goal>
+                </goals>
+                <phase>initialize</phase>
+                <configuration>
+                  <tasks>
+                    <property name="yarn.dest" value="${project.basedir}/.yarn/releases/yarn-${yarn-berry.version}.cjs" />
+                    <dirname file="${yarn.dest}" property="yarn.dest.dir" />
+                    <mkdir dir="${yarn.dest.dir}" />
+                    <get dest="${yarn.dest}" src="https://repo.yarnpkg.com/${yarn-berry.version}/packages/yarnpkg-cli/bin/yarn.js" usetimestamp="true" />
+                    <checksum algorithm="SHA-256" file="${yarn.dest}" property="${yarn-berry.sha256sum}" verifyProperty="yarn.checksum.matches" />
+                    <condition property="yarn.checksum.matches.fail">
+                      <equals arg1="${yarn.checksum.matches}" arg2="false" />
+                    </condition>
+                    <fail if="yarn.checksum.matches.fail">Checksum error</fail>
+                  </tasks>
+                </configuration>
+              </execution>
+            </executions>
+          </plugin>
           <plugin>
             <groupId>com.github.eirslett</groupId>
             <artifactId>frontend-maven-plugin</artifactId>
@@ -722,11 +752,6 @@ THE SOFTWARE.
                   <goal>yarn</goal>
                 </goals>
                 <phase>initialize</phase>
-                <configuration>
-                  <!-- ensure only one concurrent 'yarn install' -->
-                  <!-- when yarn cache is empty, multiple yarns performing network fetches frequently results in opaque errors -->
-                  <arguments>--mutex network</arguments>
-                </configuration>
               </execution>
 
               <execution>

diff --git a/war/src/main/js/keyboard-shortcuts.js b/war/src/main/js/keyboard-shortcuts.js
@@ -0,0 +1,26 @@
+import hotkeys from "hotkeys-js"
+
+window.addEventListener("load", () => {
+  const searchBar = document.querySelector("#search-box")
+  searchBar.placeholder = searchBar.placeholder + ` (${translateModifierKeysForUsersPlatform("CMD+K")
+    .replace("CMD", "⌘")})`
+
+  hotkeys(translateModifierKeysForUsersPlatform("CMD+K"), () => {
+    searchBar.focus()
+
+    // Returning false stops the event and prevents default browser events
+    return false
+  })
+})
+
+/**
+ * Given a keyboard shortcut, e.g. CMD+K, replace any included modifier keys for the user's
+ * platform e.g. output will be CMD+K for macOS/iOS, CTRL+K for Windows/Linux
+ * @param {string} keyboardShortcut The shortcut to translate
+ */
+function translateModifierKeysForUsersPlatform(keyboardShortcut) {
+  const useCmdKey = navigator.platform.toUpperCase().indexOf("MAC") >= 0 ||
+    navigator.platform.toUpperCase() === "IPHONE" ||
+    navigator.platform.toUpperCase() === "IPAD"
+  return keyboardShortcut.replaceAll(/CMD|CTRL/ig, useCmdKey ? "CMD" : "CTRL")
+}
diff --git a/war/src/main/webapp/scripts/yui/connection/connection.swf b/war/src/main/webapp/scripts/yui/connection/connection.swf
diff --git a/war/webpack.config.js b/war/webpack.config.js
@@ -30,6 +30,7 @@ module.exports = (env, argv) => ({
       path.join(__dirname, "src/main/js/config-tabbar.js"),
       path.join(__dirname, "src/main/js/config-tabbar.less"),
     ],
+    "keyboard-shortcuts": [path.join(__dirname, "src/main/js/keyboard-shortcuts.js")],
     "sortable-drag-drop": [path.join(__dirname, "src/main/js/sortable-drag-drop.js")],
     "section-to-sidebar-items": [path.join(__dirname, "src/main/js/section-to-sidebar-items.js")],
     "section-to-tabs": [path.join(__dirname, "src/main/js/section-to-tabs.js")],