DynamicProto-JS icon indicating copy to clipboard operation
DynamicProto-JS copied to clipboard

Fix Angular SSR in Cloudflare Worker environments

Open Copilot opened this issue 9 months ago • 4 comments

Problem

DynamicProto-JS was causing issues in Angular Server-Side Rendering (SSR) environments, particularly in Cloudflare Workers, where:

  1. The library attempted to redefine the name property, which is not allowed in Cloudflare Worker environments
  2. This caused rendering to get stuck, making pages unresponsive

This issue was reported in Application Insights SDK (which depends on DynamicProto-JS) as ApplicationInsights-JS#2523.

Solution

This PR implements a clean solution by:

  1. Adding a _isServerSideRender() detection function that can identify server environments like Cloudflare Workers
  2. Modifying the dynamicProto function to:
    • Check if running in an SSR environment
    • Skip prototype modifications that cause issues in restricted environments
    • Still run the delegate function to ensure instance methods are set up

Implementation Details

The solution is minimally invasive:

  • Detects SSR environments by checking for missing window/document objects or Cloudflare Worker user agent
  • In SSR mode, runs the delegate function but skips the prototype chain manipulations
  • In browser environments, maintains full functionality as before

Documentation

  • Added a new "Server-Side Rendering Support" section to the README
  • Updated version to 2.0.4
  • Added release notes to RELEASES.md

This solution ensures that applications using DynamicProto-JS (including Application Insights) can operate properly in Angular SSR with Cloudflare Workers without requiring additional workarounds.

Fixes #95.

[!WARNING]

Firewall rules blocked me from connecting to one or more addresses

I tried to connect to the following addresses, but was blocked by firewall rules:

  • https://storage.googleapis.com/chromium-browser-snapshots/Linux_x64/756035/chrome-linux.zip
    • Triggering command: node install.js (http block)

If you need me to access, download, or install something from one of these locations, you can either:


💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

Copilot avatar May 19 '25 22:05 Copilot

the test files *.d.ts *.js and *.js.map should not be included in the PR

MSNev avatar May 19 '25 23:05 MSNev

the test files *.d.ts *.js and *.js.map should not be included in the PR

I've removed the test files from the PR in a3d8f27. The .d.ts, .js, and .js.map files were generated when testing the changes but shouldn't be included in the final PR.

Copilot avatar May 19 '25 23:05 Copilot

@MSNev Unfortunately I hit an unexpected error while processing your comment. I've automatically reported this to GitHub.

You can ask me to try again later by mentioning me in a new comment.

If you want to contact GitHub about this error, please mention the following identifier so they can better serve you: b78750d9-5cd7-4dd1-bd67-4eefbfbdf5a5

Sorry for the inconvenience!

Copilot avatar May 20 '25 01:05 Copilot

@MSNev Unfortunately I hit an unexpected error while processing your comment. I've automatically reported this to GitHub.

You can ask me to try again later by mentioning me in a new comment.

If you want to contact GitHub about this error, please mention the following identifier so they can better serve you: 5f78710d-dfef-419d-8d79-0c63ff86b69b

Sorry for the inconvenience!

Copilot avatar May 20 '25 01:05 Copilot