Upgrade all packages to eslint 9

Eslint 9 includes some notable changes that are addressed in this commit: - It now gives (auto-fixable) warnings by default about eslint-disable comments that do nothing. - no-unused-vars now errors on an unused error in catch blocks by default. - complexity now flags more problems than it did before, raising our max-warnings of some projects.
Yoast · Dec 13, 2024 · 2072c8e · 2072c8e
1 parent e4b604f
commit 2072c8e
Show file tree

Hide file tree

Showing 130 changed files with 161 additions and 307 deletions.
diff --git a/eslint.config.mjs b/eslint.config.mjs
@@ -24,6 +24,9 @@ export default [
 					exports: "always-multiline",
 				},
 			],
+
+			// Deviate from the Yoast config to allow for not using the error that is caught.
+			"no-unused-vars": [ "error", { caughtErrors: "none" } ],
 		},
 	},
 	{

diff --git a/package.json b/package.json
@@ -55,7 +55,7 @@
     "core-js": "^2.6.12",
     "cross-env": "^7.0.3",
     "dotenv": "^8.2.0",
-    "eslint": "^8.57.0",
+    "eslint": "^9.16.0",
     "eslint-config-yoast": "^6.0.0",
     "globals": "^15.13.0",
     "grunt-git": "^1.0.14",

diff --git a/packages/analysis-report/package.json b/packages/analysis-report/package.json
@@ -36,7 +36,7 @@
     "@yoast/babel-preset": "^1.1.1",
     "@yoast/jest-preset": "^1.0.1",
     "babel-plugin-styled-components": "^2.0.6",
-    "eslint": "^8.57.0",
+    "eslint": "^9.16.0",
     "eslint-config-yoast": "^6.0.0",
     "globals": "^15.13.0",
     "jest": "^27.5.1",

diff --git a/packages/analysis-report/src/AnalysisResult.js b/packages/analysis-report/src/AnalysisResult.js
@@ -1,4 +1,3 @@
-/* eslint-disable complexity */
 import React, { useCallback, useEffect, useState } from "react";
 import PropTypes from "prop-types";
 import styled from "styled-components";

diff --git a/packages/eslint/package.json b/packages/eslint/package.json
@@ -39,6 +39,6 @@
     "eslint": "^8.57 || >= 9"
   },
   "devDependencies": {
-    "eslint": "^9.15.0"
+    "eslint": "^9.16.0"
   }
 }
diff --git a/packages/helpers/package.json b/packages/helpers/package.json
@@ -40,7 +40,7 @@
     "@babel/preset-env": "^7.16.11",
     "@yoast/browserslist-config": "^1.2.3",
     "babel-plugin-styled-components": "^2.0.6",
-    "eslint": "^9.15.0",
+    "eslint": "^9.16.0",
     "eslint-config-yoast": "^6.0.0",
     "globals": "^15.12.0",
     "jest-styled-components": "^7.0.3",

diff --git a/packages/js/eslint.config.mjs b/packages/js/eslint.config.mjs
@@ -60,6 +60,10 @@ export default [
 					exports: "always-multiline",
 				},
 			],
+
+			// Deviate from the Yoast config to allow for not using the error that is caught.
+			"no-unused-vars": [ "error", { caughtErrors: "none" } ],
+
 			// Deviate from the Yoast config to allow longer template literals.
 			"stylistic/max-len": [
 				"error",

diff --git a/packages/js/package.json b/packages/js/package.json
@@ -6,7 +6,7 @@
   "scripts": {
     "build": "cd ../.. && wp-scripts build --config config/webpack/webpack.config.js",
     "test": "jest",
-    "lint": "eslint . --max-warnings=51"
+    "lint": "eslint . --max-warnings=64"
   },
   "dependencies": {
     "@draft-js-plugins/mention": "^5.0.0",
@@ -83,7 +83,7 @@
     "@yoast/jest-preset": "^1.0.0",
     "babel-plugin-styled-components": "^2.0.6",
     "case-sensitive-paths-webpack-plugin": "^2.1.2",
-    "eslint": "^8.57.0",
+    "eslint": "^9.16.0",
     "eslint-config-yoast": "^6.0.0",
     "globals": "^15.13.0",
     "jest": "^27.5.1",

diff --git a/packages/js/src/academy/app.js b/packages/js/src/academy/app.js
@@ -1,4 +1,4 @@
-/* eslint-disable complexity */
+
 import { ExternalLinkIcon, LockOpenIcon } from "@heroicons/react/outline";
 import { ArrowSmRightIcon } from "@heroicons/react/solid";
 import { useMemo } from "@wordpress/element";

diff --git a/packages/js/src/ai-assessment-fixes/components/modal-content.js b/packages/js/src/ai-assessment-fixes/components/modal-content.js
@@ -1,4 +1,4 @@
-/* eslint-disable complexity */
+
 import { useDispatch, useSelect } from "@wordpress/data";
 import { useMemo } from "@wordpress/element";
 import { AiFixAssessmentsUpsell } from "../../shared-admin/components";

diff --git a/packages/js/src/block-editor.js b/packages/js/src/block-editor.js
@@ -1,8 +1,8 @@
-/* eslint-disable no-unused-vars */
+
 import initBlockEditorIntegration from "./initializers/block-editor-integration";
 import BlockEditorData from "./analysis/blockEditorData";
 
 window.yoast = window.yoast || {};
 window.yoast.initEditorIntegration = initBlockEditorIntegration;
 window.yoast.EditorData = BlockEditorData;
-/* eslint-enable no-unused-vars */
+
diff --git a/packages/js/src/bulk-editor.js b/packages/js/src/bulk-editor.js
@@ -70,7 +70,7 @@ import jQuery from "jquery";
 
 				var data = {
 					action: saveAllMethod,
-					// eslint-disable-next-line
+
 					_ajax_nonce: wpseoBulkEditorNonce,
 				};
 
@@ -170,7 +170,7 @@ import jQuery from "jquery";
 
 		return instance;
 	};
-	// eslint-disable-next-line
+
 	window.bulk_editor = bulkEditor;
 	window.bulkEditor = bulkEditor;
 

diff --git a/packages/js/src/classic-editor.js b/packages/js/src/classic-editor.js
@@ -1,8 +1,8 @@
-/* eslint-disable no-unused-vars */
+
 import initClassicEditorIntegration from "./initializers/classic-editor-integration";
 import ClassicEditorData from "./analysis/classicEditorData";
 
 window.yoast = window.yoast || {};
 window.yoast.initEditorIntegration = initClassicEditorIntegration;
 window.yoast.EditorData = ClassicEditorData;
-/* eslint-enable no-unused-vars */
+
diff --git a/packages/js/src/components/PluginIcon.js b/packages/js/src/components/PluginIcon.js
@@ -24,7 +24,6 @@ const PluginIconSVG = styled.svg`
  * @returns {wp.Element} The component.
  */
 const PluginIcon = function( props ) {
-	/* eslint-disable max-len */
 	return <PluginIconSVG { ...props } xmlns="http://www.w3.org/2000/svg" viewBox="0 0 646.66 456.27">
 		<path
 			d="M73,405.26a68.53,68.53,0,0,1-12.82-4c-1-.42-2-.89-3-1.37-1.49-.72-3-1.56-4.77-2.56-1.5-.88-2.71-1.64-3.83-2.39-.9-.61-1.8-1.26-2.68-1.92q-2.64-2-5.08-4.19a68.26,68.26,0,0,1-8.4-9.17c-.92-1.2-1.68-2.25-2.35-3.24q-1.84-2.73-3.44-5.64a68.26,68.26,0,0,1-8.29-32.55V142.13a68.29,68.29,0,0,1,8.29-32.55,58.6,58.6,0,0,1,3.44-5.64,57.53,57.53,0,0,1,4-5.27A69.64,69.64,0,0,1,48.56,85.42,56.06,56.06,0,0,1,54.2,82,67.78,67.78,0,0,1,73,75.09,69.79,69.79,0,0,1,86.75,73.7H256.41L263,55.39H86.75A86.84,86.84,0,0,0,0,142.13V338.22A86.83,86.83,0,0,0,86.75,425H98.07V406.65H86.75A68.31,68.31,0,0,1,73,405.26ZM368.55,60.85l-1.41-.53L360.73,77.5l1.41.53a68.58,68.58,0,0,1,8.66,4,58.65,58.65,0,0,1,5.65,3.43A69.49,69.49,0,0,1,391,98.67c1.4,1.68,2.72,3.46,3.95,5.27s2.39,3.72,3.44,5.64a68.32,68.32,0,0,1,8.29,32.55V406.65H233.55l-.44.76c-3.07,5.37-6.26,10.48-9.49,15.19L222,425H425V142.13A87.19,87.19,0,0,0,368.55,60.85Z"
@@ -55,7 +54,6 @@ const PluginIcon = function( props ) {
 			strokeWidth="0.72"
 		/>
 	</PluginIconSVG>;
-	/* eslint-enable max-len */
 };
 
 PluginIcon.propTypes = {

diff --git a/packages/js/src/components/contentAnalysis/InclusiveLanguageAnalysis.js b/packages/js/src/components/contentAnalysis/InclusiveLanguageAnalysis.js
@@ -232,7 +232,7 @@ const InclusiveLanguageAnalysis = ( props ) => {
 InclusiveLanguageAnalysis.propTypes = {
 	results: PropTypes.array,
 	// `marksButtonStatus` is used, but not recognized by ESLint.
-	// eslint-disable-next-line react/no-unused-prop-types
+
 	marksButtonStatus: PropTypes.oneOf( [ "enabled", "disabled", "hidden" ] ).isRequired,
 	overallScore: PropTypes.number,
 	shouldUpsellHighlighting: PropTypes.bool,

diff --git a/packages/js/src/components/contentAnalysis/mapResults.js b/packages/js/src/components/contentAnalysis/mapResults.js
@@ -94,7 +94,7 @@ function processResult( mappedResult, mappedResults ) {
  *
  * @returns {Object} The icon and color for the score.
  */
-export function getIconForScore( score ) { // eslint-disable-line complexity
+export function getIconForScore( score ) {
 	switch ( score ) {
 		case "loading":
 			return { icon: "loading-spinner", color: colors.$color_green_medium_light };

diff --git a/packages/js/src/containers/PluginIcon.js b/packages/js/src/containers/PluginIcon.js
@@ -11,7 +11,7 @@ export default compose( [
 		const readabilityScoreIndicator = getIndicatorForScore( data.getReadabilityResults().overallScore );
 		const { isKeywordAnalysisActive, isContentAnalysisActive } = data.getPreferences();
 
-		/* eslint-disable-next-line no-unused-vars */
+
 		let readabilityScoreColor;
 		switch ( readabilityScoreIndicator.className ) {
 			case "good":
@@ -26,7 +26,7 @@ export default compose( [
 				break;
 		}
 
-		/* eslint-disable-next-line no-unused-vars */
+
 		let seoScoreColor;
 		switch ( seoScoreIndicator.className ) {
 			case "good":

diff --git a/packages/js/src/elementor/containers/ElementorFill.js b/packages/js/src/elementor/containers/ElementorFill.js
@@ -2,7 +2,7 @@ import { compose } from "@wordpress/compose";
 import { withDispatch, withSelect } from "@wordpress/data";
 import ElementorFill from "../components/fills/ElementorFill";
 
-/* eslint-disable complexity */
+
 export default compose( [
 	withSelect( select => {
 		const {
@@ -23,4 +23,4 @@ export default compose( [
 		};
 	} ),
 ] )( ElementorFill );
-/* eslint-enable complexity */
+
diff --git a/packages/js/src/filter-explanation.js b/packages/js/src/filter-explanation.js
@@ -1,8 +1,8 @@
 /* global yoastFilterExplanation */
-/* eslint-disable max-len */
+
 ( function( $ ) {
 	$( "#posts-filter .tablenav.top" ).after(
 		`<div class="notice notice-info inline wpseo-filter-explanation"><p class="dashicons-before dashicons-lightbulb">${ yoastFilterExplanation.text }</p></div>`
 	);
 }( jQuery ) );
-/* eslint-enable max-len */
+
diff --git a/packages/js/src/first-time-configuration/first-time-configuration-steps.js b/packages/js/src/first-time-configuration/first-time-configuration-steps.js
@@ -150,7 +150,6 @@ function calculateInitialState( windowObject, isStepFinished ) {
 	};
 }
 
-/* eslint-enable max-len, react/prop-types */
 
 /* eslint-disable max-statements */
 /**
@@ -401,7 +400,7 @@ export default function FirstTimeConfigurationSteps() {
 		setShowEditButton( stepperFinishedOnce && ! isStepBeingEdited );
 	}, [ stepperFinishedOnce, isStepBeingEdited ] );
 
-	/* eslint-disable max-len */
+
 	useEffect( () => {
 		/**
 		 * Prevents the submission of the form upon pressing enter.
@@ -586,7 +585,7 @@ export default function FirstTimeConfigurationSteps() {
 	);
 }
 
-/* eslint-enable max-len */
+
 /* eslint-enable complexity */
 /* eslint-enable react/jsx-no-bind */
 /* eslint-enable max-statements */
diff --git a/packages/js/src/first-time-configuration/tailwind-components/base/radio-group.js b/packages/js/src/first-time-configuration/tailwind-components/base/radio-group.js
@@ -1,4 +1,4 @@
-/* eslint-disable no-undefined */
+
 import classNames from "classnames";
 import PropTypes from "prop-types";
 import { useCallback } from "@wordpress/element";

diff --git a/packages/js/src/first-time-configuration/tailwind-components/step-circle.js b/packages/js/src/first-time-configuration/tailwind-components/step-circle.js
@@ -3,7 +3,7 @@ import { useState, useEffect } from "@wordpress/element";
 import PropTypes from "prop-types";
 import { stepperTimingClasses } from "../stepper-helper";
 import { useStepperContext } from "./stepper";
-/* eslint-disable complexity */
+
 
 const { slideDuration, delayUntilStepFaded } = stepperTimingClasses;
 const commonCircleClasses = `yst-transition-opacity ${ slideDuration } yst-absolute yst-inset-0 yst-border-2 yst-flex yst-items-center yst-justify-center yst-rounded-full`;

diff --git a/packages/js/src/first-time-configuration/tailwind-components/step-header.js b/packages/js/src/first-time-configuration/tailwind-components/step-header.js
@@ -4,7 +4,6 @@ import { useEffect, useState } from "@wordpress/element";
 import { stepperTimings } from "../stepper-helper";
 import { useStepperContext } from "./stepper";
 
-/* eslint-disable complexity */
 
 /**
  * Gets the classnames for the step name.
@@ -22,7 +21,7 @@ function getNameClassNames( isFinished, isActiveStep, isLastStep ) {
 	return isFinished ? "yst-text-slate-900" : "yst-text-slate-600";
 }
 
-/* eslint-disable complexity */
+
 /**
  * The Step header component.
  *
@@ -87,4 +86,4 @@ StepHeader.defaultProps = {
 	children: [],
 };
 
-/* eslint-enable complexity */
+
diff --git a/packages/js/src/first-time-configuration/tailwind-components/stepper.js b/packages/js/src/first-time-configuration/tailwind-components/stepper.js
@@ -7,7 +7,7 @@ import { stepperTimings, stepperTimingClasses } from "../stepper-helper";
 import StepHeader from "./step-header";
 import { FadeInAlert } from "../tailwind-components/base/alert";
 
-/* eslint-disable complexity */
+
 const {
 	slideDuration,
 	delayBeforeOpening,
@@ -274,4 +274,4 @@ Step.Error = StepError;
 Step.Header = StepHeader;
 Step.GoButton = GoButton;
 Step.EditButton = EditButton;
-/* eslint-enable complexity */
+
diff --git a/...irst-time-configuration/tailwind-components/steps/social-profiles/social-input-section.js b/...irst-time-configuration/tailwind-components/steps/social-profiles/social-input-section.js
@@ -5,7 +5,7 @@ import PropTypes from "prop-types";
 import SocialFieldArray from "./social-field-array";
 import SocialInput from "./social-input";
 
-/* eslint-disable complexity */
+
 /**
  * A wrapper that combines all the SocialInputs. Intended for use in the first time configuration.
  *
@@ -54,7 +54,7 @@ export default function SocialInputSectionContainer( { socialProfiles, errorFiel
 		/>
 	);
 }
-/* eslint-enable complexity */
+
 
 SocialInputSectionContainer.propTypes = {
 	socialProfiles: PropTypes.object.isRequired,

diff --git a/...irst-time-configuration/tailwind-components/steps/social-profiles/social-profiles-step.js b/...irst-time-configuration/tailwind-components/steps/social-profiles/social-profiles-step.js
@@ -4,7 +4,7 @@ import PropTypes from "prop-types";
 import SocialInputSection from "./social-input-section";
 import Alert from "../../base/alert";
 
-/* eslint-disable max-len, react/prop-types */
+
 /**
  * Social profiles step component
  *

diff --git a/packages/js/src/general/app.js b/packages/js/src/general/app.js
@@ -1,4 +1,4 @@
-/* eslint-disable complexity */
+
 
 import { Transition } from "@headlessui/react";
 import { AdjustmentsIcon, BellIcon, ChartPieIcon } from "@heroicons/react/outline";

diff --git a/packages/js/src/help-scout-beacon.js b/packages/js/src/help-scout-beacon.js
@@ -175,7 +175,6 @@ function loadHelpScoutConsent( beaconId, sessionData = null ) {
 		return (
 			<SvgContainer>
 				<svg xmlns="http://www.w3.org/2000/svg" width="52" height="52">
-					{ /* eslint-disable-next-line max-len */ }
 					<path d="M27.031 32h-2.488v-2.046c0-.635.077-1.21.232-1.72.154-.513.366-.972.639-1.381.272-.41.58-.779.923-1.109.345-.328.694-.652 1.049-.97l.995-.854a6.432 6.432 0 0 0 1.475-1.568c.39-.59.585-1.329.585-2.216 0-.635-.117-1.203-.355-1.703a3.7 3.7 0 0 0-.96-1.263 4.305 4.305 0 0 0-1.401-.783A5.324 5.324 0 0 0 26 16.114c-1.28 0-2.316.375-3.11 1.124-.795.75-1.286 1.705-1.475 2.865L19 19.693c.356-1.772 1.166-3.165 2.434-4.176C22.701 14.507 24.26 14 26.107 14c.947 0 1.842.131 2.682.392.84.262 1.57.648 2.185 1.16a5.652 5.652 0 0 1 1.475 1.892c.368.75.551 1.602.551 2.556 0 .728-.083 1.364-.248 1.909a5.315 5.315 0 0 1-.693 1.467 6.276 6.276 0 0 1-1.048 1.176c-.403.351-.83.71-1.28 1.073-.498.387-.918.738-1.26 1.057a4.698 4.698 0 0 0-.836 1.006 3.847 3.847 0 0 0-.462 1.176c-.095.432-.142.955-.142 1.568V32zM26 37a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3z" fill="#FFF" />
 				</svg>
 			</SvgContainer>
@@ -235,7 +234,6 @@ function loadHelpScoutConsent( beaconId, sessionData = null ) {
 
 			// eslint-disable-next-line no-alert
 			if ( window.confirm( askConsentText ) ) {
-				// eslint-disable-next-line callback-return
 				loadHelpScout( beaconId, sessionData );
 				// eslint-disable-next-line new-cap
 				window.Beacon( "open" );

diff --git a/packages/js/src/initializers/admin.js b/packages/js/src/initializers/admin.js
@@ -216,10 +216,10 @@ export default function initAdmin( jQuery ) {
 
 	window.setWPOption = setWPOption;
 	window.wpseoCopyHomeMeta = wpseoCopyHomeMeta;
-	// eslint-disable-next-line
+
 	window.wpseoSetTabHash = wpseoSetTabHash;
 
-	// eslint-disable-next-line
+
 	jQuery( document ).ready( function() {
 		/**
 		 * When the hash changes, get the base url from the action and then add the current hash.

diff --git a/packages/js/src/integrations-page/helper.js b/packages/js/src/integrations-page/helper.js
@@ -59,7 +59,7 @@ export const getIsFreeIntegrationOrPremiumAvailable = ( integration ) => {
 	return ( integration.isPremium && isPremiumInstalled ) || ! integration.isPremium;
 };
 
-/* eslint-disable complexity */
+
 /**
  * Checks the conditions for which a card is active
  *
@@ -80,7 +80,7 @@ export const getIsCardActive = ( integration, activeState ) => {
 
 	return networkControlEnabled && multisiteAvailable;
 };
-/* eslint-enable complexity */
+
 
 /**
  * Updates an integration state.

diff --git a/packages/js/src/integrations-page/mastodon-integration.js b/packages/js/src/integrations-page/mastodon-integration.js
@@ -4,7 +4,7 @@ import { PropTypes } from "prop-types";
 import { Fragment } from "@wordpress/element";
 import { SimpleIntegration } from "./simple-integration";
 
-/* eslint-disable complexity */
+
 /**
  * Represents the Mastodon integration.
  *
@@ -38,7 +38,7 @@ export const MastodonIntegration = ( { integration, isActive } ) => {
 		</SimpleIntegration>
 	);
 };
-/* eslint-enable complexity */
+
 
 MastodonIntegration.propTypes = {
 	integration: PropTypes.shape( {
-Original file line number
+Diff line change
@@ Expand Up / @@ -24,6 +24,9 @@ export default [ @@
     					exports: "always-multiline",
     				},
     			],
+    			// Deviate from the Yoast config to allow for not using the error that is caught.
+    			"no-unused-vars": [ "error", { caughtErrors: "none" } ],
     		},
     	},
     	{
@@ Expand Down @@