[Module Federation] module_metadata is not injected to the stack frames

grgol commented 1 month ago

Is there an existing issue for this?

[x] I have checked for existing issues https://github.com/getsentry/sentry-javascript/issues
[x] I have reviewed the documentation https://docs.sentry.io/
[x] I am using the latest SDK release https://github.com/getsentry/sentry-javascript/releases

How do you use Sentry?

Sentry Saas (sentry.io)

Which SDK are you using?

@sentry/vue

SDK Version

8.30.0

Framework Version

@sentry/vue 8.30.0 and @sentry/webpack-plugin ^2.22.4

Link to Sentry event

No response

Reproduction Example/SDK Setup

Hello, I'm trying to setup sentry monitoring for remotes following the documentation. All of my remotes and host applications run on Vue 3 and Webpack 5. My problem is that, there is no module_metadata in any error I trigger from remote.

I also tried using @sentry/browser SDK but the result was the same

Here is an example: link

I assume it is a bug, but maybe I do something wrong?

Steps to Reproduce

Run yarn install
In one terminal run, yarn start:host and in another, yarn start:remote
Click on the Click me button to trigger error
Error should be displayed by console.log from beforeSend hook

Expected Result

There is a module_metadata injected into one of the stack frames

Actual Result

There is nomodule_metadata injected in stack frames

andreiborza commented 1 month ago

Hi @grgol , thanks for writing in.

Unfortunate I'm having trouble running your example. I don't see any beforeSend logs. I think this is because the event processor completely drops the event (for reasons I don't know yet).

Could you please double check that the reproduction stackblitz is working and then remove your dsns again?

Also, while at it, please show the contents of window._sentryModuleMetadata.

Thanks!

grgol commented 1 month ago

Hello @andreiborza, thanks for the quick response

As I testing the code on my local machine, I noticed the same problem with beforeSend. I see that the error is dropped due to: Event processor "InboundFilters" dropped event

As for the content of window._sentryModuleMetadata on my local machine, it is the following:

{
  "Error\n    at http://localhost:3002/remoteEntry.js:15:53": {
      "dsn": "https://b6cb5559d9b1ce0d499813d3d45e4e28@o130295.ingest.us.sentry.io/4505872863068160"
  },
  "Error\n    at http://localhost:3002/src_index_js.bundle.js:15:53": {
      "dsn": "https://b6cb5559d9b1ce0d499813d3d45e4e28@o130295.ingest.us.sentry.io/4505872863068160"
  }
}

andreiborza commented 1 month ago

@grgol but you don't see that dropped event log elsewhere? What's the difference between where you see and don't see it?

grgol commented 1 month ago

I now removed the InboundFilters integration from the example and now I can see the event displayed, here it is:

{
    "message": "Script error.",
    "exception": {
        "values": [
            {
                "value": "Script error.",
                "type": "Error",
                "mechanism": {
                    "type": "onerror",
                    "handled": false,
                    "synthetic": true
                },
                "stacktrace": {
                    "frames": [
                        {
                            "colno": 0,
                            "filename": "http://localhost:3001/",
                            "function": "?",
                            "in_app": true,
                            "lineno": 0
                        }
                    ]
                }
            }
        ]
    },
    "level": "error",
    "platform": "javascript",
    "request": {
        "url": "http://localhost:3001/",
        "headers": {
            "Referer": "http://localhost:3001/",
            "User-Agent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/126.0.0.0 Safari/537.36"
        }
    },
    "event_id": "588ada8361ac4a52a71169961d1fbd86",
    "timestamp": 1726736176.651,
    "environment": "production",
    "release": "1.0.0",
    "sdk": {
        "integrations": [
            "FunctionToString",
            "TryCatch",
            "Breadcrumbs",
            "GlobalHandlers",
            "LinkedErrors",
            "Dedupe",
            "HttpContext",
            "ModuleMetadata"
        ],
        "name": "sentry.javascript.browser",
        "version": "7.119.0",
        "packages": [
            {
                "name": "npm:@sentry/browser",
                "version": "7.119.0"
            }
        ]
    },
    "breadcrumbs": [
        {
            "timestamp": 1726736175.537,
            "category": "console",
            "data": {
                "arguments": [
                    "[webpack-dev-server] Server started: Hot Module Replacement enabled, Live Reloading enabled, Progress disabled, Overlay enabled."
                ],
                "logger": "console"
            },
            "level": "info",
            "message": "[webpack-dev-server] Server started: Hot Module Replacement enabled, Live Reloading enabled, Progress disabled, Overlay enabled."
        },
        {
            "timestamp": 1726736175.537,
            "category": "console",
            "data": {
                "arguments": [
                    "[HMR] Waiting for update signal from WDS..."
                ],
                "logger": "console"
            },
            "level": "log",
            "message": "[HMR] Waiting for update signal from WDS..."
        }
    ],
    "contexts": {
        "trace": {
            "trace_id": "a1409647820f47f1a44b86d14f55d48c",
            "span_id": "abf854d2656b132e"
        }
    }
}

This error in provided environment is being droped because it is an Script error from domain with different port I think. I also updated stackblitz example

andreiborza commented 1 month ago

@grgol can you try without using the dev-server and instead run build and preview? Are you still not getting module metadata injected then?

grgol commented 1 month ago

Hi @andreiborza I think I figured this out. The module_metadata field was missing due to lack of the devtool: "source-map" setting in remote's webpack config. I did not find any mention about this requirement in sentry documents. Is there a way to use devtool: "hidden-source-map" instead id production env and make it work?

I updated StackBlitz example and now it works

andreiborza commented 1 month ago

@grgol awesome, good find! hidden-source-map should also work.

I'll add this requirement to the docs.

getsentry / sentry-javascript