From 3918f82e14fbcc618ee20621e49582445755af07 Mon Sep 17 00:00:00 2001
From: Cameron Perera <cameron.perera@hashicorp.com>
Date: Tue, 22 Jul 2025 12:32:28 -0500
Subject: [PATCH] =?UTF-8?q?chore:=20=F0=9F=A4=96=20add=20DARK=5FMODE=20env?=
 =?UTF-8?q?=20variable=20to=20testem=20config=20(#2935)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

for admin and desktop
---
 ui/admin/README.md   | 25 ++++++++++++++-----------
 ui/admin/testem.js   |  4 ++++
 ui/desktop/README.md |  2 ++
 ui/desktop/testem.js |  4 ++++
 4 files changed, 24 insertions(+), 11 deletions(-)

diff --git a/ui/admin/README.md b/ui/admin/README.md
index 334b867ad..c2626cff0 100644
--- a/ui/admin/README.md
+++ b/ui/admin/README.md
@@ -6,15 +6,16 @@ The Admin UI for Boundary.
 <!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
 **Table of Contents**  *generated with [DocToc](https://github.com/thlorenz/doctoc)*
 
-- [Prerequisites](#prerequisites)
-- [Installation](#installation)
-- [Pnpm Commands](#pnpm-commands)
-- [Running / Development](#running--development)
-  - [Building for Production](#building-for-production)
-    - [Environment Variables](#environment-variables)
-  - [Running Tests](#running-tests)
-  - [Deploying](#deploying)
-- [Further Reading / Useful Links](#further-reading--useful-links)
+- [Admin UI](#admin-ui)
+  - [Prerequisites](#prerequisites)
+  - [Installation](#installation)
+  - [Pnpm Commands](#pnpm-commands)
+  - [Running / Development](#running--development)
+    - [Building for Production](#building-for-production)
+      - [Environment Variables](#environment-variables)
+    - [Running Tests](#running-tests)
+    - [Deploying](#deploying)
+  - [Further Reading / Useful Links](#further-reading--useful-links)
 
 <!-- END doctoc generated TOC please keep comment here to allow auto update -->
 
@@ -62,7 +63,7 @@ List of available project commands.  `pnpm run <command-name>`
 
 Before executing a build, be sure to set any environment variables necessary
 for your target environment (see next section).  To build this UI for
-production, run the following commads from this folder:
+production, run the following commands from this folder:
 
 ```bash
 pnpm install
@@ -79,11 +80,13 @@ These environment variables may be used to customized the build.
 | -------- | ------------- | ----------- |
 | `APP_NAME` | Application Name | The user-facing name of the application, appearing in titles, etc. |
 | `API_HOST` | | The host of the API, if different than UI (e.g. https://example.net:1234). |
+| `DARK_MODE` | | Enable (`true`) to set the test browser appearance to dark for running tests in dark mode. |
 
 ### Running Tests
 
-* `npm test` runs full tests in random order with coverage
+* `pnpm test` runs full tests in random order with coverage
 * `ember test --server`
+* `DARK_MODE=true ember test --server` runs tests in dark mode
 
 Keep in mind that tests are executed in random order.  This is intentional
 and helps to prevent hard-to-debug order dependencies among tests.
diff --git a/ui/admin/testem.js b/ui/admin/testem.js
index 3ac229155..d0d33ce78 100644
--- a/ui/admin/testem.js
+++ b/ui/admin/testem.js
@@ -11,6 +11,10 @@ module.exports = {
   browser_start_timeout: 120,
   browser_args: {
     Chrome: {
+      all: [
+        process.env.DARK_MODE ? '--enable-features=WebContentsForceDark' : null,
+        process.env.DARK_MODE ? '--force-dark-mode' : null,
+      ].filter(Boolean),
       ci: [
         // --no-sandbox is needed when running Chrome inside a container
         process.env.CI ? '--no-sandbox' : null,
diff --git a/ui/desktop/README.md b/ui/desktop/README.md
index d67714d55..bf45ca755 100644
--- a/ui/desktop/README.md
+++ b/ui/desktop/README.md
@@ -100,6 +100,7 @@ These environment variables may be used to customized the build.
 | `BYPASS_APP_UPDATER` | Disable app updater feature. For development use only. |
 | `DISABLE_WINDOW_CHROME` | Disable window chrome. For internal use only. |
 | `ENABLE_MIRAGE` | Enable (`true`) or disable (`false`) mirage. Default value is `true`. |
+| `DARK_MODE` | Enable (`true`) to set the test browser appearance to dark for running tests in dark mode. |
 
 ### Building for Production
 
@@ -137,6 +138,7 @@ These environment variables may be used to customized the build.
 ### Running Tests
 
 - `pnpm test` runs full tests in random order with coverage
+- `DARK_MODE=true ember test --server` runs tests in dark mode
 
 Keep in mind that tests are executed in random order.  This is intentional
 and helps to prevent hard-to-debug order dependencies among tests.
diff --git a/ui/desktop/testem.js b/ui/desktop/testem.js
index d25c8bcaa..fe81ed3d9 100644
--- a/ui/desktop/testem.js
+++ b/ui/desktop/testem.js
@@ -13,6 +13,10 @@ module.exports = {
   browser_start_timeout: 120,
   browser_args: {
     Chrome: {
+      all: [
+        process.env.DARK_MODE ? '--enable-features=WebContentsForceDark' : null,
+        process.env.DARK_MODE ? '--force-dark-mode' : null,
+      ].filter(Boolean),
       ci: [
         // --no-sandbox is needed when running Chrome inside a container
         process.env.CI ? '--no-sandbox' : null,