interledger / web-monetization-projects

Coil projects that use Web Monetization. Primarily Coil's browser extension and related WM polyfills.

This repository is deprecated. See WICG/webmonetization#306. The new Web Monetization extension is being developed at https://github.com/interledger/web-monetization-extension.

Web Monetization Projects

Development Process

Ultimately we want main branch to be in a 'good' state at all times, with good test coverage, so we can practice CD, publishing the extensions to dev channels automatically.

Currently, we mostly rely on puppeteer tests which don't cover all the test scenarios. Therefore, we must do manual testing before release, as it's too much of an impediment to run through the full manual release checklist on each PR/commit.

It's a good practice to do manual testing, as often bugs can be found with fresh eyes, if one is carefully going through the steps. Also, doing so helps to keep the various features freshly in mind, so when adding new features or fixing old ones, mistakes can be avoided.

So:

• do not assume the main branch is in a good state !
  • Go through the release release checklist carefully!

Setting up dev environment

The Web-Monetization monorepo uses PNPM so you need to install it. See here or use npm

npm install -g pnpm

Clone and setup the dev env.

git clone [e-mail]:coilhq/web-monetization-projects.git
pnpm install

Node >= 18

The TypeScript is compiled into es2020 and the CI only tests 18 (currently the LTS) and on. See nvm for an easy way to manage multiple versions

Why Vanilla Prettier ?

We used prettier-standard (based on prettierx, a fork of prettier) but found that it was easier to find up-to-date editor/eslint integrations for the mainline prettier and just set the .prettierrc options to match prettier-standard as closely as possible (no semicolon, single-quoted strings etc).

The one main difference is the lack of a space before parentheses in function declarations. e.g.

function prettierStandard () {}

vs

function prettier() {}

This is not a big deal when prettier is run before commit and enforced in the CI etc.

Repository Structure

This repository is managed using pnpm workspaces and typescript project references, with some custom code to generate consistent package.json/tsconfig.build.json/etc and src/test folder structure. See the coil-monorepo-upkeep folder for details.

Development workflow

The root tsconfig.json has all the paths configured so refactoring/navigation works across package boundaries, going directly to the source files rather than the declarations.

It looks at the entire monorepo as one set of sources, yet is configured to not actually emit any source. It is purely for the purposes of the IDE.

It is intended that the whole monorepo be opened in the editor/IDE.

To build the source, one must use each individual package's tsconfig.build.json. The root has a tsconfig.references.json which has {"path": "...} links to all the project leaf nodes. Each package with dependencies on other packages also has these links automatically generated by pnpm upkeep. For example, check the coil-extension tsconfig.build.json

Dependencies

We practice rolling versioning of updates, with dependabot configured to send pull requests as new (release, not beta) versions come in. This practice makes it more likely the CI is able to catch the exact version a dependency starts to cause a break without manual bisection. After the initial hurdle of getting the software into an up-to-date state this requires only scant daily attention, reading the release logs while waiting for CI.

Note that we run through the release-checklist.md before every release, and we catch bugs there as well as with CI.