edx / edx-arch-experiments

A plugin to include applications under development by the architecture team at edx
GNU Affero General Public License v3.0
0 stars 3 forks source link

[DD] Upload source maps for legacy JS code (LMS, CMS) #689

Open jristau1984 opened 2 weeks ago

jristau1984 commented 2 weeks ago

Please upload source maps for legacy JS in LMS and CMS. This is needed for connecting frontend errors to code.

Example error with this issue Image

Slack conversation containing info and updates

BilalQamar95 commented 4 days ago

It seems that currently there are no source maps for Django templates (inline scripts). Generating source maps for legacy JavaScript in LMS and CMS is more complex as compared to React MFEs due to the nature of Django templates with inline scripts and styles. Unlike React, where the code is modular and managed through a build system like Webpack, Django templates often (specifically in this case) contain embedded scripts (and styles) that are compiled and rendered at runtime. This complicates the extraction and generation of source maps, as inline code does not follow the same straightforward bundling process as external JavaScript files.

To generate source maps for Django templates, we would need to extract Inline Scripts/Styles to seperate files, bundle & generate source maps using a build tool like Webpack then re-inject processed files in django templates to ensure proper source map usage. While extracting inline scripts seems to be the most straight forward solution, there are alternatives that are comparatively more complex & less maintainable. While these steps are manageable, they introduce additional overhead compared to the simpler process used for React MFEs, where source maps are automatically generated during the build process.

Also it was highlighted during team discussion and worth nothing that in New Relic we did not have source maps for legacy LMS and CMS code. The goal of the migration was to replicate all the functionalities available in New Relic within Datadog and in such a case providing source maps for legacy code in Datadog could be considered an enhancement, offering improved error tracking and debugging capabilities for our legacy systems.