tgz watch/reload plugin should include pnpm overrides (#126)

.github/workflows/turbo-ci.yml

@@ -55,7 +55,7 @@ jobs:
       - uses: pnpm/action-setup@v4
       - uses: buildjet/setup-node@v4
         with:
-          node-version: '22.4.1'
+          node-version: '22'
           cache: 'pnpm'
       - run: pnpm install --frozen-lockfile
       - run: pnpm turbo build --cache-dir=.turbo

README.md

@@ -19,14 +19,6 @@ You can talk to us on [Discord](https://discord.gg/hKvkrqa3zC).
 
 ### [Prax Marketing Site](https://praxwallet.com/): Marketing site for the Prax wallet
 
-### Packages
-
-- context
-- eslint-config
-- tailwind-config
-- tsconfig
-- ui
-
 ## Documentation
 
 General documentation is available in [docs/README.md](docs/README.md). Package-specific documentation is available in
@@ -36,12 +28,9 @@ each respective package.
 
 ### Prerequisites
 
-- [Install Rust and Cargo](https://doc.rust-lang.org/cargo/getting-started/installation.html) (probably with rustup)
-- [Install Wasm-pack](https://rustwasm.github.io/wasm-pack/installer/)
-- Install [cargo-watch](https://crates.io/crates/cargo-watch): `cargo install cargo-watch`
-- [Install Node.js](https://nodejs.org/en/download/package-manager) however you like (at least version 20)
+- [Install Node.js](https://nodejs.org/en/download/package-manager) version 22 or greater
 - [Install pnpm](https://pnpm.io/installation) (probably via corepack)
-- Install Google Chrome
+- Install Google Chrome (Chromium works but we have encountered behavioral differences)
 
 ### Building
 
@@ -51,26 +40,31 @@ Once you have all these tools, you can
 git clone https://github.com/prax-wallet/web
 cd web
 pnpm i
-pnpm dev
+CHROMIUM_PROFILE=chromium-profile pnpm dev
 ```
 
+The env var `CHROMIUM_PROFILE` is optional. You may simply execute `pnpm dev`,
+or set the var to any path. Presence of a path will create and launch a
+dedicated browser profile with the extension. The directory 'chromium-profile'
+is gitignored.
+
+`CHROMIUM_PROFILE` names 'Chromium' but will launch Google Chrome if installed.
+If you want to use a specific binary, you may need to specify a path with the
+var `CHROME_PATH`.
+
 You now have a local copy of the marketing site available at
 [`https://localhost:5175`](https://localhost:5173) and an unbundled Prax is
-available at [`apps/extension/dist`](apps/extension/dist), ready to be loaded
-into your browser.
+available at [`apps/extension/dist`](apps/extension/dist).
 
 If you're working on Prax, Chrome will show extension page changes after a
-manual refresh, but cannot reload the extension worker scripts or content
-scripts. For worker script changes, you must manually reload the extension. For
-content script changes, you must also manually reload pages hosting the injected
-scripts.
-
-#### Loading your unbundled build of Prax into Chrome
+manual page refresh, but it cannot simply reload the extension worker scripts or
+content scripts. For worker script changes, you may need to manually reload the
+extension. For content script changes, you must also manually reload pages
+hosting the injected scripts.
 
-After building Prax, you can load it into Chrome.
+#### Manually loading your unbundled build of Prax into Chrome
 
-It's recommended to use a dedicated browser profile for development, not your
-personal profile.
+If you don't want to use the profile tool, you must manually load the extension.
 
 1. Go to the Extensions page [`chrome://extensions`](chrome://extensions)
 2. Enable _Developer Mode_ by clicking the toggle switch at the top right
@@ -81,6 +75,21 @@ personal profile.
    - You may set a blank password.
    - You can pin the Prax extension button to your toolbar for quick access.
 
+#### Using local tarball packages
+
+If you're working on packages in another repository that you'd like to include
+in your development cycle, tooling exists here to support use of local `*.tgz`
+packages with `pnpm dev` for a fast watch-edit-rebuild cycle
+
+```sh
+pnpm add:tgz ../path/to/somewhere/specific.tgz ../path/to/some/repo/packages/*/some-filename-*.tgz`
+```
+
+Your other workspace is responsible for rebuilding and repacking the tarballs.
+
+This script also handles peer dependency conflict issues that can arise from use
+of local tarball packages.
+
 ## Security
 
 If you believe you've found a security-related issue with Penumbra,

apps/extension/webpack.config.ts

@@ -19,7 +19,16 @@ dotenv.config({ path: '.env' });
 
 const keysPackage = path.dirname(url.fileURLToPath(import.meta.resolve('@penumbra-zone/keys')));
 
-const localPackages = Object.values(rootPackageJson.dependencies)
+const localPackages = [
+  ...Object.values(rootPackageJson.dependencies),
+  ...Object.values(rootPackageJson.devDependencies),
+
+  /* eslint-disable */
+  // typescript and eslint will recognize the literal type of local json.
+  // this is the simplest way to shut them both up.
+  ...Object.values(((rootPackageJson as any).pnpm?.overrides ?? {}) as Record<string, string>),
+  /* eslint-enable */
+]
   .filter(specifier => specifier.endsWith('.tgz'))
   .map(tgzSpecifier =>
     tgzSpecifier.startsWith('file:') ? url.fileURLToPath(tgzSpecifier) : tgzSpecifier,
@@ -86,8 +95,9 @@ const PnpmInstallPlugin = {
             { stdio: 'inherit' },
           );
           pnpmInstall.on('exit', code => {
-            if (code) reject(new Error(`pnpm install failed ${code}`));
-            else {
+            if (code) {
+              reject(new Error(`pnpm install failed ${code}`));
+            } else {
               // clear webpack's cache to ensure new deps are used
               compiler.purgeInputFileSystem();
               resolve();

package.json

@@ -22,7 +22,6 @@
     "lint:prettier": "prettier --check .",
     "lint:rust": "turbo lint:rust",
     "lint:syncpack": "syncpack lint",
-    "postadd:tgz": "$npm_execpath install",
     "postinstall": "syncpack list-mismatches",
     "pretest": "playwright install",
     "test": "turbo test",

scripts/add-tgz.ts

@@ -64,3 +64,5 @@ for (const [name, tarballUrl] of Object.entries(overrides)) {
   await cmd('pnpm', ['pkg', 'set', `pnpm.overrides.${name}=${tarballUrl}`]);
   await cmd('pnpm', ['pkg', 'set', `pnpm.peerDependencyRules.allowAny[].=${name}`]);
 }
+
+await cmd('pnpm', ['install']);