Skip to content

Rename window.ENV to reduce clashing with other scripts #1520

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Sep 4, 2025
Merged

Rename window.ENV to reduce clashing with other scripts #1520

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
22 changes: 9 additions & 13 deletions apps/cyberstorm-remix/app/root.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,7 @@ import {
} from "@thunderstore/ts-api-react/src/SessionContext";
import {
getPublicEnvVariables,
publicEnvVariables,
publicEnvVariablesType,
} from "cyberstorm/security/publicEnvVariables";
Comment on lines +41 to 42
Copy link

Choose a reason for hiding this comment

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

💡 Verification agent

🧩 Analysis chain

Repo-wide verification to catch stragglers after the rename

Scan for old window.ENV and nested .ENV usages; also ensure the new global is referenced where needed. This avoids runtime issues in un-touched routes/components.

Run:

🏁 Script executed:

#!/bin/bash
set -euo pipefail

# Old global or nested shape
rg -n -C2 -S -P '\bwindow\.ENV\b|publicEnvVariables\.ENV\b|ENV\.(VITE_|PUBLIC_)'

# New global usage exists
rg -n -C2 -S -P '\bwindow\.NIMBUS_PUBLIC_ENV\b'

# Catch typos like "Enviroment variables"
rg -n -C1 -S 'Enviroment variables'

Length of output: 102

🏁 Script executed:

#!/bin/bash

# Search for old global or nested ENV usages; ignore exit codes to continue scanning
rg -n -C2 -S -P '\bwindow\.ENV\b|publicEnvVariables\.ENV\b|ENV\.(VITE_|PUBLIC_)' || echo "✅ no old ENV usages found"

# Verify new global usage exists
rg -n -C2 -S -P '\bwindow\.NIMBUS_PUBLIC_ENV\b' || echo "⚠️ no new NIMBUS_PUBLIC_ENV references found"

# Catch common typo "Enviroment variables"
rg -n -C1 -S 'Enviroment variables' || echo "✅ no typo matches found"

Length of output: 1739

Fix typo in error messages
Change “Enviroment variables did not load correctly…” to “Environment variables did not load correctly…” in:

  • apps/cyberstorm-remix/cyberstorm/security/publicEnvVariables.ts (line 48)
  • apps/cyberstorm-remix/app/root.tsx (line 128)
🤖 Prompt for AI Agents 
In apps/cyberstorm-remix/cyberstorm/security/publicEnvVariables.ts around line
48 and apps/cyberstorm-remix/app/root.tsx around line 128, fix the typo in the
error message by replacing "Enviroment variables did not load correctly…" with
the correct spelling "Environment variables did not load correctly…" (preserve
punctuation and capitalization exactly as in the surrounding messages).

import { StorageManager } from "@thunderstore/ts-api-react/src/storage";

Expand All @@ -47,7 +47,7 @@ import { StorageManager } from "@thunderstore/ts-api-react/src/storage";

declare global {
interface Window {
ENV: publicEnvVariables;
NIMBUS_PUBLIC_ENV: publicEnvVariablesType;
Dapper: DapperTs;
nitroAds?: {
createAd: (
Expand Down Expand Up @@ -104,9 +104,7 @@ export async function loader() {
sessionId: undefined,
};
return {
publicEnvVariables: {
ENV: publicEnvVariables,
},
publicEnvVariables: publicEnvVariables,
currentUser: undefined,
config,
};
Expand Down Expand Up @@ -137,9 +135,7 @@ export async function clientLoader() {
const currentUser = await sessionTools.getSessionCurrentUser();
const config = sessionTools.getConfig(publicEnvVariables.VITE_API_URL);
return {
publicEnvVariables: {
ENV: publicEnvVariables,
},
publicEnvVariables: publicEnvVariables,
currentUser: currentUser.username ? currentUser : undefined,
config,
};
Expand Down Expand Up @@ -221,8 +217,8 @@ export function Layout({ children }: { children: React.ReactNode }) {
<body>
<script
dangerouslySetInnerHTML={{
__html: `window.ENV = ${JSON.stringify(
data.publicEnvVariables.ENV
__html: `window.NIMBUS_PUBLIC_ENV = ${JSON.stringify(
data.publicEnvVariables
)}`,
Comment on lines +220 to 222
Copy link

Choose a reason for hiding this comment

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

🛠️ Refactor suggestion

Harden the global: make it read-only and resilient; consider CSP

Prevent third-party scripts from mutating or overwriting the exposed env by defining it as non-writable + frozen; also don’t overwrite if already set. If you use a CSP, ensure this inline script is nonce’d or hashed.

Apply:

-            __html: `window.NIMBUS_PUBLIC_ENV = ${JSON.stringify(
-              data.publicEnvVariables
-            )}`,
+            __html: `(function(){if(!("NIMBUS_PUBLIC_ENV" in window)){Object.defineProperty(window,"NIMBUS_PUBLIC_ENV",{value:Object.freeze(${JSON.stringify(
+              data.publicEnvVariables
+            )}),writable:false,configurable:false,enumerable:true});}})();`,

Optional (CSP): add a nonce to this script tag consistent with your CSP setup.

📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
__html: `window.NIMBUS_PUBLIC_ENV = ${JSON.stringify(
data.publicEnvVariables
)}`,
__html: `(function(){
if (!("NIMBUS_PUBLIC_ENV" in window)) {
Object.defineProperty(window, "NIMBUS_PUBLIC_ENV", {
value: Object.freeze(${JSON.stringify(
data.publicEnvVariables
)}),
writable: false,
configurable: false,
enumerable: true
});
}
})();`,
🤖 Prompt for AI Agents 
In apps/cyberstorm-remix/app/root.tsx around lines 220-222, the inline script
currently assigns window.NIMBUS_PUBLIC_ENV directly which allows mutation or
overwrite; change it to only set the value if undefined, then Object.freeze the
object and use Object.defineProperty to make the global
non-writable/configurable so third-party scripts cannot mutate it; ensure the
script generation includes any CSP nonce or hash required by your CSP setup so
the inline script is allowed.

}}
/>
Expand All @@ -231,7 +227,7 @@ export function Layout({ children }: { children: React.ReactNode }) {
<Toast.Provider toastDuration={10000}>
<TooltipProvider>
<NavigationWrapper
domain={data.publicEnvVariables.ENV.VITE_API_URL || ""}
domain={data.publicEnvVariables.VITE_API_URL || ""}
currentUser={data?.currentUser}
/>
<div className="container container--x container--full island">
Expand Down Expand Up @@ -274,7 +270,7 @@ function App() {
const data = useRouteLoaderData<RootLoadersType>("root");
const dapper = new DapperTs(() => {
return {
apiHost: data?.publicEnvVariables.ENV.VITE_API_URL,
apiHost: data?.publicEnvVariables.VITE_API_URL,
sessionId: data?.config.sessionId,
};
});
Expand All @@ -284,7 +280,7 @@ function App() {
context={{
currentUser: data?.currentUser,
requestConfig: dapper.config,
domain: data?.publicEnvVariables.ENV.VITE_API_URL,
domain: data?.publicEnvVariables.VITE_API_URL,
dapper: dapper,
}}
/>
Expand Down
10 changes: 5 additions & 5 deletions apps/cyberstorm-remix/cyberstorm/security/publicEnvVariables.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,14 +11,14 @@ export type publicEnvVariablesKeys =

export type PublicPrefix<envVariable extends string> = `VITE_${envVariable}`;

export type publicEnvVariables = Partial<{
export type publicEnvVariablesType = Partial<{
[key in PublicPrefix<publicEnvVariablesKeys>]: string | undefined;
}>;

export function getPublicEnvVariables(
vars: PublicPrefix<publicEnvVariablesKeys>[]
): publicEnvVariables {
const returnedVars: publicEnvVariables = {};
): publicEnvVariablesType {
const returnedVars: publicEnvVariablesType = {};
if (import.meta.env.SSR) {
vars.forEach((envVar) => {
if (envVar.startsWith("VITE_") && envVar in process.env) {
Expand All @@ -27,8 +27,8 @@ export function getPublicEnvVariables(
});
} else {
vars.forEach((envVar) => {
if (envVar.startsWith("VITE_") && envVar in window.ENV) {
returnedVars[envVar] = window.ENV[envVar];
if (envVar.startsWith("VITE_") && envVar in window.NIMBUS_PUBLIC_ENV) {
returnedVars[envVar] = window.NIMBUS_PUBLIC_ENV[envVar];
}
});
Comment on lines 29 to 33
Copy link

Choose a reason for hiding this comment

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

🛠️ Refactor suggestion

Defensive access to window.NIMBUS_PUBLIC_ENV to prevent runtime errors

If the inline script fails to run (e.g., CSP), window.NIMBUS_PUBLIC_ENV will be undefined and in will throw. Also prefer own-property checks.

Apply:

-  } else {
-    vars.forEach((envVar) => {
-      if (envVar.startsWith("VITE_") && envVar in window.NIMBUS_PUBLIC_ENV) {
-        returnedVars[envVar] = window.NIMBUS_PUBLIC_ENV[envVar];
-      }
-    });
-  }
+  } else {
+    const publicEnv =
+      typeof window !== "undefined" && (window as any).NIMBUS_PUBLIC_ENV
+        ? ((window as any).NIMBUS_PUBLIC_ENV as Record<string, string | undefined>)
+        : {};
+    vars.forEach((envVar) => {
+      if (
+        envVar.startsWith("VITE_") &&
+        Object.prototype.hasOwnProperty.call(publicEnv, envVar)
+      ) {
+        returnedVars[envVar] = publicEnv[envVar];
+      }
+    });
+  }
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
vars.forEach((envVar) => {
if (envVar.startsWith("VITE_") && envVar in window.ENV) {
returnedVars[envVar] = window.ENV[envVar];
if (envVar.startsWith("VITE_") && envVar in window.NIMBUS_PUBLIC_ENV) {
returnedVars[envVar] = window.NIMBUS_PUBLIC_ENV[envVar];
}
});
} else {
const publicEnv =
typeof window !== "undefined" && (window as any).NIMBUS_PUBLIC_ENV
? ((window as any).NIMBUS_PUBLIC_ENV as Record<string, string | undefined>)
: {};
vars.forEach((envVar) => {
if (
envVar.startsWith("VITE_") &&
Object.prototype.hasOwnProperty.call(publicEnv, envVar)
) {
returnedVars[envVar] = publicEnv[envVar];
}
});
}
🤖 Prompt for AI Agents 
In apps/cyberstorm-remix/cyberstorm/security/publicEnvVariables.ts around lines
29 to 33, the code uses the `in` operator against `window.NIMBUS_PUBLIC_ENV`
which will throw if that global is undefined (e.g., CSP blocked the inline
script); change the logic to first defensively check that `window` and
`window.NIMBUS_PUBLIC_ENV` are defined (truthy) before iterating, and when
checking membership use an own-property check (e.g.,
Object.prototype.hasOwnProperty.call(window.NIMBUS_PUBLIC_ENV, envVar)) so you
avoid prototype-inherited keys and runtime errors; if the global is missing,
skip adding vars or fall back to an empty object.

}
Expand Down
Loading