Scripts: Update webpack and related dependencies to the latest version (

#54657)

* Scripts: Update webpack dependencies to the latest version

* Fix the updated path to the React Refresh runtime

* Update test snapshots impacted by changes to npm dependencies

* Add CHANGELOG entries

package.json

@@ -109,7 +109,7 @@
 		"@octokit/types": "6.34.0",
 		"@octokit/webhooks-types": "5.6.0",
 		"@playwright/test": "1.32.0",
-		"@pmmmwh/react-refresh-webpack-plugin": "0.5.2",
+		"@pmmmwh/react-refresh-webpack-plugin": "0.5.11",
 		"@storybook/addon-a11y": "7.2.2",
 		"@storybook/addon-actions": "7.2.2",
 		"@storybook/addon-controls": "7.2.2",
@@ -176,8 +176,8 @@
 		"babel-plugin-react-native-platform-specific-extensions": "1.1.1",
 		"babel-plugin-transform-remove-console": "6.9.4",
 		"benchmark": "2.1.4",
-		"browserslist": "4.21.9",
-		"caniuse-lite": "1.0.30001513",
+		"browserslist": "4.21.10",
+		"caniuse-lite": "1.0.30001538",
 		"chalk": "4.1.1",
 		"change-case": "4.1.2",
 		"commander": "9.2.0",
@@ -232,7 +232,7 @@
 		"react-dom": "18.2.0",
 		"react-native": "0.71.11",
 		"react-native-url-polyfill": "1.1.2",
-		"react-refresh": "0.10.0",
+		"react-refresh": "0.14.0",
 		"react-test-renderer": "18.2.0",
 		"reassure": "0.7.1",
 		"redux": "4.1.2",
@@ -255,8 +255,8 @@
 		"uglify-js": "3.13.7",
 		"uuid": "8.3.0",
 		"wd": "1.12.1",
-		"webpack": "5.76.0",
-		"webpack-bundle-analyzer": "4.4.2",
+		"webpack": "5.88.2",
+		"webpack-bundle-analyzer": "4.9.1",
 		"worker-farm": "1.7.0"
 	},
 	"overrides": {

packages/babel-preset-default/CHANGELOG.md

@@ -2,6 +2,10 @@
 
 ## Unreleased
 
+### Internal
+
+-   The bundled `browserslist` dependency has been updated from requiring `^4.21.9` to requiring `^4.21.10` ([#54657](https://github.com/WordPress/gutenberg/pull/54657)).
+
 ## 7.26.0 (2023-09-20)
 
 ## 7.25.0 (2023-08-31)

packages/babel-preset-default/package.json

@@ -39,7 +39,7 @@
 		"@wordpress/browserslist-config": "file:../browserslist-config",
 		"@wordpress/element": "file:../element",
 		"@wordpress/warning": "file:../warning",
-		"browserslist": "^4.21.9",
+		"browserslist": "^4.21.10",
 		"core-js": "^3.31.0"
 	},
 	"publishConfig": {

packages/dependency-extraction-webpack-plugin/test/__snapshots__/build.js.snap

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`DependencyExtractionWebpackPlugin Webpack \`combine-assets\` should produce expected output: Asset file 'assets.php' should match snapshot 1`] = `
-"<?php return array('fileA.js' => array('dependencies' => array('lodash', 'wp-blob'), 'version' => 'cbe985cf6e1a25d848e5'), 'fileB.js' => array('dependencies' => array('wp-token-list'), 'version' => '7f3970305cf0aecb54ab'));
+"<?php return array('fileA.js' => array('dependencies' => array('lodash', 'wp-blob'), 'version' => '52d35a0af8a5fb869915'), 'fileB.js' => array('dependencies' => array('wp-token-list'), 'version' => '0af6c51a8e6ac934b85a'));
 "
 `;
 
@@ -32,7 +32,7 @@ exports[`DependencyExtractionWebpackPlugin Webpack \`combine-assets\` should pro
 `;
 
 exports[`DependencyExtractionWebpackPlugin Webpack \`dynamic-import\` should produce expected output: Asset file 'main.asset.php' should match snapshot 1`] = `
-"<?php return array('dependencies' => array('wp-blob'), 'version' => '0627f8793e7cd59541db');
+"<?php return array('dependencies' => array('wp-blob'), 'version' => '47f8a22aa6c04c930f5f');
 "
 `;
 
@@ -50,7 +50,7 @@ exports[`DependencyExtractionWebpackPlugin Webpack \`dynamic-import\` should pro
 `;
 
 exports[`DependencyExtractionWebpackPlugin Webpack \`function-output-filename\` should produce expected output: Asset file 'chunk--main--main.asset.php' should match snapshot 1`] = `
-"<?php return array('dependencies' => array('lodash', 'wp-blob'), 'version' => 'fc2d750fc9e08c5749db');
+"<?php return array('dependencies' => array('lodash', 'wp-blob'), 'version' => '35d057cb1c8a30094445');
 "
 `;
 
@@ -73,7 +73,7 @@ exports[`DependencyExtractionWebpackPlugin Webpack \`function-output-filename\`
 `;
 
 exports[`DependencyExtractionWebpackPlugin Webpack \`has-extension-suffix\` should produce expected output: Asset file 'index.min.asset.php' should match snapshot 1`] = `
-"<?php return array('dependencies' => array('lodash', 'wp-blob'), 'version' => 'c3f17b34fdd974d57d0f');
+"<?php return array('dependencies' => array('lodash', 'wp-blob'), 'version' => '27e49c80f699647ec11c');
 "
 `;
 
@@ -96,21 +96,21 @@ exports[`DependencyExtractionWebpackPlugin Webpack \`has-extension-suffix\` shou
 `;
 
 exports[`DependencyExtractionWebpackPlugin Webpack \`no-default\` should produce expected output: Asset file 'main.asset.php' should match snapshot 1`] = `
-"<?php return array('dependencies' => array(), 'version' => '43880e6c42e7c39fcdf1');
+"<?php return array('dependencies' => array(), 'version' => 'cdc72dbcdf872f6141c7');
 "
 `;
 
 exports[`DependencyExtractionWebpackPlugin Webpack \`no-default\` should produce expected output: External modules should match snapshot 1`] = `[]`;
 
 exports[`DependencyExtractionWebpackPlugin Webpack \`no-deps\` should produce expected output: Asset file 'main.asset.php' should match snapshot 1`] = `
-"<?php return array('dependencies' => array(), 'version' => '143ed23d4b8be5611fcb');
+"<?php return array('dependencies' => array(), 'version' => '091ffcd70d94dd16e773');
 "
 `;
 
 exports[`DependencyExtractionWebpackPlugin Webpack \`no-deps\` should produce expected output: External modules should match snapshot 1`] = `[]`;
 
 exports[`DependencyExtractionWebpackPlugin Webpack \`option-function-output-filename\` should produce expected output: Asset file 'chunk--main--main.asset.php' should match snapshot 1`] = `
-"<?php return array('dependencies' => array('lodash', 'wp-blob'), 'version' => 'fc2d750fc9e08c5749db');
+"<?php return array('dependencies' => array('lodash', 'wp-blob'), 'version' => '35d057cb1c8a30094445');
 "
 `;
 
@@ -133,7 +133,7 @@ exports[`DependencyExtractionWebpackPlugin Webpack \`option-function-output-file
 `;
 
 exports[`DependencyExtractionWebpackPlugin Webpack \`option-output-filename\` should produce expected output: Asset file 'main-foo.asset.php' should match snapshot 1`] = `
-"<?php return array('dependencies' => array('lodash', 'wp-blob'), 'version' => 'fc2d750fc9e08c5749db');
+"<?php return array('dependencies' => array('lodash', 'wp-blob'), 'version' => '35d057cb1c8a30094445');
 "
 `;
 
@@ -155,7 +155,7 @@ exports[`DependencyExtractionWebpackPlugin Webpack \`option-output-filename\` sh
 ]
 `;
 
-exports[`DependencyExtractionWebpackPlugin Webpack \`output-format-json\` should produce expected output: Asset file 'main.asset.json' should match snapshot 1`] = `"{"dependencies":["lodash"],"version":"7bd48470d799a795bf9a"}"`;
+exports[`DependencyExtractionWebpackPlugin Webpack \`output-format-json\` should produce expected output: Asset file 'main.asset.json' should match snapshot 1`] = `"{"dependencies":["lodash"],"version":"abdb687afe609197ad7e"}"`;
 
 exports[`DependencyExtractionWebpackPlugin Webpack \`output-format-json\` should produce expected output: External modules should match snapshot 1`] = `
 [
@@ -168,7 +168,7 @@ exports[`DependencyExtractionWebpackPlugin Webpack \`output-format-json\` should
 `;
 
 exports[`DependencyExtractionWebpackPlugin Webpack \`overrides\` should produce expected output: Asset file 'main.asset.php' should match snapshot 1`] = `
-"<?php return array('dependencies' => array('wp-blob', 'wp-script-handle-for-rxjs', 'wp-url'), 'version' => '708c71445153f1d07e4a');
+"<?php return array('dependencies' => array('wp-blob', 'wp-script-handle-for-rxjs', 'wp-url'), 'version' => '2a29b245fc3d0509b5a8');
 "
 `;
 
@@ -207,17 +207,17 @@ exports[`DependencyExtractionWebpackPlugin Webpack \`overrides\` should produce
 `;
 
 exports[`DependencyExtractionWebpackPlugin Webpack \`runtime-chunk-single\` should produce expected output: Asset file 'a.asset.php' should match snapshot 1`] = `
-"<?php return array('dependencies' => array('wp-blob'), 'version' => 'd3cda564b538b44d38ef');
+"<?php return array('dependencies' => array('wp-blob'), 'version' => '4514ed711f6c035e0887');
 "
 `;
 
 exports[`DependencyExtractionWebpackPlugin Webpack \`runtime-chunk-single\` should produce expected output: Asset file 'b.asset.php' should match snapshot 1`] = `
-"<?php return array('dependencies' => array('lodash', 'wp-blob'), 'version' => '420d636da562e71648f7');
+"<?php return array('dependencies' => array('lodash', 'wp-blob'), 'version' => '168d32b5fb42f9e5d8ce');
 "
 `;
 
 exports[`DependencyExtractionWebpackPlugin Webpack \`runtime-chunk-single\` should produce expected output: Asset file 'runtime.asset.php' should match snapshot 1`] = `
-"<?php return array('dependencies' => array(), 'version' => '5fa1791a041e1b19555f');
+"<?php return array('dependencies' => array(), 'version' => 'b4058959bcd0df37cd79');
 "
 `;
 
@@ -240,7 +240,7 @@ exports[`DependencyExtractionWebpackPlugin Webpack \`runtime-chunk-single\` shou
 `;
 
 exports[`DependencyExtractionWebpackPlugin Webpack \`style-imports\` should produce expected output: Asset file 'main.asset.php' should match snapshot 1`] = `
-"<?php return array('dependencies' => array('lodash', 'wp-blob'), 'version' => '4c661914a4e4d80b8a0b');
+"<?php return array('dependencies' => array('lodash', 'wp-blob'), 'version' => 'beb3f6752168c2983cdd');
 "
 `;
 
@@ -263,7 +263,7 @@ exports[`DependencyExtractionWebpackPlugin Webpack \`style-imports\` should prod
 `;
 
 exports[`DependencyExtractionWebpackPlugin Webpack \`wordpress\` should produce expected output: Asset file 'main.asset.php' should match snapshot 1`] = `
-"<?php return array('dependencies' => array('lodash', 'wp-blob'), 'version' => 'fc2d750fc9e08c5749db');
+"<?php return array('dependencies' => array('lodash', 'wp-blob'), 'version' => '35d057cb1c8a30094445');
 "
 `;
 
@@ -286,7 +286,7 @@ exports[`DependencyExtractionWebpackPlugin Webpack \`wordpress\` should produce
 `;
 
 exports[`DependencyExtractionWebpackPlugin Webpack \`wordpress-require\` should produce expected output: Asset file 'main.asset.php' should match snapshot 1`] = `
-"<?php return array('dependencies' => array('lodash', 'wp-blob'), 'version' => '40370eb4ce6428562da6');
+"<?php return array('dependencies' => array('lodash', 'wp-blob'), 'version' => 'ed2bd4e7df46768bb3c2');
 "
 `;
 

packages/readable-js-assets-webpack-plugin/test/__snapshots__/build.js.snap

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`ReadableJsAssetsWebpackPlugin should produce the expected output: Asset file index.js should match snapshot 1`] = `
-"/******/ (() => { // webpackBootstrap
+"/******/ (function() { // webpackBootstrap
 var __webpack_exports__ = {};
 function notMinified() {
 	// eslint-disable-next-line no-console
@@ -16,7 +16,7 @@ notMinified();
 exports[`ReadableJsAssetsWebpackPlugin should produce the expected output: Asset file index.min.js should match snapshot 1`] = `"console.log("hello");"`;
 
 exports[`ReadableJsAssetsWebpackPlugin should produce the expected output: Asset file view.js should match snapshot 1`] = `
-"/******/ (() => { // webpackBootstrap
+"/******/ (function() { // webpackBootstrap
 var __webpack_exports__ = {};
 function notMinified() {
 	// eslint-disable-next-line no-console

packages/scripts/CHANGELOG.md

@@ -2,6 +2,16 @@
 
 ## Unreleased
 
+### Internal
+
+-   The bundled `@pmmmwh/react-refresh-webpack-plugin` dependency has been updated from requiring `^0.5.2` to requiring `^0.5.11` ([#54657](https://github.com/WordPress/gutenberg/pull/54657)).
+-   The bundled `browserslist` dependency has been updated from requiring `^4.21.9` to requiring `^4.21.10` ([#54657](https://github.com/WordPress/gutenberg/pull/54657)).
+-   The bundled `react-refresh` dependency has been updated from requiring `^0.10.0` to requiring `^0.14.0` ([#54657](https://github.com/WordPress/gutenberg/pull/54657)).
+-   The bundled `webpack` dependency has been updated from requiring `^5.47.1` to requiring `^5.88.2` ([#54657](https://github.com/WordPress/gutenberg/pull/54657)).
+-   The bundled `webpack-bundle-analyzer` dependency has been updated from requiring `^4.4.2` to requiring `^4.9.1` ([#54657](https://github.com/WordPress/gutenberg/pull/54657)).
+-   The bundled `webpack-cli` dependency has been updated from requiring `^4.9.1` to requiring `^5.1.4` ([#54657](https://github.com/WordPress/gutenberg/pull/54657)).
+-   The bundled `webpack-dev-server` dependency has been updated from requiring `^4.4.0` to requiring `^4.15.1` ([#54657](https://github.com/WordPress/gutenberg/pull/54657)).
+
 ## 26.13.0 (2023-09-20)
 
 ### Enhancements

packages/scripts/package.json

@@ -33,7 +33,7 @@
 	},
 	"dependencies": {
 		"@babel/core": "^7.16.0",
-		"@pmmmwh/react-refresh-webpack-plugin": "^0.5.2",
+		"@pmmmwh/react-refresh-webpack-plugin": "^0.5.11",
 		"@svgr/webpack": "^8.0.1",
 		"@wordpress/babel-preset-default": "file:../babel-preset-default",
 		"@wordpress/browserslist-config": "file:../browserslist-config",
@@ -48,7 +48,7 @@
 		"adm-zip": "^0.5.9",
 		"babel-jest": "^29.6.2",
 		"babel-loader": "^8.2.3",
-		"browserslist": "^4.21.9",
+		"browserslist": "^4.21.10",
 		"chalk": "^4.0.0",
 		"check-node-version": "^4.1.0",
 		"clean-webpack-plugin": "^3.0.0",
@@ -77,7 +77,7 @@
 		"postcss-loader": "^6.2.1",
 		"prettier": "npm:wp-prettier@3.0.3-beta-3",
 		"puppeteer-core": "^13.2.0",
-		"react-refresh": "^0.10.0",
+		"react-refresh": "^0.14.0",
 		"read-pkg-up": "^7.0.1",
 		"resolve-bin": "^0.4.0",
 		"sass": "^1.35.2",
@@ -86,10 +86,10 @@
 		"stylelint": "^14.2.0",
 		"terser-webpack-plugin": "^5.3.9",
 		"url-loader": "^4.1.1",
-		"webpack": "^5.47.1",
-		"webpack-bundle-analyzer": "^4.4.2",
-		"webpack-cli": "^4.9.1",
-		"webpack-dev-server": "^4.4.0"
+		"webpack": "^5.88.2",
+		"webpack-bundle-analyzer": "^4.9.1",
+		"webpack-cli": "^5.1.4",
+		"webpack-dev-server": "^4.15.1"
 	},
 	"peerDependencies": {
 		"@playwright/test": "^1.32.0",

tools/webpack/development.js

@@ -33,7 +33,7 @@ module.exports = [
 		name: 'react-refresh-runtime',
 		entry: {
 			'react-refresh-runtime': {
-				import: 'react-refresh/runtime.js',
+				import: 'react-refresh/runtime',
 				library: {
 					name: 'ReactRefreshRuntime',
 					type: 'window',