Merge remote-tracking branch 'upstream/main'

.release-please-manifest.json

@@ -1,3 +1,3 @@
 {
-  ".": "2.51.0"
+  ".": "2.52.1"
 }

build/cli.ts

@@ -54,7 +54,17 @@ interface GlobalMetadata {
 }
 
 interface BuildMetadata {
-  [locale: string]: any;
+  [locale: string]: {
+    baseline?: {
+      total: number;
+      high: number;
+      highPaths: string[];
+      low: number;
+      lowPaths: string[];
+      not: number;
+      notPaths: string[];
+    };
+  };
 }
 
 async function buildDocumentInteractive(
@@ -376,6 +386,13 @@ async function buildDocuments(
   );
 
   for (const [locale, meta] of Object.entries(buildMetadata)) {
+    if (meta.baseline) {
+      // Sort to avoid build difference.
+      meta.baseline.highPaths.sort();
+      meta.baseline.lowPaths.sort();
+      meta.baseline.notPaths.sort();
+    }
+
     // have to write per-locale because we build each locale concurrently
     fs.writeFileSync(
       path.join(BUILD_OUT_ROOT, locale.toLowerCase(), "build.json"),

build/index.ts

@@ -587,6 +587,10 @@ function addBaseline(doc: Partial<Doc>) {
           "api.InputEvent.dataTransfer",
           "api.InputEvent.getTargetRanges",
           "api.InputEvent.inputType",
+          // https://github.com/web-platform-dx/web-features/issues/1038
+          // https://github.com/web-platform-dx/web-features/blob/64d2cfd/features/screen-orientation-lock.dist.yml
+          "api.ScreenOrientation.lock",
+          "api.ScreenOrientation.unlock",
         ].includes(query)
     );
     return getWebFeatureStatus(...filteredBrowserCompat);

build/spas.ts

@@ -145,7 +145,6 @@ export async function buildSPAs(options: {
         {
           prefix: "plus/ai-help",
           pageTitle: `AI Help | ${MDN_PLUS_TITLE}`,
-          noIndexing: true,
         },
         {
           prefix: "plus/collections",
@@ -160,7 +159,6 @@ export async function buildSPAs(options: {
         {
           prefix: "plus/updates",
           pageTitle: `Updates | ${MDN_PLUS_TITLE}`,
-          noIndexing: true,
         },
         {
           prefix: "plus/settings",

build/utils.ts

@@ -8,7 +8,7 @@ import * as cheerio from "cheerio";
 import got from "got";
 import { fileTypeFromBuffer } from "file-type";
 import imagemin from "imagemin";
-import imageminPngquantPkg from "imagemin-pngquant";
+import imageminPngquant from "imagemin-pngquant";
 import imageminMozjpeg from "imagemin-mozjpeg";
 import imageminGifsicle from "imagemin-gifsicle";
 import imageminSvgo from "imagemin-svgo";
@@ -22,8 +22,6 @@ import {
 import { FileAttachment } from "../content/index.js";
 import { BLOG_ROOT } from "../libs/env/index.js";
 
-const { default: imageminPngquant } = imageminPngquantPkg;
-
 export function escapeRegExp(str: string) {
   return str.replace(/[\\^$.*+?()[\]{}|]/g, "\\$&");
 }

client/config/env.js

@@ -40,7 +40,7 @@ process.env.NODE_PATH = (process.env.NODE_PATH || "")
 // injected into the application via DefinePlugin in webpack configuration.
 const REACT_APP = /^REACT_APP_/i;
 
-function getClientEnvironment(publicUrl) {
+function getClientEnvironment() {
   const raw = Object.keys(process.env)
     .filter((key) => REACT_APP.test(key))
     .reduce(
@@ -52,11 +52,8 @@ function getClientEnvironment(publicUrl) {
         // Useful for determining whether we’re running in production mode.
         // Most importantly, it switches React into the correct mode.
         NODE_ENV: process.env.NODE_ENV || "development",
-        // Useful for resolving the correct path to static assets in `public`.
-        // For example, <img src={process.env.PUBLIC_URL + '/img/logo.png'} />.
-        // This should only be used as an escape hatch. Normally you would put
-        // images into the `src` and `import` them in code to get their paths.
-        PUBLIC_URL: publicUrl,
+        // TODO: Can't remove yet as it makes the build differ, remove later
+        PUBLIC_URL: "",
         // We support configuring the sockjs pathname during development.
         // These settings let a developer run multiple simultaneous projects.
         // They are used as the connection `hostname`, `pathname` and `port`
@@ -65,9 +62,9 @@ function getClientEnvironment(publicUrl) {
         WDS_SOCKET_HOST: process.env.WDS_SOCKET_HOST,
         WDS_SOCKET_PATH: process.env.WDS_SOCKET_PATH,
         WDS_SOCKET_PORT: process.env.WDS_SOCKET_PORT,
-        // Whether or not react-refresh is enabled.
-        // It is defined here so it is available in the webpackHotDevClient.
-        FAST_REFRESH: process.env.FAST_REFRESH !== "false",
+        // TODO: Can't remove yet as it makes the build differ, remove later
+        // It was defined here so it was available in the webpackHotDevClient.
+        FAST_REFRESH: true,
       }
     );
   // Stringify all values so we can feed into webpack DefinePlugin

client/config/getHttpsConfig.js

@@ -1,7 +1,7 @@
 import fs from "node:fs";
 import path from "node:path";
 import crypto from "node:crypto";
-import chalk from "react-dev-utils/chalk.js";
+import chalk from "chalk";
 import paths from "./paths.js";
 
 // Ensure the certificate and key provided are valid and if not

client/config/jest/babelTransform.js

@@ -3,25 +3,12 @@ import babelJest from "babel-jest";
 
 const require = createRequire(import.meta.url);
 
-const hasJsxRuntime = (() => {
-  if (process.env.DISABLE_NEW_JSX_TRANSFORM === "true") {
-    return false;
-  }
-
-  try {
-    require.resolve("react/jsx-runtime");
-    return true;
-  } catch (e) {
-    return false;
-  }
-})();
-
 export default babelJest.createTransformer({
   presets: [
     [
       require.resolve("babel-preset-react-app"),
       {
-        runtime: hasJsxRuntime ? "automatic" : "classic",
+        runtime: "automatic",
       },
     ],
   ],

client/config/paths.js

@@ -1,55 +1,14 @@
-import fs from "node:fs";
 import { fileURLToPath } from "node:url";
-import getPublicUrlOrPath from "react-dev-utils/getPublicUrlOrPath.js";
 
 // Make sure any symlinks in the project folder are resolved:
 // https://github.com/facebook/create-react-app/issues/637
 const appDirectory = new URL("..", import.meta.url);
 const resolveApp = (relativePath) =>
   fileURLToPath(new URL(relativePath, appDirectory));
 
-const appPackage = JSON.parse(fs.readFileSync(resolveApp("package.json")));
-
-// We use `PUBLIC_URL` environment variable or "homepage" field to infer
-// "public path" at which the app is served.
-// webpack needs to know it to put the right <script> hrefs into HTML even in
-// single-page apps that may serve index.html for nested URLs like /todos/42.
-// We can't use a relative path in HTML because we don't want to load something
-// like /todos/42/static/js/bundle.7289d.js. We have to know the root.
-const publicUrlOrPath = getPublicUrlOrPath(
-  process.env.NODE_ENV === "development",
-  appPackage.homepage,
-  process.env.PUBLIC_URL
-);
-
 const buildPath = process.env.BUILD_PATH || "build";
 
-const moduleFileExtensions = [
-  "web.mjs",
-  "mjs",
-  "web.js",
-  "js",
-  "web.ts",
-  "ts",
-  "web.tsx",
-  "tsx",
-  "json",
-  "web.jsx",
-  "jsx",
-];
-
-// Resolve file paths in the same order as webpack
-const resolveModule = (resolveFn, filePath) => {
-  const extension = moduleFileExtensions.find((extension) =>
-    fs.existsSync(resolveFn(`${filePath}.${extension}`))
-  );
-
-  if (extension) {
-    return resolveFn(`${filePath}.${extension}`);
-  }
-
-  return resolveFn(`${filePath}.js`);
-};
+const moduleFileExtensions = ["mjs", "js", "ts", "tsx", "json", "jsx"];
 
 // config after eject: we're in ./config/
 const config = {
@@ -58,19 +17,10 @@ const config = {
   appBuild: resolveApp(buildPath),
   appPublic: resolveApp("public"),
   appHtml: resolveApp("public/index.html"),
-  appIndexJs: resolveModule(resolveApp, "src/index"),
   appPackageJson: resolveApp("../package.json"),
   appSrc: resolveApp("src"),
   appTsConfig: resolveApp("tsconfig.json"),
-  appJsConfig: resolveApp("jsconfig.json"),
   yarnLockFile: resolveApp("../yarn.lock"),
-  testsSetup: resolveModule(resolveApp, "src/setupTests"),
-  proxySetup: resolveApp("src/setupProxy.js"),
-  appNodeModules: resolveApp("../node_modules"),
-  appWebpackCache: resolveApp("../node_modules/.cache"),
-  appTsBuildInfoFile: resolveApp("../node_modules/.cache/tsconfig.tsbuildinfo"),
-  swSrc: resolveModule(resolveApp, "src/service-worker"),
-  publicUrlOrPath,
   libsPath: resolveApp("../libs"),
   moduleFileExtensions,
 };