Add browser build configuration for API package by MatissJanis · Pull Request #7247 · actualbudget/actual

MatissJanis · 2026-03-20T21:16:21Z

Description

API package: browser support 🎉

Related issue(s)

n/a

Testing

The build scripts can be verified by running:

yarn build:node - builds the Node.js version
yarn build:browser - builds the browser version
yarn build - builds both versions

Existing tests should continue to pass with no regressions. We now also have browser-specific tests.

Checklist

Release notes added
No obvious regressions in affected areas
Self-review has been performed - I understand what each change in the code does and why it is needed

https://claude.ai/code/session_01MnxRXLNjqXrVb5CdsC85Fb

Bundle Stats

Bundle	Files count	Total bundle size	% Changed
desktop-client	26	11.99 MB	0%
loot-core	1	4.83 MB	0%
api	4	4.06 MB	0%
cli	1	7.88 MB	0%

View detailed bundle stats

desktop-client

Total

Files count	Total bundle size	% Changed
26	11.99 MB	0%

View detailed bundle breakdown

Added
No assets were added

Removed
No assets were removed

Bigger
No assets were bigger

Smaller
No assets were smaller

Unchanged

Asset	File Size	% Changed
static/js/index.js	3.23 MB	0%
static/js/BackgroundImage.js	119.98 kB	0%
static/js/FormulaEditor.js	846.44 kB	0%
static/js/ReportRouter.js	1021.25 kB	0%
static/js/TransactionList.js	81.29 kB	0%
static/js/ca.js	185.57 kB	0%
static/js/da.js	104.66 kB	0%
static/js/de.js	177.58 kB	0%
static/js/en-GB.js	7.16 kB	0%
static/js/en.js	170.68 kB	0%
static/js/es.js	172.13 kB	0%
static/js/fr.js	177.57 kB	0%
static/js/indexeddb-main-thread-worker-e59fee74.js	13.46 kB	0%
static/js/it.js	168.97 kB	0%
static/js/narrow.js	354.12 kB	0%
static/js/nb-NO.js	154.72 kB	0%
static/js/nl.js	111.58 kB	0%
static/js/pl.js	88.34 kB	0%
static/js/pt-BR.js	180.5 kB	0%
static/js/resize-observer.js	18.03 kB	0%
static/js/th.js	179.94 kB	0%
static/js/theme.js	30.68 kB	0%
static/js/uk.js	213.14 kB	0%
static/js/useTransactionBatchActions.js	4.29 MB	0%
static/js/wide.js	418 B	0%
static/js/workbox-window.prod.es5.js	7.28 kB	0%

loot-core

Total

Files count	Total bundle size	% Changed
1	4.83 MB	0%

View detailed bundle breakdown

Added
No assets were added

Removed
No assets were removed

Bigger
No assets were bigger

Smaller
No assets were smaller

Unchanged

Asset	File Size	% Changed
kcab.worker.Dmj0rSrb.js	4.83 MB	0%

api

Total

Files count	Total bundle size	% Changed
4	4.06 MB	0%

View detailed bundle breakdown

Added
No assets were added

Removed
No assets were removed

Bigger
No assets were bigger

Smaller
No assets were smaller

Unchanged

Asset	File Size	% Changed
index.js	3.84 MB	0%
from-Bl-Hslp4.js	167.73 kB	0%
multipart-parser-BnDysoMr.js	8.1 kB	0%
src-iMkUmuwR.js	43.64 kB	0%

cli

Total

Files count	Total bundle size	% Changed
1	7.88 MB	0%

View detailed bundle breakdown

Added
No assets were added

Removed
No assets were removed

Bigger
No assets were bigger

Smaller
No assets were smaller

Unchanged

Asset	File Size	% Changed
cli.js	7.88 MB	0%

The API package was previously Node.js-only due to its dependency on better-sqlite3 and Node.js fs/path modules. This adds a browser build that uses loot-core's existing browser platform implementations (sql.js/WASM, IndexedDB, absurd-sql) instead. Changes: - Add index.web.ts: browser entry point (no Node.js version check or node-fetch polyfill) - Add vite.browser.config.ts: browser-targeted Vite build that resolves to browser platform files (index.ts) instead of Node.js ones (index.api.ts -> index.electron.ts) - Update package.json: conditional exports (browser vs default/node), module field, build:browser script - Update tsconfig.json: exclude new config file from type checking The browser build outputs dist/browser.js (ESM) alongside the existing dist/index.js (CJS/Node). Bundlers that support the "browser" condition in package.json exports will automatically use the browser build. https://claude.ai/code/session_01MnxRXLNjqXrVb5CdsC85Fb

- Remove `internal` export from index.web.ts (keep as local variable) - Use `yarn build:node && yarn build:browser` in build script - Remove unnecessary `node:` external from vite.browser.config.ts (Vite handles browser externalization automatically) https://claude.ai/code/session_01MnxRXLNjqXrVb5CdsC85Fb

netlify · 2026-03-20T21:16:27Z

✅ Deploy Preview for actualbudget ready!

Name	Link
🔨 Latest commit	`03ed7d8`
🔍 Latest deploy log	https://app.netlify.com/projects/actualbudget/deploys/69bf19f7e69895000819f286
😎 Deploy Preview	https://deploy-preview-7247.demo.actualbudget.org
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

netlify · 2026-03-20T21:17:52Z

✅ Deploy Preview for actualbudget-storybook ready!

Name	Link
🔨 Latest commit	`3e2303e`
🔍 Latest deploy log	https://app.netlify.com/projects/actualbudget-storybook/deploys/69bdbbd518c9d80008a93ddb
😎 Deploy Preview	https://deploy-preview-7247--actualbudget-storybook.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

netlify · 2026-03-20T21:18:43Z

✅ Deploy Preview for actualbudget-website ready!

Name	Link
🔨 Latest commit	`3e2303e`
🔍 Latest deploy log	https://app.netlify.com/projects/actualbudget-website/deploys/69bdbbd502fb360008af69e3
😎 Deploy Preview	https://deploy-preview-7247.www.actualbudget.org
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

The API package was previously Node.js-only due to its dependency on better-sqlite3 and Node.js fs/path modules. This adds a browser build that uses loot-core's existing browser platform implementations (sql.js/WASM, IndexedDB, absurd-sql) instead. Changes: - Add index.web.ts: browser entry point (no Node.js version check or node-fetch polyfill) - Add vite.browser.config.ts: browser-targeted Vite build that resolves to browser platform files (index.ts) instead of Node.js ones (index.api.ts -> index.electron.ts) - Update package.json: conditional exports (browser vs default/node), module field, build:browser script - Update tsconfig.json: exclude new config file from type checking The browser build outputs dist/browser.js (ESM) alongside the existing dist/index.js (CJS/Node). Bundlers that support the "browser" condition in package.json exports will automatically use the browser build. https://claude.ai/code/session_01MnxRXLNjqXrVb5CdsC85Fb

- Remove `internal` export from index.web.ts (keep as local variable) - Use `yarn build:node && yarn build:browser` in build script - Remove unnecessary `node:` external from vite.browser.config.ts (Vite handles browser externalization automatically) https://claude.ai/code/session_01MnxRXLNjqXrVb5CdsC85Fb

Add type assertion for aqlQuery result to fix 'result is of type unknown' error introduced in #7240. https://claude.ai/code/session_01MnxRXLNjqXrVb5CdsC85Fb

joel-jeremy · 2026-03-20T23:08:08Z

packages/api/index.web.ts

Maybe we should do index.browser.ts? Because that's the naming we use in loot-core

That makes sense.

Also added some unit tests.

Still have not done a manual test though, so am not 100% confident in this PR. But I have to leave it here. Will circle back in ~1 week. Or you can take over it if you like

Also to note: if we start using api directly in desktop-client - the bundle size will go up by approx 4mb as we would be double-bundling loot-core. To solve this we need to also address #7252 and then slightly change the build process for the api package. All doable.. but I haven't gotten to this yet.

…albudget/actual into claude/browser-compatible-api-QbhHh

… API package. This change is part of the ongoing refactor to streamline the API for browser compatibility.

- Introduced `npm-run-all` for improved script management in package.json. - Updated Vite configuration to include test settings for both browser and Node environments. - Added integration tests for API CRUD operations, including budget and category management. - Created setup files for browser and Node testing environments. - Updated yarn.lock to include new dependencies. This commit enhances the testing framework and ensures better compatibility across environments.

… yarn.lock

claude added 2 commits March 16, 2026 22:19

actual-github-bot bot added the 🚧 WIP label Mar 20, 2026

claude added 2 commits March 20, 2026 21:27

MatissJanis force-pushed the claude/browser-compatible-api-QbhHh branch from 6d6e032 to 3e2303e Compare March 20, 2026 21:27

claude and others added 2 commits March 20, 2026 21:32

[AI] Fix type error in CLI query command

1442747

Add type assertion for aqlQuery result to fix 'result is of type unknown' error introduced in #7240. https://claude.ai/code/session_01MnxRXLNjqXrVb5CdsC85Fb

[autofix.ci] apply automated fixes

645623a

MatissJanis mentioned this pull request Mar 20, 2026

[WIP] Use JS Proxy to simplify loot-core app calls from desktop-client #7246

Open

3 tasks

joel-jeremy reviewed Mar 20, 2026

View reviewed changes

actual-github-bot bot assigned joel-jeremy Mar 20, 2026

MatissJanis added 7 commits March 21, 2026 20:51

Add browser entry point and update Vite configuration for API package

5b179b0

Merge branch 'claude/browser-compatible-api-QbhHh' of github.com:actu…

4a5b572

…albudget/actual into claude/browser-compatible-api-QbhHh

Remove index.web.ts file, eliminating the browser entry point for the…

b662205

… API package. This change is part of the ongoing refactor to streamline the API for browser compatibility.

Merge branch 'master' into claude/browser-compatible-api-QbhHh

f0470a3

Add test setup validation and extend global types for API testing

1d34d15

Update fake-indexeddb dependency to version 6.2.5 in package.json and…

03ed7d8

… yarn.lock

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Add browser build configuration for API package#7247

Add browser build configuration for API package#7247
MatissJanis wants to merge 13 commits intomasterfrom
claude/browser-compatible-api-QbhHh

MatissJanis commented Mar 20, 2026 •

edited by github-actions bot

Loading

Uh oh!

netlify bot commented Mar 20, 2026 •

edited

Loading

Uh oh!

netlify bot commented Mar 20, 2026 •

edited

Loading

Uh oh!

netlify bot commented Mar 20, 2026 •

edited

Loading

Uh oh!

joel-jeremy Mar 20, 2026

Uh oh!

MatissJanis Mar 21, 2026

Uh oh!

MatissJanis Mar 21, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Uh oh!

Conversation

MatissJanis commented Mar 20, 2026 • edited by github-actions bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Related issue(s)

Testing

Checklist

Bundle Stats

desktop-client

loot-core

api

cli

Uh oh!

netlify bot commented Mar 20, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for actualbudget ready!

Uh oh!

netlify bot commented Mar 20, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for actualbudget-storybook ready!

Uh oh!

netlify bot commented Mar 20, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for actualbudget-website ready!

Uh oh!

joel-jeremy Mar 20, 2026

Choose a reason for hiding this comment

Uh oh!

MatissJanis Mar 21, 2026

Choose a reason for hiding this comment

Uh oh!

MatissJanis Mar 21, 2026

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

MatissJanis commented Mar 20, 2026 •

edited by github-actions bot

Loading

netlify bot commented Mar 20, 2026 •

edited

Loading

netlify bot commented Mar 20, 2026 •

edited

Loading

netlify bot commented Mar 20, 2026 •

edited

Loading