JS Client SDK uses `new Function(...)` and breaks with strict CSP (no 'unsafe-eval') in Angular

[gomezcabo]

Is this a support request?
Yes

Describe the bug
When enabling a strict Content Security Policy (CSP) in an Angular application (via autoCsp, i.e., an auto-generated CSP that disallows 'unsafe-eval'), the app fails to load as soon as the LaunchDarkly JS Client SDK is included. The browser reports a CSP violation caused by use of the Function constructor. The stack trace points to a new Function("return this") call within the SDK bundle, which is blocked by CSP and prevents Angular from bootstrapping.

To reproduce

1. Create a new Angular app and add the LaunchDarkly JS Client SDK:

npx @angular/cli@latest new ld-csp-repro --routing=false --style=scss
cd ld-csp-repro
npm install launchdarkly-js-client-sdk@<X.Y.Z>

2. Initialize the SDK early in app startup (e.g., main.ts or an app-level service invoked during bootstrap):

// main.ts (example)
import { initialize } from 'launchdarkly-js-client-sdk';

const ldClient = initialize('<YOUR_CLIENT_SIDE_ID>', {
  key: 'example-user-key',
  anonymous: true,
});

ldClient.on('ready', () => {
  console.log('LD ready');
});

3. Enable a strict CSP that does not include 'unsafe-eval' (either via server headers or Angular’s autoCsp). For example:

Content-Security-Policy:
  default-src 'self';
  script-src 'self' 'nonce-{{RANDOM_NONCE}}';
  connect-src 'self' https://*.launchdarkly.com https://clientstream.launchdarkly.com https://events.launchdarkly.com;
  img-src 'self' data:;
  style-src 'self' 'nonce-{{RANDOM_NONCE}}';
  object-src 'none';

(Note: there is no 'unsafe-eval' in script-src.)
4. Run the app and open it in the browser.
5. Observe that the app fails to load and a CSP error appears in the console referencing a blocked eval/Function call from the LaunchDarkly SDK.

Expected behavior
The browser build of the SDK should be compatible with strict CSP (no 'unsafe-eval') and avoid new Function(...) or other eval-like constructs. The application should load normally with CSP enforced.

Logs
Example console output (Chrome):

Uncaught EvalError: Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src 'strict-dynamic' 'sha256-xxxxx

Angular then fails to bootstrap due to the uncaught error.

SDK version
launchdarkly-js-client-sdk <3.9.0>

Language version, developer tools

• Angular 20
• TypeScript 5.8.3
• Node 20
• Build system: Angular CLI 19.2.0

OS/platform

• Browser(s): Chrome 141.0.7390.108
• OS: macOS 14.5

Additional context

• Allowing 'unsafe-eval' in script-src makes the issue disappear, but that’s not acceptable for our security posture.
• The pattern new Function("return this") is typically used to obtain a global object reference, but it violates strict CSP. Modern browsers provide globalThis/self in the web context without eval-like behavior.
• A CSP-compliant resolution would be to rely on globalThis/self in the browser build (and fall back to safe checks per environment) rather than using the Function constructor.
• I can provide a minimal reproduction repository if helpful: <link to repro, if available>.

Thanks in advance for taking a look!

[kinyoklion]

Hello @gomezcabo,

Thank you for the report. Do you have any additional context about where you are seeing this reported from. I've not done a deep inspection yet, but cursorily I don't see any code doing this in the client SDK bundle.

Thank you,
Ryan

[github-actions]

This issue is marked as stale because it has been open for 30 days without activity. Remove the stale label or comment, or this will be closed in 7 days.