compile error when included in vscode extension

[sapsari]

Is there an existing issue for this?

• I have checked for existing issues https://github.com/getsentry/sentry-javascript/issues
• I have reviewed the documentation https://docs.sentry.io/
• 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/browser

SDK Version

8.32.0

Framework Version

vscode 1.75.0

Link to Sentry event

No response

Reproduction Example/SDK Setup

No response

Steps to Reproduce

Trying to use Sentry in a VSCode extension.
https://github.com/getsentry/sentry-docs/blob/master/docs/platforms/javascript/common/best-practices/shared-environments.mdx
Doc above covers my case, so I installed sentry/browser via npm with:
npm install @sentry/browser --save

When I add the sample code in the documentation to the "extension.ts" file, getting 13 compile errors, appending some at the end

Am I missing a dependency, if so which one, or should I use another library instead of browser?

Also appending package.json at the end

[{
"resource": "/d:/Develop/UnityCodeAssist/src/UCA VS Code/node_modules/@sentry-internal/feedback/build/npm/types/core/components/Actor.d.ts",
"owner": "typescript",
"code": "2304",
"severity": 8,
"message": "Cannot find name 'ShadowRoot'.",
"source": "ts",
"startLineNumber": 4,
"startColumn": 13,
"endLineNumber": 4,
"endColumn": 23
}]

[{
"resource": "/d:/Develop/UnityCodeAssist/src/UCA VS Code/node_modules/@sentry-internal/replay-canvas/build/npm/types/canvas.d.ts",
"owner": "typescript",
"code": "2304",
"severity": 8,
"message": "Cannot find name 'HTMLCanvasElement'.",
"source": "ts",
"startLineNumber": 4,
"startColumn": 32,
"endLineNumber": 4,
"endColumn": 32
}]

[{
"resource": "/d:/Develop/UnityCodeAssist/src/UCA VS Code/node_modules/@sentry-internal/replay/build/npm/types/types/performance.d.ts",
"owner": "typescript",
"code": "2749",
"severity": 8,
"message": "'PerformanceResourceTiming' refers to a value, but is being used as a type here. Did you mean 'typeof PerformanceResourceTiming'?",
"source": "ts",
"startLineNumber": 2,
"startColumn": 60,
"endLineNumber": 2,
"endColumn": 60
}]

{
"name": "uca-lite-vscode",
"displayName": "Unity Code Assist Lite",
"description": "uca-desc//--",
"version": "1.2.6",
"engines": {
"vscode": "^1.75.0"
},
"categories": [
"Other"
],
"activationEvents": [
"onLanguage:csharp",
"workspaceContains:/*.{csproj,csx,cake}"
],
"main": "./out/extension.js",
"contributes": {
"commands": [
{
"command": "UCA-Lite-VSCode.helloWorld",
"title": "Hello World"
},
{
"command": "UCA-Lite-VSCode.replaceTextEditorSpan",
"title": "Replace Text Editor Span"
}
]
},
"scripts": {
"vscode:prepublish": "npm run compile",
"compile": "tsc -p ./",
"watch": "tsc -watch -p ./",
"pretest": "npm run compile && npm run lint",
"lint": "eslint src --ext ts",
"test": "vscode-test"
},
"dependencies": {
"@sentry/browser": "^8.32.0",
"js-sha256": "^0.11.0",
"mqtt": "^5.10.1",
"winston": "^3.14.2",
"winston-vscode": "^1.0.0"
},
"devDependencies": {
"@types/mocha": "^10.0.7",
"@types/node": "20.x",
"@types/vscode": "^1.92.0",
"@types/ws": "^8.5.12",
"@typescript-eslint/eslint-plugin": "^7.14.1",
"@typescript-eslint/parser": "^7.11.0",
"@vscode/test-cli": "^0.0.9",
"@vscode/test-electron": "^2.4.0",
"eslint": "^8.57.0",
"typescript": "^5.4.5"
}
}

Expected Result

no compile errors

Actual Result

13 compile errors

[lforst]

Hi, thanks for writing in! Would you mind providing a small reproduction example so we can investigate further? Thanks!

[sapsari]

Sure, open folder "BugReportProjectForSentryBrowser/sentry-error" with VSCode

https://github.com/sapsari/BugReportProjectForSentryBrowser

[lforst]

Usually, bare vscode extensions run in a Node.js context and not a browser context. For Node.js you need to use @sentry/node not @sentry/browser.

If you use a webview in VS Code, then you can add @sentry/browser, but only for the webview environment.

[sapsari]

Thanks, was able to setup and run successfully!