Teste um componente para Virtual Agent

  • Versão de lançamento: Zurich
  • Atualizado 31 de jul. de 2025
  • 2 min. de leitura

    • Teste seu Virtual Agentcomponente personalizado antes de implantá-lo em sua instância.

    Antes de Iniciar

    Função necessária: virtual_agent_admin ou admin

    Por Que e Quando Desempenhar Esta Tarefa

    Virtual Agentos componentes devem ser testados no Virtual Agentbate-papo do cliente para garantir que o componente responda corretamente à entrada do usuário. Você pode definir propriedades em seu projeto de componente para testar seu componente em uma simulação Virtual Agentferramenta de cliente de teste.

    Procedimento

    1. Adicione uma dependência na ferramenta de cliente de teste ao seu projeto de componente.
      1. Abra o. <component-name>/package.json arquivo no projeto de componente.
      2. Adicionar "servicenow/sdk-ci": "1,0.8" e. "servicenow/library-translate": " 18,0.0" para Dependências objeto.
      Aqui está um exemplo pacote.json arquivo com as dependências corretas. 
      "dependencies": {
    "@servicenow/ui-renderer-snabbdom": "zurique",
    "@servicenow/library-translate": "^18.0.0",
    "@servicenow/now-button": "zurique",
    "@servicenow/now-dropdown": "zurique",
    "@servicenow/sass-generic": "zurique",
    "@servicenow/cli-archetype": "zurique",
    "@servicenow/sdk-ci": "1.0.8"
}
    2. Adicione propriedades de amostra para usar como o estado inicial do componente no teste.
      1. Adicione um <component-name>/example/sampleProps.json arquivo com propriedades iniciais para renderizar em seu teste.
      Aqui está um exemplo SampleProps.json arquivo com propriedades iniciais definidas para um componente deslizante. 
      {	
	"label": "How many penguins do you want to buy?",
	"defaultValue": 10,
	"sliderMin": 20,
	"sliderMax": 80,
	"unitName": "penguins",
	"unitIcon": "https://image.flaticon.com/icons/svg/141/141836.svg"  
}
    3. Atualize o. exemplo.js arquivo para abrir o componente por meio da ferramenta de cliente de teste usando as propriedades de amostra que você criou.
      1. Abra o. <component-name>/example/element.js arquivo no projeto de componente.
      2. Adicione declarações a serem importadas servicenow/sdk-ci e o arquivo de propriedades de amostra que você criou.
      3. Adicione a seguinte declaração, substituindo <component-name> com o nome do componente para criar a ferramenta de teste com dados iniciais das propriedades de amostra. 
        const el = document.createElement('tool-ci-custom-control-tester');
el.componentTagName="<component-name>";
el.initialExampleData=sampleProps;
document.body.appendChild(el);
      Aqui está um exemplo exemplo.js arquivo que abre o componente usando a ferramenta de cliente de teste. 
      import '../src/now-chat-control-slider';

import '@servicenow/sdk-ci';

import sampleProps from './sampleProps.json';

const el = document.createElement('tool-ci-custom-control-tester');
el.componentTagName="<component-name>";
el.initialExampleData=sampleProps;
document.body.appendChild(el);
    4. Execute o comando do servidor de desenvolvimento para exibir seu componente em um navegador de teste. 
      $ snc ui-component develop [--entry entry --open --port port --host host]

      Passe valores para esses parâmetros.

      Nome Descrição
      entrada Caminho para o módulo de teste em seu projeto de componente.

      Padrão: exemplo/index.js .
      em aberto Abre o navegador padrão e navega até a página de teste.

      Padrão: Falso.
      porta Porta em que o servidor de desenvolvimento é executado.

      Padrão: 8081.
      Host Endereço do host a ser usado se você quiser que seu servidor de desenvolvimento local seja acessível externamente por outras pessoas. Normalmente definido como 0.0.0.0 
      $ snc ui-component develop --entry example/hello.js --open --port 3000

      O componente é aberto na ferramenta de cliente de teste. Você pode ver os dados iniciais fornecidos em Dados de entrada JSON de controle personalizado e a saída do componente no Dados de retorno do controle personalizado campo.

      A ferramenta de cliente de teste que exibe um componente deslizante de amostra.

    O que Fazer Depois

    Se o seu componente estiver funcionando conforme esperado, implante-o na sua instância. Para obter instruções, consulte ServiceNow® Site do desenvolvedor.

    Depois de desenvolver o componente e implantá-lo em sua instância, adicione-o a. Designer do Virtual Agentusando um controle e uma definição personalizados. Para obter mais informações, consulte Controles personalizados do Virtual Agent .