From a007537767b568176922ac5159b8f0761845898f Mon Sep 17 00:00:00 2001 From: Saoud Rizwan <7799382+saoudrizwan@users.noreply.github.com> Date: Sat, 27 Jul 2024 20:07:32 -0400 Subject: [PATCH] Add output logging to better debug extension outside of development --- .vscodeignore | 4 ++++ package.json | 2 +- src/extension.ts | 19 ++++++++++++++----- src/providers/ClaudeDevProvider.ts | 22 +++++++++++++++------- 4 files changed, 34 insertions(+), 13 deletions(-) diff --git a/.vscodeignore b/.vscodeignore index c5edfaa..ad70543 100644 --- a/.vscodeignore +++ b/.vscodeignore @@ -13,7 +13,11 @@ vsc-extension-quickstart.md **/*.map **/*.ts **/.vscode-test.* + +# Custom demo.gif +.nvmrc +.gitattributes # Ignore all webview-ui files except the build directory (https://github.com/microsoft/vscode-webview-ui-toolkit-samples/blob/main/frameworks/hello-world-react-cra/.vscodeignore) webview-ui/src/** diff --git a/package.json b/package.json index 4b52a49..e292077 100644 --- a/package.json +++ b/package.json @@ -2,7 +2,7 @@ "name": "claude-dev", "displayName": "Claude Dev", "description": "Autonomous software engineer right in your IDE, capable of reading/writing files, executing commands, and more with your permission every step of the way.", - "version": "1.0.3", + "version": "1.0.4", "icon": "icon.png", "engines": { "vscode": "^1.84.0" diff --git a/src/extension.ts b/src/extension.ts index 79f675b..e88305d 100644 --- a/src/extension.ts +++ b/src/extension.ts @@ -12,6 +12,8 @@ https://github.com/microsoft/vscode-webview-ui-toolkit-samples/tree/main/framewo */ +let outputChannel: vscode.OutputChannel + // This method is called when your extension is activated // Your extension is activated the very first time the command is executed export function activate(context: vscode.ExtensionContext) { @@ -19,6 +21,11 @@ export function activate(context: vscode.ExtensionContext) { // This line of code will only be executed once when your extension is activated //console.log('Congratulations, your extension "claude-dev" is now active!') + outputChannel = vscode.window.createOutputChannel("Claude Dev") + context.subscriptions.push(outputChannel) + + outputChannel.appendLine("Claude Dev extension activated") + // The command has been defined in the package.json file // Now provide the implementation of the command with registerCommand // The commandId parameter must match the command field in package.json @@ -29,7 +36,7 @@ export function activate(context: vscode.ExtensionContext) { // }) // context.subscriptions.push(disposable) - const sidebarProvider = new ClaudeDevProvider(context) + const sidebarProvider = new ClaudeDevProvider(context, outputChannel) context.subscriptions.push( vscode.window.registerWebviewViewProvider(ClaudeDevProvider.viewType, sidebarProvider, { @@ -39,8 +46,7 @@ export function activate(context: vscode.ExtensionContext) { context.subscriptions.push( vscode.commands.registerCommand("claude-dev.plusButtonTapped", async () => { - //const message = "claude-dev.plusButtonTapped!" - //vscode.window.showInformationMessage(message) + outputChannel.appendLine("Plus button tapped") await sidebarProvider.clearTask() await sidebarProvider.postStateToWebview() await sidebarProvider.postMessageToWebview({ type: "action", action: "plusButtonTapped" }) @@ -48,9 +54,10 @@ export function activate(context: vscode.ExtensionContext) { ) const openClaudeDevInNewTab = () => { + outputChannel.appendLine("Opening Claude Dev in new tab") // (this example uses webviewProvider activation event which is necessary to deserialize cached webview, but since we use retainContextWhenHidden, we don't need to use that event) // https://github.com/microsoft/vscode-extension-samples/blob/main/webview-sample/src/extension.ts - const tabProvider = new ClaudeDevProvider(context) + const tabProvider = new ClaudeDevProvider(context, outputChannel) //const column = vscode.window.activeTextEditor ? vscode.window.activeTextEditor.viewColumn : undefined const lastCol = Math.max(...vscode.window.visibleTextEditors.map((editor) => editor.viewColumn || 0)) const targetCol = Math.max(lastCol + 1, 1) @@ -82,4 +89,6 @@ export function activate(context: vscode.ExtensionContext) { } // This method is called when your extension is deactivated -export function deactivate() {} +export function deactivate() { + outputChannel.appendLine("Claude Dev extension deactivated") +} diff --git a/src/providers/ClaudeDevProvider.ts b/src/providers/ClaudeDevProvider.ts index c8aa243..d4543f4 100644 --- a/src/providers/ClaudeDevProvider.ts +++ b/src/providers/ClaudeDevProvider.ts @@ -20,7 +20,12 @@ export class ClaudeDevProvider implements vscode.WebviewViewProvider { private claudeDev?: ClaudeDev private latestAnnouncementId = "jul-25-2024" // update to some unique identifier when we add a new announcement - constructor(private readonly context: vscode.ExtensionContext) {} + constructor( + private readonly context: vscode.ExtensionContext, + private readonly outputChannel: vscode.OutputChannel + ) { + this.outputChannel.appendLine("ClaudeDevProvider instantiated") + } /* VSCode extensions use the disposable pattern to clean up resources when the sidebar/editor tab is closed by the user or system. This applies to event listening, commands, interacting with the UI, etc. @@ -28,12 +33,12 @@ export class ClaudeDevProvider implements vscode.WebviewViewProvider { - https://github.com/microsoft/vscode-extension-samples/blob/main/webview-sample/src/extension.ts */ async dispose() { - console.log("Disposing provider...") - await this.clearTask() // clears claudeDev, api conversation history, and webview claude messages - console.log("Cleared task") + this.outputChannel.appendLine("Disposing ClaudeDevProvider...") + await this.clearTask() + this.outputChannel.appendLine("Cleared task") if (this.view && "dispose" in this.view) { this.view.dispose() - console.log("Disposed webview") + this.outputChannel.appendLine("Disposed webview") } while (this.disposables.length) { const x = this.disposables.pop() @@ -41,7 +46,7 @@ export class ClaudeDevProvider implements vscode.WebviewViewProvider { x.dispose() } } - console.log("Disposed disposables") + this.outputChannel.appendLine("Disposed all disposables") } resolveWebviewView( @@ -49,6 +54,7 @@ export class ClaudeDevProvider implements vscode.WebviewViewProvider { //context: vscode.WebviewViewResolveContext, used to recreate a deallocated webview, but we don't need this since we use retainContextWhenHidden //token: vscode.CancellationToken ): void | Thenable { + this.outputChannel.appendLine("Resolving webview view") this.view = webviewView webviewView.webview.options = { @@ -105,7 +111,7 @@ export class ClaudeDevProvider implements vscode.WebviewViewProvider { // Listen for when color changes vscode.workspace.onDidChangeConfiguration( (e) => { - if (e.affectsConfiguration("workbench.colorTheme")) { + if (e && e.affectsConfiguration("workbench.colorTheme")) { // Sends latest theme name to webview this.postStateToWebview() } @@ -119,6 +125,8 @@ export class ClaudeDevProvider implements vscode.WebviewViewProvider { // Clear previous version's (0.0.6) claudeMessage cache from workspace state. We now store in global state with a unique identifier for each provider instance. We need to store globally rather than per workspace to eventually implement task history this.updateWorkspaceState("claudeMessages", undefined) + + this.outputChannel.appendLine("Webview view resolved") } async tryToInitClaudeDevWithTask(task: string) {