Easily switch between multiple backends

[buberdds]

Currently, all Playwrights mocks are bound to oasisscan. Switching app backend should be more flexible.

Options:

1. build app with oasisscan backend when running e2e (or any that we thing is primary)
2. each backend can provide its own api mocks and we can run playwright with the same env used to build the app
3. remove api-transaction-methods.cy.ts ? Unhandled txs are rendered as Unrecognized after all, v2 does not provide types for tx methods

[lukaw3d]

I would modify it in runtime in playwright, and incrementally add some tests with mocks for nexus

either addInitScript

in test use https://playwright.dev/docs/api/class-page#page-add-init-script

await page.addInitScript(() => window.REACT_APP_BACKEND = 'nexus')
await page.goto('/')

in code

export const backend = () => window.REACT_APP_BACKEND || process.env.REACT_APP_BACKEND || BackendAPIs.OasisMonitor

or localStorage

in test do what we do for addPersistedStorageV1 (open non-javascripty page, set storage, open javascripty)

await page.goto('/app.webmanifest')
await page.evaluate(() => window.localStorage.REACT_APP_BACKEND = 'nexus');
await page.goto('/')

in code

export const backend = () => window.localStorage.REACT_APP_BACKEND || process.env.REACT_APP_BACKEND || BackendAPIs.OasisMonitor

maybe these should just be part of mockApi, and rename it to mockApiOasisscan 🤷

[lukaw3d]

Doesn't api-transaction-methods.cy.ts help us if v2 doesn't provide types for tx methods?

[buberdds]

cypress test is not a blooker atm. moved it to #2086