Source code was not found using electron-webpack

[raz-sinay]

• [x] Review the documentation: https://docs.sentry.io/platforms/javascript/electron/
• [x] Search for existing issues: https://github.com/getsentry/sentry-electron/issues
• [x] Use the latest release: https://github.com/getsentry/sentry-electron/releases
• [x] Provide a link to the affected event from your Sentry account

Versions + Platform

• [x] SDK version - @sentry/[email protected]
• [x] Electron version - [email protected]
• [x] Platform - Windows

Description

I'm building my electron project using electron-webpack. When trying to integrate sentry source-maps into the project, I'm not seeing the source code in the issues.

• My artifacts are being uploaded and appear in the releases artifacts.
• I have tried to use different url paths for the artifacts, none of them worked, I still cannot see the actual source-code inside the issue frames.

my event json:

``` { "event_id": "b2955d05c6fc43eb8afdb118953ffba4", "project": 5874033, "release": "0.0.6", "dist": null, "platform": "javascript", "message": "", "datetime": "2021-07-21T14:26:57.853000Z", "tags": [ [ "browser.name", "Chrome" ], [ "chrome", "Chrome 80.0.3987.158" ], [ "chrome.name", "Chrome" ], [ "device.family", "Desktop" ], [ "environment", "production" ], [ "event_type", "javascript" ], [ "handled", "yes" ], [ "level", "error" ], [ "mechanism", "instrument" ], [ "node", "Node 12.13.0" ], [ "node.name", "Node" ], [ "os", "Windows 10.0.19042" ], [ "os.name", "Windows" ], [ "runtime", "Electron 8.2.0" ], [ "runtime.name", "Electron" ], [ "release", "0.0.6" ], [ "url", "app:///index.html" ] ], "_meta": { "user": { "ip_address": { "": { "rem": [ [ "@anything:remove", "x" ] ] } } } }, "_metrics": { "bytes.ingested.event": 5765, "bytes.stored.event": 16853, "flag.processing.error": true }, "breadcrumbs": { "values": [ { "timestamp": 1626877617.367, "type": "ui", "category": "electron", "level": "info", "message": "app.will-finish-launching" }, { "timestamp": 1626877617.368, "type": "ui", "category": "electron", "level": "info", "message": "app.ready" }, { "timestamp": 1626877617.388, "type": "ui", "category": "electron", "level": "info", "message": "app.session-created" }, { "timestamp": 1626877617.392, "type": "default", "category": "console", "level": "warning", "message": "(electron) The default value of app.allowRendererProcessReuse is deprecated, it is currently \"false\". It will change to be \"true\" in Electron 9. For more information please check https://github.com/electron/electron/issues/18397" }, { "timestamp": 1626877617.392, "type": "ui", "category": "electron", "level": "info", "message": "app.web-contents-created" }, { "timestamp": 1626877617.398, "type": "ui", "category": "electron", "level": "info", "message": "app.browser-window-created" }, { "timestamp": 1626877617.444, "type": "ui", "category": "electron", "level": "info", "message": "app.browser-window-focus" }, { "timestamp": 1626877617.607, "type": "ui", "category": "electron", "level": "info", "message": "app.gpu-info-update" } ] }, "contexts": { "app": { "app_name": "electron-webpack-quick-start", "app_version": "0.0.6", "type": "app" }, "browser": { "name": "Chrome", "type": "browser" }, "chrome": { "name": "Chrome", "version": "80.0.3987.158", "type": "runtime" }, "device": { "family": "Desktop", "arch": "x64", "type": "device" }, "electron": { "crashed_process": "renderer[1]", "crashed_url": "app:///index.html", "type": "electron" }, "node": { "name": "Node", "version": "12.13.0", "type": "runtime" }, "os": { "name": "Windows", "version": "10.0.19042", "type": "os" }, "runtime": { "name": "Electron", "version": "8.2.0", "type": "runtime" } }, "culprit": "?(src/renderer/App)", "environment": "production", "errors": [ { "type": "js_no_source", "url": "app:///renderer.js" }, { "type": "js_no_source", "url": "app:///webpack/bootstrap" }, { "type": "js_no_source", "url": "app:///src/renderer/index.tsx" }, { "type": "js_no_source", "url": "app:///src/renderer/App.tsx" } ], "exception": { "values": [ { "type": "ReferenceError", "value": "myUndefinedFunc is not defined", "stacktrace": { "frames": [ { "module": "renderer", "filename": "app:///renderer.js", "abs_path": "app:///renderer.js", "lineno": 1, "colno": 1266, "in_app": true }, { "module": "webpack/bootstrap", "filename": "app:///webpack/bootstrap", "abs_path": "app:///webpack/bootstrap", "lineno": 83, "colno": 10, "in_app": true }, { "function": "__webpack_require__", "module": "webpack/bootstrap", "filename": "app:///webpack/bootstrap", "abs_path": "app:///webpack/bootstrap", "lineno": 19, "colno": 22, "in_app": true }, { "function": "Object.call", "module": "renderer", "filename": "app:///renderer.js", "abs_path": "app:///renderer.js", "lineno": 1, "colno": 1440, "in_app": true }, { "function": "__webpack_require__", "module": "webpack/bootstrap", "filename": "app:///webpack/bootstrap", "abs_path": "app:///webpack/bootstrap", "lineno": 19, "colno": 22, "in_app": true }, { "function": "Module.call", "module": "src/renderer/index", "filename": "app:///src/renderer/index.tsx", "abs_path": "app:///src/renderer/index.tsx", "lineno": 11, "colno": 10, "in_app": true }, { "function": "Object.render", "module": "react-dom/cjs/react-dom.development", "filename": "app:///node_modules/react-dom/cjs/react-dom.development.js", "abs_path": "app:///node_modules/react-dom/cjs/react-dom.development.js", "lineno": 26103, "colno": 10, "in_app": true }, { "function": "legacyRenderSubtreeIntoContainer", "module": "react-dom/cjs/react-dom.development", "filename": "app:///node_modules/react-dom/cjs/react-dom.development.js", "abs_path": "app:///node_modules/react-dom/cjs/react-dom.development.js", "lineno": 26020, "colno": 5, "in_app": true }, { "function": "unbatchedUpdates", "module": "react-dom/cjs/react-dom.development", "filename": "app:///node_modules/react-dom/cjs/react-dom.development.js", "abs_path": "app:///node_modules/react-dom/cjs/react-dom.development.js", "lineno": 22431, "colno": 12, "in_app": true }, { "module": "react-dom/cjs/react-dom.development", "filename": "app:///node_modules/react-dom/cjs/react-dom.development.js", "abs_path": "app:///node_modules/react-dom/cjs/react-dom.development.js", "lineno": 26021, "colno": 7, "in_app": true }, { "function": "updateContainer", "module": "react-dom/cjs/react-dom.development", "filename": "app:///node_modules/react-dom/cjs/react-dom.development.js", "abs_path": "app:///node_modules/react-dom/cjs/react-dom.development.js", "lineno": 25482, "colno": 3, "in_app": true }, { "function": "scheduleUpdateOnFiber", "module": "react-dom/cjs/react-dom.development", "filename": "app:///node_modules/react-dom/cjs/react-dom.development.js", "abs_path": "app:///node_modules/react-dom/cjs/react-dom.development.js", "lineno": 21881, "colno": 7, "in_app": true }, { "function": "performSyncWorkOnRoot", "module": "react-dom/cjs/react-dom.development", "filename": "app:///node_modules/react-dom/cjs/react-dom.development.js", "abs_path": "app:///node_modules/react-dom/cjs/react-dom.development.js", "lineno": 22293, "colno": 18, "in_app": true }, { "function": "renderRootSync", "module": "react-dom/cjs/react-dom.development", "filename": "app:///node_modules/react-dom/cjs/react-dom.development.js", "abs_path": "app:///node_modules/react-dom/cjs/react-dom.development.js", "lineno": 22670, "colno": 7, "in_app": true }, { "function": "workLoopSync", "module": "react-dom/cjs/react-dom.development", "filename": "app:///node_modules/react-dom/cjs/react-dom.development.js", "abs_path": "app:///node_modules/react-dom/cjs/react-dom.development.js", "lineno": 22707, "colno": 5, "in_app": true }, { "function": "performUnitOfWork", "module": "react-dom/cjs/react-dom.development", "filename": "app:///node_modules/react-dom/cjs/react-dom.development.js", "abs_path": "app:///node_modules/react-dom/cjs/react-dom.development.js", "lineno": 22779, "colno": 12, "in_app": true }, { "function": "beginWork$1", "module": "react-dom/cjs/react-dom.development", "filename": "app:///node_modules/react-dom/cjs/react-dom.development.js", "abs_path": "app:///node_modules/react-dom/cjs/react-dom.development.js", "lineno": 23964, "colno": 7, "in_app": true }, { "function": "invokeGuardedCallback", "module": "react-dom/cjs/react-dom.development", "filename": "app:///node_modules/react-dom/cjs/react-dom.development.js", "abs_path": "app:///node_modules/react-dom/cjs/react-dom.development.js", "lineno": 4056, "colno": 31, "in_app": true }, { "function": "Object.invokeGuardedCallbackDev", "module": "react-dom/cjs/react-dom.development", "filename": "app:///node_modules/react-dom/cjs/react-dom.development.js", "abs_path": "app:///node_modules/react-dom/cjs/react-dom.development.js", "lineno": 3994, "colno": 16, "in_app": true }, { "function": "HTMLUnknownElement.sentryWrapped", "module": "@sentry/browser/src/helpers", "filename": "app:///node_modules/@sentry/browser/src/helpers.ts", "abs_path": "app:///node_modules/@sentry/browser/src/helpers.ts", "lineno": 87, "colno": 17, "in_app": true }, { "function": "HTMLUnknownElement.callCallback", "module": "react-dom/cjs/react-dom.development", "filename": "app:///node_modules/react-dom/cjs/react-dom.development.js", "abs_path": "app:///node_modules/react-dom/cjs/react-dom.development.js", "lineno": 3945, "colno": 14, "in_app": true }, { "function": "beginWork", "module": "react-dom/cjs/react-dom.development", "filename": "app:///node_modules/react-dom/cjs/react-dom.development.js", "abs_path": "app:///node_modules/react-dom/cjs/react-dom.development.js", "lineno": 19049, "colno": 16, "in_app": true }, { "function": "mountIndeterminateComponent", "module": "react-dom/cjs/react-dom.development", "filename": "app:///node_modules/react-dom/cjs/react-dom.development.js", "abs_path": "app:///node_modules/react-dom/cjs/react-dom.development.js", "lineno": 17811, "colno": 13, "in_app": true }, { "function": "renderWithHooks", "module": "react-dom/cjs/react-dom.development", "filename": "app:///node_modules/react-dom/cjs/react-dom.development.js", "abs_path": "app:///node_modules/react-dom/cjs/react-dom.development.js", "lineno": 14985, "colno": 18, "in_app": true }, { "module": "src/renderer/App", "filename": "app:///src/renderer/App.tsx", "abs_path": "app:///src/renderer/App.tsx", "lineno": 6, "colno": 10, "in_app": true } ] }, "mechanism": { "type": "instrument", "handled": true, "data": { "function": "addEventListener", "handler": "callCallback", "target": "EventTarget" } } } ] }, "extra": { "arguments": [ { "currentTarget": "react", "isTrusted": "[object Event]", "target": "react", "type": "react-invokeguardedcallback" } ], "crashed_process": "browser" }, "fingerprint": [ "{{ default }}" ], "grouping_config": { "enhancements": "eJybzDRxY3J-bm5-npWRgaGlroGxrpHxBABcYgcZ", "id": "newstyle:2019-10-29" }, "hashes": [ "08c53b67a60bd25d2d4bf8ab3bb276f4" ], "key_id": "1719758", "level": "error", "location": "app:///node_modules/react-dom/cjs/react-dom.development.js", "logger": "", "metadata": { "filename": "app:///node_modules/react-dom/cjs/react-dom.development.js", "function": "renderWithHooks", "type": "ReferenceError", "value": "myUndefinedFunc is not defined" }, "received": 1626877617.857453, "request": { "url": "app:///index.html" }, "sdk": { "name": "sentry.javascript.electron", "version": "2.5.1", "packages": [ { "name": "npm:@sentry/electron", "version": "2.5.1" } ] }, "timestamp": 1626877617.853, "title": "ReferenceError: myUndefinedFunc is not defined", "type": "error", "user": { "ip_address": null, "geo": { "country_code": "IL", "city": "Herzliya", "region": "Israel" } }, "version": "7" } ```

my artifacts appears like so:

I have tried to change the paths into many other forms using the urlPrefix property inside the plugin options, none of them worked.

I have also tried to use the RewriteFrames integration in order to change the abs_path, but I still couldn't find the match.

I reproduced the issue based upon electron-webpack-quick-start Just added react, typescript, sentry integration, and sentry webpack plugin. (replace MY_DSN, ORGANIZATION and AUTH_TOKEN with your project's info, and the problem should reproduce.)

Thanks in advance!

[timfish]

I'm not really sure how electron-webpack works and I don't know how you're configuring the Sentry webpack plugin to work with it since you haven't show this.

It looks like electron-webpack is actually running webpack twice with two different configurations, once for the main process and once for the renderer. The paths don't appear to match up at all so electron-webpack might just not be compatible with the Sentry webpack plugin.

[raz-sinay]

I have provided the reproduction repository link. You can view it here:

https://github.com/raz-sinay/electron-webpack-sourcemaps

You can see my plugin configuration and play with it if you like. Please try to assist us, lack of source maps damages our ability to understand the source of our issues, which is the main reason we're using Sentry.

בתאריך יום ב׳, 26 ביולי 2021, 16:50, מאת Tim Fish @.***

:

I'm not really sure how electron-webpack works and I don't know how you're configuring the Sentry webpack plugin to work with it since you haven't show this.

It looks like electron-webpack is actually running webpack twice with two different configurations, once for the main process and once for the renderer. The paths don't appear to match up at all so electron-webpack might just not be compatible with the Sentry webpack plugin.

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/getsentry/sentry-electron/issues/354#issuecomment-886720499, or unsubscribe https://github.com/notifications/unsubscribe-auth/ADTE2M6QOLZHYWHVSI6PKJ3TZVRYZANCNFSM5AYHEIJA .

[AbhiPrasad]

Closing this issue for cleanup. Please re-open if this still applies. Thanks!