Use production build for frontend integration tests

[valerybugakov]

Problem statement

Currently, we use a development build to run our integration tests. It's beneficial for performance, but the way the application is loaded is different from what we have in the production environment: CSS is not extracted in a separate file, and many third-party library production optimizations are not applied.

Without code minimization, the build time won't change significantly, but we will be able to test our UI in an environment consistent with our production deployments.

Success criteria

It's possible to run integration tests on top of the production build of the web application.

Implementation details

1. The place where we create the integration tests context and mock the index.html file:

sourcegraph/client/web/src/integration/context.ts

Line 66 in 573a8bb

export const createWebIntegrationTestContext = async ({

2. Integration tests documentation
3. Let's use the NODE_ENV env variables to determine the type of build we want to use to run the integration tests

Time estimate

• Pull requests with ~450 lines changed should take 8 hours at maximum. Ping the reviewer in the spec pull request if time-consuming changes are required.
• Let's discuss the solution ideas early in the spec PR.

[github-actions]

Heads up @AlicjaSuska @umpox @valerybugakov @5h1rU @pdubroy - the "team/frontend-platform" label was applied to this issue.

[felixfbecker]

One big thing to consider is debuggability: E.g. when an error happens, can we get a stack trace that doesn't just point to a position in a minified bundle. Ideally, we can respect source maps. But there can be some errors and warnings e.g. by React that are not emitted in production mode, and potentially certain debug information (e.g. component names?).

The other aspect is CI build time, I think production builds took a lot longer to build. Maybe that has changed.

[gitstart-app]

Here is the GitStart Ticket for this issue: https://clients.gitstart.com/sourcegraph/1/tickets/SG-22831

[valerybugakov]

Because we recently bumped multiple times into issues with the unstable CSS order, we need to look into this issue to catch CSS bugs during our CI builds.