Sending message from webview to extension

Viewed 518

I have one webview (SidebarProvider) which allows the user to type an input and send it. I want to send such input to an extension SearchedWordPanel.

Steps:

  1. In my Sidebar View (html, js and css), the user types a word and press "search". (Works)
  2. The word is sent to the SidebarProvider which receives the message using onDidReceiveMessage and runs the command to display the SearchedWordPanel. (Works)
  3. The SearchedWordPanel opens and displays the word the user has input. (Question)

I am able to do point 1 and 2 but not sending the searched word to the SearchedWordPanel.

extensions.ts

const sidebarProvider = new SidebarProvider(context.extensionUri);
  context.subscriptions.push(
    vscode.window.registerWebviewViewProvider(
      "vsmyapp-sidebar",
      sidebarProvider
    )
  );

context.subscriptions.push(
  vscode.commands.registerCommand('vsmyapp.showSearched', () => {
    SearchedWordPanel.kill();
    SearchedWordPanel.createOrShow(context.extensionUri);
  })
);

SidebarView

<button on:click={() =>
  tsvscode.postMessage({
    type: 'onSearch',
    value: searchedText
  })
}>Search</button>

SidebarProvider

webviewView.webview.onDidReceiveMessage(async (data) => {
  switch (data.type) {
    case "onSearch" : {
      if (!data.value) {
        return;
      }
      vscode.window.showInformationMessage(data.value); <-- WORKS
      vscode.commands.executeCommand( <--WORKS, the command is run. BUT How do I send data.value to SearchedWordPanel?
        "vsmyapp.showSearched",
      );
      COMMAND_THAT_SENDS_(data.value)_TO_SearchedWordPanel // Pseudocode
      break;
    }

Question: how can I send data.value to SearchedWordPanel when I execute vscode.commands.executeCommand("vsmyapp.showSearched"); in SidebarProvider?

1 Answers
Related