Update devtools-extensions build script to reflect changes in local b… (#21004)

Co-authored-by: Brian Vaughn <[email protected]>

packages/react-devtools-extensions/build.js

@@ -5,14 +5,47 @@
 const archiver = require('archiver');
 const {execSync} = require('child_process');
 const {readFileSync, writeFileSync, createWriteStream} = require('fs');
-const {copy, ensureDir, move, remove} = require('fs-extra');
-const {join} = require('path');
+const {copy, ensureDir, move, remove, pathExistsSync} = require('fs-extra');
+const {join, resolve} = require('path');
 const {getGitCommit} = require('./utils');
 
 // These files are copied along with Webpack-bundled files
 // to produce the final web extension
 const STATIC_FILES = ['icons', 'popups', 'main.html', 'panel.html'];
 
+/**
+ * Ensures that a local build of the dependencies exist either by downloading
+ * or running a local build via one of the `react-build-fordevtools*` scripts.
+ */
+const ensureLocalBuild = async () => {
+  const buildDir = resolve(__dirname, '..', '..', 'build');
+  const nodeModulesDir = join(buildDir, 'node_modules');
+
+  // TODO: remove this check whenever the CI pipeline is complete.
+  // See build-all-release-channels.js
+  const currentBuildDir = resolve(
+    __dirname,
+    '..',
+    '..',
+    'build2',
+    'oss-experimental',
+  );
+
+  if (pathExistsSync(buildDir)) {
+    return; // all good.
+  }
+
+  if (pathExistsSync(currentBuildDir)) {
+    await ensureDir(buildDir);
+    await copy(currentBuildDir, nodeModulesDir);
+    return; // all good.
+  }
+
+  throw Error(
+    'Could not find build artifacts in repo root. See README for prerequisites.',
+  );
+};
+
 const preProcess = async (destinationPath, tempPath) => {
   await remove(destinationPath); // Clean up from previously completed builds
   await remove(tempPath); // Clean up from any previously failed builds
@@ -74,13 +107,13 @@ const build = async (tempPath, manifestPath) => {
   // Pack the extension
   const archive = archiver('zip', {zlib: {level: 9}});
   const zipStream = createWriteStream(join(tempPath, 'ReactDevTools.zip'));
-  await new Promise((resolve, reject) => {
+  await new Promise((resolvePromise, rejectPromise) => {
     archive
       .directory(zipPath, false)
-      .on('error', err => reject(err))
+      .on('error', err => rejectPromise(err))
       .pipe(zipStream);
     archive.finalize();
-    zipStream.on('close', () => resolve());
+    zipStream.on('close', () => resolvePromise());
   });
 };
 
@@ -102,6 +135,7 @@ const main = async buildId => {
 
   try {
     const tempPath = join(__dirname, 'build', buildId);
+    await ensureLocalBuild();
     await preProcess(destinationPath, tempPath);
     await build(tempPath, manifestPath);
 

packages/react-devtools-extensions/firefox/README.md

@@ -2,7 +2,7 @@
 
 The source code for this extension has moved to `shells/webextension`.
 
-Modify the source code there and then rebuild this extension by running `node build` from this directory or `yarn run build:extension:firefox` from the root directory.
+Modify the source code there and then rebuild this extension by running `node build` from this directory or `yarn run build:firefox` from the root directory.
 
 ## Testing in Firefox
 

packages/react-devtools-extensions/firefox/test.js

@@ -10,13 +10,32 @@ const {argv} = require('yargs');
 const EXTENSION_PATH = resolve('./firefox/build/unpacked');
 const START_URL = argv.url || 'https://reactjs.org/';
 
+const firefoxVersion = process.env.WEB_EXT_FIREFOX;
+
+const getFirefoxProfileName = () => {
+  // Keys are pulled from https://extensionworkshop.com/documentation/develop/web-ext-command-reference/#--firefox
+  // and profile names from https://searchfox.org/mozilla-central/source/toolkit/profile/xpcshell/head.js#96
+  switch (firefoxVersion) {
+    case 'firefox':
+      return 'default-release';
+    case 'beta':
+      return 'default-beta';
+    case 'nightly':
+      return 'default-nightly';
+    case 'firefoxdeveloperedition':
+      return 'dev-edition-default';
+    default:
+      // Fall back to using the default Firefox profile for testing purposes.
+      // This prevents users from having to re-login-to sites before testing.
+      return 'default';
+  }
+};
+
 const main = async () => {
   const finder = new Finder();
 
-  // Use default Firefox profile for testing purposes.
-  // This prevents users from having to re-login-to sites before testing.
   const findPathPromise = new Promise((resolvePromise, rejectPromise) => {
-    finder.getPath('default', (error, profile) => {
+    finder.getPath(getFirefoxProfileName(), (error, profile) => {
       if (error) {
         rejectPromise(error);
       } else {

scripts/rollup/build-all-release-channels.js

@@ -144,6 +144,13 @@ function crossDeviceRenameSync(source, destination) {
   return fse.moveSync(source, destination, {overwrite: true});
 }
 
+/*
+ * Grabs the built packages in ${tmp_build_dir}/node_modules and updates the
+ * `version` key in their package.json to 0.0.0-${commitHash} for the commit
+ * you're building. Also updates the dependencies and peerDependencies
+ * to match this version for all of the 'React' packages
+ * (packages available in this repo).
+ */
 function updatePackageVersions(modulesDir, version) {
   const allReactModuleNames = fs.readdirSync('packages');
   for (const moduleName of fs.readdirSync(modulesDir)) {
@@ -155,9 +162,10 @@ function updatePackageVersions(modulesDir, version) {
       // Update version
       packageInfo.version = version;
 
-      // Update dependency versions
       if (packageInfo.dependencies) {
         for (const dep of Object.keys(packageInfo.dependencies)) {
+          // if it's a react package (available in the current repo), update the version
+          // TODO: is this too broad? Assumes all of the packages were built.
           if (allReactModuleNames.includes(dep)) {
             packageInfo.dependencies[dep] = version;
           }