Merge pull request #1943 from OpenConext/feature/update-js

johanib · web-flow · commit 6c73477c2232 · 2026-03-17T11:00:09.000+01:00
fix(theme): replace jshint with eslint to resolve minimatch vulnerability
diff --git a/theme/.jshintrc b/theme/.jshintrc
diff --git a/theme/base/javascripts/consent/addTooltipAndModalAriaHandlers.js b/theme/base/javascripts/consent/addTooltipAndModalAriaHandlers.js
@@ -15,7 +15,7 @@ export const addTooltipAndModalAriaHandlers = (elementSelectors
     const forValue = element.getAttribute('for');
     const alert = document.querySelector(`[data-for="${forValue}"]`);
 
-    if (!!alert) {
+    if (alert) {
       element.addEventListener('click', () => {
         changeAriaHiddenValue(alert);
       });
diff --git a/theme/base/javascripts/consent/keyboardBehaviour.js b/theme/base/javascripts/consent/keyboardBehaviour.js
@@ -38,10 +38,11 @@ export const consentKeyboardBehaviour = () => {
       case TAB:
         classList.forEach(className => {
           switch (className) {
-            case 'tooltip__value':
+            case 'tooltip__value': {
               const dataFor = getData(e.target, 'for');
               document.querySelector(`[for=${dataFor}]`).focus();
               break;
+            }
           }
         });
         break;
diff --git a/theme/base/javascripts/consent/switchConsentSection.js b/theme/base/javascripts/consent/switchConsentSection.js
@@ -5,7 +5,7 @@ export const switchConsentSection = (e) => {
   const nokSection = document.querySelector(nokSectionSelector);
   const contentSection = document.querySelector(contentSectionSelector);
 
-  if (!!e) {
+  if (e) {
     e.preventDefault();
   }
 
diff --git a/theme/base/javascripts/handlers.js b/theme/base/javascripts/handlers.js
@@ -49,7 +49,7 @@ export const addAccessibilitySupport = () => {
 };
 
 export const consentNokHandler = (e) => {
-  if (!!e) {
+  if (e) {
     e.preventDefault();
   }
   const nokSection = document.querySelector(nokSectionSelector);
@@ -61,7 +61,7 @@ export const consentNokHandler = (e) => {
 };
 export const backButtonHandler = () => {
   return (e) => {
-    if (!!e) {
+    if (e) {
       e.preventDefault();
     }
     const nokSection = document.querySelector(nokSectionSelector);
diff --git a/theme/base/javascripts/wayf/deleteDisable/deleteIdp.js b/theme/base/javascripts/wayf/deleteDisable/deleteIdp.js
@@ -53,7 +53,7 @@ function announceDeletedIdp(title) {
 function moveFocus(index) {
   const nextAccount = document.querySelector(`${selectedIdpsLiSelector}[data-index="${(index + 1)}"] ${idpDeleteDisabledSelector}`);
 
-  if (!!nextAccount) {
+  if (nextAccount) {
     nextAccount.focus();
     return;
   }
diff --git a/theme/base/javascripts/wayf/idpFocus/checkHover.js b/theme/base/javascripts/wayf/idpFocus/checkHover.js
@@ -10,7 +10,7 @@ import {isHoverOnArrowItem} from './isHoverOnArrowItem';
 export function checkHover(e) {
   const focusedElement = document.activeElement;
 
-  if (!!focusedElement) {
+  if (focusedElement) {
     const focusOnArrowItem = isFocusOnArrowItem(focusedElement);
     if (focusOnArrowItem) {
       return false;
diff --git a/theme/base/javascripts/wayf/idpFocus/focusOnNextIdp.js b/theme/base/javascripts/wayf/idpFocus/focusOnNextIdp.js
@@ -8,7 +8,7 @@ export const focusOnNextIdp = () => {
     nextSibling = nextSibling.nextElementSibling;
   }
 
-  if (!!nextSibling) {
+  if (nextSibling) {
     focusAndSmoothScroll(nextSibling.firstElementChild);
   }
 };
diff --git a/theme/base/javascripts/wayf/idpFocus/focusOnPreviousIdp.js b/theme/base/javascripts/wayf/idpFocus/focusOnPreviousIdp.js
@@ -8,7 +8,7 @@ export const focusOnPreviousIdp = () => {
     previousSibling = previousSibling.previousElementSibling;
   }
 
-  if (!!previousSibling) {
+  if (previousSibling) {
     focusAndSmoothScroll(previousSibling.firstElementChild);
   }
 };
diff --git a/theme/base/javascripts/wayf/idpFocus/isHoverOnArrowItem.js b/theme/base/javascripts/wayf/idpFocus/isHoverOnArrowItem.js
@@ -19,7 +19,7 @@ export const isHoverOnArrowItem = (element) => {
     }
 
     const closestElement = element.closest(`.${className}`);
-    if (!!closestElement) {
+    if (closestElement) {
       return closestElement;
     }
   }
diff --git a/theme/base/javascripts/wayf/matchPreviouslySelectedWithCookie.js b/theme/base/javascripts/wayf/matchPreviouslySelectedWithCookie.js
@@ -37,12 +37,12 @@ export const matchPreviouslySelectedWithCookie = () => {
           let hasDeleteDisabledButton = null;
 
           // not all Idps are always in the list
-          if (!!original) {
+          if (original) {
             clone = original.parentElement.cloneNode(true);
             hasDeleteDisabledButton = clone.querySelector(idpDeleteDisabledSelector);
           }
 
-          if (!!clone) {
+          if (clone) {
             clone.classList.remove('remaining');
             // disabled idps
             if (hasDeleteDisabledButton) {
diff --git a/theme/base/javascripts/wayf/mouseBehaviour.js b/theme/base/javascripts/wayf/mouseBehaviour.js
@@ -52,7 +52,7 @@ export const mouseBehaviour = () => {
   // handle clicking defaultIdp banner
   const defaultIdpLink = document.querySelector(defaultIdpSelector);
 
-  if (!! defaultIdpLink) {
+  if (defaultIdpLink) {
     defaultIdpLink.addEventListener('click', handleIdpBanner);
   }
 
diff --git a/theme/base/javascripts/wayf/noAccess/attachClickHandlerToRequestButton.js b/theme/base/javascripts/wayf/noAccess/attachClickHandlerToRequestButton.js
@@ -24,7 +24,7 @@ const requestButtonHandler = () => {
 export const attachClickHandlerToRequestButton = (parentSection, noAccess, form) => {
   const requestButton = document.querySelector(showFormSelector);
 
-  if (!!requestButton) {
+  if (requestButton) {
     addClickHandlerOnce(showFormSelector, requestButtonHandler);
 
     // attach clickHandler for form
diff --git a/theme/base/javascripts/wayf/noAccess/validation.js b/theme/base/javascripts/wayf/noAccess/validation.js
@@ -34,14 +34,14 @@ export const valid = (formData) => {
 
   if (!isValid) {
     fieldsWithErrors.sort().reverse();
-    addAnnouncement(fieldsWithErrors);
+    addAnnouncement();
     document.querySelector(`[name="${fieldsWithErrors[0]}"]`).focus();
   }
 
   return isValid;
 };
 
-function addAnnouncement(fieldsWithErrors) {
+function addAnnouncement() {
   const requestFormAnnouncement = document.getElementById(requestFormAnnouncementId);
   requestFormAnnouncement.innerHTML = getData(requestFormAnnouncement, 'announcement');
 }
diff --git a/theme/base/javascripts/wayf/search/hideIdpsWhenCutoffNoSearch.js b/theme/base/javascripts/wayf/search/hideIdpsWhenCutoffNoSearch.js
@@ -6,7 +6,7 @@ import {searchingClass} from '../../selectors';
  * @param list    The ul element for the remaining idps.
  */
 export const hideIdpsWhenCutoffNoSearch = (list) => {
-  if (!!list) {
+  if (list) {
     list.classList.remove(searchingClass);
   }
 };
diff --git a/theme/base/javascripts/wayf/search/removeWeight.js b/theme/base/javascripts/wayf/search/removeWeight.js
@@ -3,7 +3,7 @@ export const removeWeight = (element) => {
     element.removeAttribute('data-weight');
   } catch (e) {
     // We are now in IE11 territory
-    if (!!element) {
+    if (element) {
       element.setAttribute('data-weight', null);
     }
   }
diff --git a/theme/base/javascripts/wayf/search/showFoundIdpsWhenCutoff.js b/theme/base/javascripts/wayf/search/showFoundIdpsWhenCutoff.js
@@ -6,7 +6,7 @@ import {searchingClass} from '../../selectors';
  * @param list    The ul element for the remaining idps.
  */
 export const showFoundIdpsWhenCutoff = (list) => {
-  if (!!list) {
+  if (list) {
     list.classList.add(searchingClass);
   }
 };
diff --git a/theme/base/javascripts/wayf/search/showOrHideNoResultsSection.js b/theme/base/javascripts/wayf/search/showOrHideNoResultsSection.js
@@ -14,6 +14,7 @@ export const showOrHideNoResultsSection = (idpArray) => {
   const noMatches = document.querySelectorAll(noMatchSelector);
   if (noMatches.length === idpArray.length) {
     showElement(noResultsSection);
+    // eslint-disable-next-line no-self-assign -- Forces screen reader re-announcement via DOM mutation
     noResultsSection.innerHTML = noResultsSection.innerHTML;
     searchAnnouncementDiv.innerHTML = '';
   } else {
diff --git a/theme/base/javascripts/wayf/search/toggleDefaultIdPLinkVisibility.js b/theme/base/javascripts/wayf/search/toggleDefaultIdPLinkVisibility.js
@@ -9,7 +9,7 @@ import {defaultIdpInformational} from '../../selectors';
  */
 export const toggleDefaultIdPLinkVisibility = (searchTerm) => {
   const idpLink = document.querySelector(defaultIdpInformational);
-  if (!!idpLink) {
+  if (idpLink) {
     if (searchTerm.length > 0 ) {
       hideElement(idpLink);
     } else {
diff --git a/theme/base/javascripts/wayf/utility/hasVisibleDeleteButtonAsTarget.js b/theme/base/javascripts/wayf/utility/hasVisibleDeleteButtonAsTarget.js
@@ -11,7 +11,7 @@ import {idpDeleteClass, idpDeleteDisabledClass, idpDeleteSelector} from '../../s
 export const hasVisibleDeleteButtonAsTarget = (element) => {
   if (element.classList.contains(idpDeleteDisabledClass)) {
     const idpDelete = element.querySelector(idpDeleteSelector);
-    if (!Boolean(idpDelete)) {
+    if (!idpDelete) {
       return false;
     }
 
diff --git a/theme/base/javascripts/wayf/utility/hasVisibleDisabledButtonAsTarget.js b/theme/base/javascripts/wayf/utility/hasVisibleDisabledButtonAsTarget.js
@@ -14,7 +14,7 @@ export const hasVisibleDisabledButtonAsTarget = (element) => {
   }
 
   const idpDisabled = element.querySelector(idpDisabledSelector);
-  if (!Boolean(idpDisabled)) {
+  if (!idpDisabled) {
     return false;
   }
 
diff --git a/theme/base/javascripts/wayf/utility/sortAndReindex.js b/theme/base/javascripts/wayf/utility/sortAndReindex.js
@@ -17,6 +17,7 @@ const REMAINING = 'remaining';
  * @parameter sortBy  string    the attribute to sort by
  * @parameter focus   boolean   whether or not to focus the first item
  */
+// eslint-disable-next-line no-unused-vars
 export const sortAndReindex = (list = REMAINING, sortBy = 'title', focus = false) => {
   let idpListSelector = remainingIdpListSelector;
 
diff --git a/theme/eslint.config.mjs b/theme/eslint.config.mjs
@@ -0,0 +1,18 @@
+import js from "@eslint/js";
+import globals from "globals";
+
+export default [
+  js.configs.recommended,
+  {
+    files: ["**/javascripts/**/*.js"],
+    languageOptions: {
+      ecmaVersion: 2017,
+      sourceType: "module",
+      globals: globals.browser,
+    },
+    rules: {
+      // Since we stick to ecma2017, we cannot adhere to some modern constructions, for example, empty catch blocks
+      "no-unused-vars": ["error", { "caughtErrors": "none" }],
+    },
+  },
+];
diff --git a/theme/package.json b/theme/package.json
@@ -14,7 +14,7 @@
     "cypress:open": "npx ../tests/e2e/cypress open",
     "audit": "yarn audit",
     "lint": "yarn lint:js && yarn lint:css",
-    "lint:js": "jshint **/javascripts/",
+    "lint:js": "eslint '**/javascripts/**/*.js'",
     "lint:css": "stylelint ${EB_THEME:=openconext}/stylesheets/**/*.*ss",
     "clean": "rimraf ../public/images/* ../public/javascripts/* ../public/stylesheets/* ../public/fonts/*",
     "build": "node scripts/build.js",
@@ -40,13 +40,15 @@
     "@babel/core": "^7.22",
     "@babel/polyfill": "^7.12",
     "@babel/preset-env": "^7.22",
+    "@eslint/js": "^10.0.1",
     "autoprefixer": "^10.4",
     "babelify": "^10.0",
     "browserify": "^17.0",
     "copyfiles": "^2.4",
     "core-js": "^3.32",
     "cssnano": "^7.1.1",
-    "jshint": "^2.13",
+    "eslint": "^10.0.3",
+    "globals": "^17.4.0",
     "postcss-cli": "^11.0.1",
     "postcss-sass": "^0.5",
     "postcss-scss": "^4.0",
diff --git a/theme/yarn.lock b/theme/yarn.lock

Original file line number	Diff line number	Diff line change
`@@ -5,7 +5,7 @@ export const switchConsentSection = (e) => {`
`5`	`5`	`const nokSection = document.querySelector(nokSectionSelector);`
`6`	`6`	`const contentSection = document.querySelector(contentSectionSelector);`
`7`	`7`
`8`		`- if (!!e) {`
	`8`	`+ if (e) {`
`9`	`9`	`e.preventDefault();`
`10`	`10`	`}`
`11`	`11`
Original file line number	Diff line number	Diff line change
`@@ -53,7 +53,7 @@ function announceDeletedIdp(title) {`
`53`	`53`	`function moveFocus(index) {`
`54`	`54`	const nextAccount = document.querySelector(`${selectedIdpsLiSelector}[data-index="${(index + 1)}"] ${idpDeleteDisabledSelector}`);
`55`	`55`
`56`		`- if (!!nextAccount) {`
	`56`	`+ if (nextAccount) {`
`57`	`57`	`nextAccount.focus();`
`58`	`58`	`return;`
`59`	`59`	`}`
Original file line number	Diff line number	Diff line change
`@@ -8,7 +8,7 @@ export const focusOnNextIdp = () => {`
`8`	`8`	`nextSibling = nextSibling.nextElementSibling;`
`9`	`9`	`}`
`10`	`10`
`11`		`- if (!!nextSibling) {`
	`11`	`+ if (nextSibling) {`
`12`	`12`	`focusAndSmoothScroll(nextSibling.firstElementChild);`
`13`	`13`	`}`
`14`	`14`	`};`
Original file line number	Diff line number	Diff line change
`@@ -8,7 +8,7 @@ export const focusOnPreviousIdp = () => {`
`8`	`8`	`previousSibling = previousSibling.previousElementSibling;`
`9`	`9`	`}`
`10`	`10`
`11`		`- if (!!previousSibling) {`
	`11`	`+ if (previousSibling) {`
`12`	`12`	`focusAndSmoothScroll(previousSibling.firstElementChild);`
`13`	`13`	`}`
`14`	`14`	`};`
Original file line number	Diff line number	Diff line change
`@@ -19,7 +19,7 @@ export const isHoverOnArrowItem = (element) => {`
`19`	`19`	`}`
`20`	`20`
`21`	`21`	const closestElement = element.closest(`.${className}`);
`22`		`- if (!!closestElement) {`
	`22`	`+ if (closestElement) {`
`23`	`23`	`return closestElement;`
`24`	`24`	`}`
`25`	`25`	`}`