Skip to content

Conversation

@0xjorgen
Copy link
Contributor

@0xjorgen 0xjorgen commented Dec 9, 2025

Motivation:
Fast unit tests are crucial for a good test writing experience. With AI, quick tests also let us iterate faster and run unit tests as part of workflow. Vite offers modern, easy-to-use testing tools and is notably faster.

Modification:
Migrate test runner from Jest to Vitest for significantly improved performance:

  • Frontend tests: 77.9s → 2.1s (37x faster)
  • API tests: 84.4s → 7.6s (11x faster)

ci
before
Screenshot 2025-12-09 at 11 41 03 UTC@2x

after:
Screenshot 2025-12-09 at 11 40 48 UTC@2x

Changes:

  • Add vitest.frontend.config.ts and vitest.api.config.ts
  • Use node environment by default, jsdom only for DOM-requiring tests
  • Convert jest.mock/fn/spyOn to vi.mock/fn/spyOn across 17 test files
  • Add setup.vitest.ts with TextEncoder polyfill
  • Inline @across-protocol/* packages to resolve ESM issues
  • Update package.json test scripts to use vitest

Co-Authored-By: Claude noreply@anthropic.com

@linear
Copy link

linear bot commented Dec 9, 2025

FE-213 Migrate to Vitest

@vercel
Copy link

vercel bot commented Dec 9, 2025

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Review Updated (UTC)
app-frontend-v3 Ready Ready Preview, Comment Dec 16, 2025 2:32pm
sepolia-frontend-v3 Ready Ready Preview, Comment Dec 16, 2025 2:32pm

Migrate test runner from Jest to Vitest for significantly improved performance:
- Frontend tests: 77.9s → 2.1s (37x faster)
- API tests: 84.4s → 7.6s (11x faster)

Changes:
- Add vitest.frontend.config.ts and vitest.api.config.ts
- Use node environment by default, jsdom only for DOM-requiring tests
- Convert jest.mock/fn/spyOn to vi.mock/fn/spyOn across 17 test files
- Add setup.vitest.ts with TextEncoder polyfill
- Inline @across-protocol/* packages to resolve ESM issues
- Update package.json test scripts to use vitest

Co-Authored-By: Claude <noreply@anthropic.com>
expect(token).toBeUndefined();
});

it("should return undefined for a zero address if the native token is not in the token map", () => {
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this test messed up the other with the nested mock.
If it is important, we cen do the work of replacing it with another approach

export default defineConfig({
plugins: [react(), tsconfigPaths(), svgr()],
test: {
environment: "node",
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

is it possible to use this part of the config to replace the // @vitest-environment jsdom directive?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah, if we add jsom here, we need to add this to the setup.vitest.ts file

// JSDom + Vitest don't play well with each other. Long story short - default
// TextEncoder produces Uint8Array objects that are _different_ from the global
// Uint8Array objects, so some functions that compare their types explode.
// https://github.com/vitest-dev/vitest/issues/4043#issuecomment-1905172846
class ESBuildAndJSDOMCompatibleTextEncoder extends TextEncoder {
  constructor() {
    super();
  }

  encode(input: string) {
    if (typeof input !== "string") {
      throw new TypeError("`input` must be a string");
    }

    const decodedURI = decodeURIComponent(encodeURIComponent(input));
    const arr = new Uint8Array(decodedURI.length);
    const chars = decodedURI.split("");
    for (let i = 0; i < chars.length; i++) {
      arr[i] = decodedURI[i].charCodeAt(0);
    }
    return arr;
  }
}

global.TextEncoder = ESBuildAndJSDOMCompatibleTextEncoder;

I suggest we keep the directives for now since so few tests depend on the dom env. If we split the repo in the future to only have frontend files, then it makes sense to have global dom environent

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

okay in that case let's stick with the directives 👍

package.json Outdated
"eslint-plugin-storybook": "^0.6.15",
"happy-dom": "^20.0.11",
"husky": "^8.0.0",
"jest": "^29.5.0",
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

can we delete jest and its plugins?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Jes(t)!

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

that's wonderfully cheesy 😆

@vercel
Copy link

vercel bot commented Dec 11, 2025

Deployment failed with the following error:

Hobby accounts are limited to daily cron jobs. This cron expression (* * * * *) would run more than once per day. Upgrade to the Pro plan to unlock all Cron Jobs features on Vercel.

Learn More: https://vercel.link/3Fpeeb1

# Conflicts:
#	test/api/_bridges/cctp-sponsored/utils/signing.test.ts
#	test/api/_bridges/cctp/strategy.test.ts
#	test/api/_bridges/oft-sponsored/utils/signing.test.ts
#	test/api/_bridges/sponsored-intent/common.test.ts
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants