Pesquisa de site

typescript - Enviando mensagem do webview para a extensão


Eu tenho um webview (SidebarProvider) que permite ao usuário digitar uma entrada e enviá-la. Eu quero enviar essa entrada para uma extensão SearchedWordPanel.

Etapas:

  1. Na minha Visão de Barra Lateral (html, js e css), o usuário digita uma palavra e pressiona "buscar". (Funciona)
  2. A palavra é enviada para o SidebarProvider, que recebe a mensagem usando onDidReceiveMessage e executa o comando para exibir o SearchedWordPanel. (Funciona)
  3. O SearchedWordPanel abre e exibe a palavra que o usuário digitou. (Pergunta)

Eu consigo fazer o ponto 1 e 2, mas não enviar a palavra pesquisada para o 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);
  })
);

VisualizaçãoLateral

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

ProvedorDeBarraLateral

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;
    }

Pergunta: como posso enviar data.value para SearchedWordPanel quando executo vscode.commands.executeCommand("vsmyapp.showSearched"); no SidebarProvider?

Resposta #1

O Webview possui postMessage - https://code.visualstudio.com/api/extension-guides/webview#passing-messages-from-an-extension-to-a-webview.

Não tenho certeza do que é SearchedWordPanel (Não é um WebviewPanel), provavelmente é um wrapper.

Vamos supor que SearchedWordPanel tenha o WebviewPanel nativo como prop panel. Para enviar uma mensagem para ele, você pode fazer:

SearchedWordPanel.panel.postMessage()