test(wtr): add option to only run in one browser (#5685)

sometimes you just want to be quick about it

Author: wjhsf

packages/@lwc/integration-wtr/README.md

@@ -12,6 +12,8 @@ To run individual test files, provide them as CLI arguments. If using relative p
 
 Environment variables are used as controls to run tests in different modes (e.g native vs synthetic shadow, different API versions). The full list of controls is defined in [`helpers/options.js`](./helpers/options.js).
 
+To run tests only for a specific browser, set the `BROWSERS` environment variable. For example, `BROWSERS=chromium yarn test:wtr`.
+
 ## Architecture
 
 - `configs`: WTR configuration files. The main entrypoints are `integration.js` and `hydration.js`.

packages/@lwc/integration-wtr/configs/shared/browsers.js

@@ -45,10 +45,7 @@ export function getBrowsers(options) {
                   }),
               ];
     } else {
-        return [
-            playwrightLauncher({ product: 'chromium' }),
-            playwrightLauncher({ product: 'firefox' }),
-            playwrightLauncher({ product: 'webkit' }),
-        ];
+        const browsers = options.BROWSERS?.split(',') ?? ['chromium', 'firefox', 'webkit'];
+        return browsers.map((product) => playwrightLauncher({ product }));
     }
 }

packages/@lwc/integration-wtr/helpers/options.js

@@ -75,6 +75,12 @@ export const COVERAGE_DIR_FOR_OPTIONS =
         .map(([key, val]) => `${key}=${val}`)
         .join('/') || 'no-options';
 
+/**
+ * Comma-delimited list of browsers to use. Can be any of `chromium`, `firefox`, or `webkit`.
+ * Does not apply when using SauceLabs.
+ */
+export const BROWSERS = process.env.BROWSERS?.replace(/\W+/g, ',');
+
 // --- CI config --- //
 
 /** Whether or not to report coverage. Currently unused. */