Why resolveWebviewView
Is Never Called in Your VS Code Extension
I recently spent hours debugging an issue that should have taken five minutes to identify. I was building a sidebar dashboard for my VS Code extension HookGuard using the WebviewViewProvider
API. Everything seemed wired up correctly:
- The provider was registered
- The view appeared in the sidebar
- The extension was activating
But resolveWebviewView()
was never called. No logs. No errors. Just silence.
The Problem
Despite what the documentation suggests (at least at the time of writing), simply defining a view in your package.json
with a valid id
and associating it with a WebviewViewProvider
isn’t enough.
VS Code will happily display your view without ever invoking your provider unless you explicitly define the view type as webview
.
The Missing Piece: "type": "webview"
Here’s what I was missing:
"views": {
"hookguard-sidebar": [
{
"type": "webview", // <- REQUIRED for resolveWebviewView to be called
"id": "hookguardView",
"name": "Dashboard"
}
]
}
This type
property is mandatory when registering views intended to use the WebviewViewProvider
interface. Without it, your view gets rendered as a static placeholder with no functionality.
Why It’s Dangerous
This issue is insidious because:
- Your extension compiles and activates without errors
- Your view shows up in the activity bar
- You see no logs, no stack traces, no warnings
In a project that uses build steps (like bundling with esbuild), you might assume your dist is stale or your imports are broken. But in reality, VS Code just never bound your provider to the view.
The Minimal Working Setup
package.json
"viewsContainers": {
"activitybar": [
{
"id": "hookguard-sidebar",
"title": "HookGuard",
"icon": "media/icon.svg"
}
]
},
"views": {
"hookguard-sidebar": [
{
"type": "webview",
"id": "hookguardView",
"name": "Dashboard"
}
]
}
Extension activation
vscode.window.registerWebviewViewProvider(
"hookguardView",
new HookGuardViewProvider(context)
)
Provider implementation
export class HookGuardViewProvider implements vscode.WebviewViewProvider {
resolveWebviewView(view: vscode.WebviewView) {
view.webview.options = { enableScripts: true }
view.webview.html = `<h1>It works</h1>`
}
}
Final Thoughts
If you’re building a sidebar experience in VS Code, make sure you define your view type explicitly. Otherwise, you’ll end up chasing ghosts in your build system, editor state, or file paths.
This tiny omission broke my extension for hours and produced zero feedback.
It’s a one-liner that can save you a lot of frustration:
"type": "webview"
- Q. Ackermann
Senior Engineer, Toolmaker, Systems Thinker
GitHub | KodeReview | LinkedIn