Plugin Directory: Lint the theme's JavaScript, in CI

.github/workflows/phpcs.yml

@@ -18,6 +18,9 @@ concurrency:
   group: ${{ github.workflow }}-${{ github.ref }}-${{ github.event_name == 'push' && github.sha || '' }}
   cancel-in-progress: true
 
+permissions:
+  contents: read
+
 jobs:
   phpcs:
     name: PHP Coding Standards
@@ -27,6 +30,7 @@ jobs:
     - uses: actions/checkout@v7
       with:
         fetch-depth: 0
+        persist-credentials: false
 
     - name: Set up PHP
       uses: shivammathur/setup-php@v2
@@ -47,4 +51,6 @@ jobs:
       run: composer install --no-interaction --prefer-dist
 
     - name: Lint PHP
-      run: BASE_REF=${{ github.base_ref }} php .github/bin/phpcs-branch.php
+      run: php .github/bin/phpcs-branch.php
+      env:
+        BASE_REF: ${{ github.base_ref }}

.github/workflows/plugins-theme-lint.yml

@@ -0,0 +1,49 @@
+name: Static Analysis (Plugin Directory Theme JS)
+
+on:
+  pull_request:
+    paths:
+    - 'wordpress.org/public_html/wp-content/themes/pub/wporg-plugins-2024/**.js'
+    - 'wordpress.org/public_html/wp-content/themes/pub/wporg-plugins-2024/package.json'
+    - .github/workflows/plugins-theme-lint.yml
+  push:
+    branches: [trunk]
+    paths:
+    - 'wordpress.org/public_html/wp-content/themes/pub/wporg-plugins-2024/**.js'
+    - 'wordpress.org/public_html/wp-content/themes/pub/wporg-plugins-2024/package.json'
+    - .github/workflows/plugins-theme-lint.yml
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.ref }}
+  cancel-in-progress: true
+
+permissions:
+  contents: read
+
+jobs:
+  lint:
+    name: Plugin Directory Theme Coding Standards
+    runs-on: ubuntu-latest
+
+    defaults:
+      run:
+        working-directory: wordpress.org/public_html/wp-content/themes/pub/wporg-plugins-2024
+
+    steps:
+    - uses: actions/checkout@v7
+      with:
+        persist-credentials: false
+
+    - name: Set up Node.js
+      uses: actions/setup-node@v7
+      with:
+        node-version-file: environments/.nvmrc
+        cache: npm
+        cache-dependency-path: wordpress.org/public_html/wp-content/themes/pub/wporg-plugins-2024/package.json
+
+    # The repository ignores package-lock.json, so resolve from package.json.
+    - name: Install dependencies
+      run: npm install --no-package-lock --no-audit --no-fund --ignore-scripts
+
+    - name: Lint JavaScript
+      run: npm run lint:js

.github/workflows/style-lint.yml

@@ -25,6 +25,9 @@ concurrency:
   group: ${{ github.workflow }}-${{ github.ref }}
   cancel-in-progress: true
 
+permissions:
+  contents: read
+
 jobs:
   lint:
     name: Style Coding Standards
@@ -36,6 +39,8 @@ jobs:
 
     steps:
     - uses: actions/checkout@v7
+      with:
+        persist-credentials: false
 
     - name: Set up Node.js
       uses: actions/setup-node@v7
@@ -45,7 +50,7 @@ jobs:
         cache-dependency-path: wordpress.org/public_html/style/package-lock.json
 
     - name: Install dependencies
-      run: npm ci
+      run: npm ci --ignore-scripts
 
     - name: Lint JavaScript
       run: npm run lint:js

wordpress.org/public_html/wp-content/themes/pub/wporg-plugins-2024/build/blocks/plugin-card/view.asset.php

@@ -1 +1 @@
-<?php return array('dependencies' => array(), 'version' => '84dce221de83bef91ccd');
+<?php return array('dependencies' => array(), 'version' => '57b8322b0117c4deb1bf');

wordpress.org/public_html/wp-content/themes/pub/wporg-plugins-2024/eslint.config.js

@@ -0,0 +1,18 @@
+/**
+ * ESLint configuration for the Plugin Directory theme.
+ */
+
+const defaultConfig = require( '@wordpress/scripts/config/eslint.config.cjs' );
+
+module.exports = [
+	{
+		ignores: [ '*.js' ],
+	},
+	...defaultConfig,
+	{
+		rules: {
+			// WordPress packages are provided at runtime as script dependencies.
+			'import/no-unresolved': [ 'error', { ignore: [ '^@wordpress/' ] } ],
+		},
+	},
+];

wordpress.org/public_html/wp-content/themes/pub/wporg-plugins-2024/functions.php

@@ -99,11 +99,11 @@ function scripts() {
 	wp_scripts()->add_data( 'jquery-core', 'group', 1 );
 	wp_scripts()->add_data( 'jquery-migrate', 'group', 1 );
 
-	wp_enqueue_script( 'wporg-navigation', get_stylesheet_directory_uri() . '/js/navigation.js', array(), '20181209', true );
-	wp_enqueue_script( 'wporg-skip-link-focus-fix', get_stylesheet_directory_uri() . '/js/skip-link-focus-fix.js', array(), '20151215', true );
+	wp_enqueue_script( 'wporg-navigation', get_stylesheet_directory_uri() . '/js/navigation.js', array(), filemtime( __DIR__ . '/js/navigation.js' ), true );
+	wp_enqueue_script( 'wporg-skip-link-focus-fix', get_stylesheet_directory_uri() . '/js/skip-link-focus-fix.js', array(), filemtime( __DIR__ . '/js/skip-link-focus-fix.js' ), true );
 
 	if ( is_singular( 'plugin' ) ) {
-		wp_enqueue_script( 'wporg-plugins-popover', get_stylesheet_directory_uri() . '/js/popover.js', array( 'jquery' ), '20171002', true );
+		wp_enqueue_script( 'wporg-plugins-popover', get_stylesheet_directory_uri() . '/js/popover.js', array( 'jquery' ), filemtime( __DIR__ . '/js/popover.js' ), true );
 		wp_enqueue_script( 'wporg-plugins-faq', get_stylesheet_directory_uri() . '/js/section-faq.js', array( 'jquery' ), filemtime( __DIR__ . '/js/section-faq.js' ), true );
 
 		$post = get_post();
@@ -120,7 +120,7 @@ function scripts() {
 
 	if ( get_query_var( 'plugin_advanced' ) ) {
 		wp_enqueue_script( 'google-charts-loader', 'https://www.gstatic.com/charts/loader.js', array(), false, true );
-		wp_enqueue_script( 'wporg-plugins-stats', get_stylesheet_directory_uri() . '/js/stats.js', array( 'jquery', 'google-charts-loader' ), '20260929', true );
+		wp_enqueue_script( 'wporg-plugins-stats', get_stylesheet_directory_uri() . '/js/stats.js', array( 'jquery', 'google-charts-loader' ), filemtime( __DIR__ . '/js/stats.js' ), true );
 
 		wp_localize_script( 'wporg-plugins-stats', 'pluginStats', array(
 			'slug' => is_singular( 'plugin' ) ? get_queried_object()->post_name : '',

wordpress.org/public_html/wp-content/themes/pub/wporg-plugins-2024/js/navigation.js

@@ -4,20 +4,20 @@
  * Handles toggling the navigation menu for small screens and enables TAB key
  * navigation support for dropdown menus.
  */
-( function() {
-	var container, button, menu, links, subMenus, i, len;
+( function () {
+	let i, len;
 
-	container = document.getElementById( 'site-navigation' );
+	const container = document.getElementById( 'site-navigation' );
 	if ( ! container ) {
 		return;
 	}
 
-	button = container.getElementsByTagName( 'button' )[0];
+	const button = container.getElementsByTagName( 'button' )[ 0 ];
 	if ( 'undefined' === typeof button ) {
 		return;
 	}
 
-	menu = container.getElementsByTagName( 'ul' )[0];
+	const menu = container.getElementsByTagName( 'ul' )[ 0 ];
 
 	// Hide menu toggle button if menu is empty and return early.
 	if ( 'undefined' === typeof menu ) {
@@ -29,7 +29,7 @@
 		menu.className += ' nav-menu';
 	}
 
-	button.onclick = function() {
+	button.onclick = function () {
 		if ( -1 !== container.className.indexOf( 'toggled' ) ) {
 			container.className = container.className.replace( ' toggled', '' );
 			button.setAttribute( 'aria-expanded', 'false' );
@@ -40,29 +40,28 @@
 	};
 
 	// Get all the link elements within the menu.
-	links    = menu.getElementsByTagName( 'a' );
-	subMenus = menu.getElementsByTagName( 'ul' );
+	const links = menu.getElementsByTagName( 'a' );
+	const subMenus = menu.getElementsByTagName( 'ul' );
 
 	// Set menu items with submenus to aria-haspopup="true".
 	for ( i = 0, len = subMenus.length; i < len; i++ ) {
-		subMenus[i].parentNode.setAttribute( 'aria-haspopup', 'true' );
+		subMenus[ i ].parentNode.setAttribute( 'aria-haspopup', 'true' );
 	}
 
 	// Each time a menu link is focused or blurred, toggle focus.
 	for ( i = 0, len = links.length; i < len; i++ ) {
-		links[i].addEventListener( 'focus', toggleFocus, true );
-		links[i].addEventListener( 'blur', toggleFocus, true );
+		links[ i ].addEventListener( 'focus', toggleFocus, true );
+		links[ i ].addEventListener( 'blur', toggleFocus, true );
 	}
 
 	/**
 	 * Sets or removes .focus class on an element.
 	 */
 	function toggleFocus() {
-		var self = this;
+		let self = this;
 
 		// Move up through the ancestors of the current link until we hit .nav-menu.
 		while ( -1 === self.className.indexOf( 'nav-menu' ) ) {
-
 			// On li elements toggle the class .focus.
 			if ( 'li' === self.tagName.toLowerCase() ) {
 				if ( -1 !== self.className.indexOf( 'focus' ) ) {