Testen Sie eine Komponente für Virtual Agent

  • Freigeben Version: Australia
  • Aktualisiert 12. März 2026
  • 2 Minuten Lesedauer

    • Testen Sie Ihren Virtual Agent Anwenderdefinierte Komponente, bevor sie in Ihrer Instanz bereitgestellt wird.

    Vorbereitungen

    Erforderliche Rolle: virtual_agent_admin oder admin

    Warum und wann dieser Vorgang ausgeführt wird

    Virtual Agent Komponenten müssen innerhalb von getestet werden Virtual Agent Client-Chat, um sicherzustellen, dass die Komponente korrekt auf Anwendereingaben reagiert. Sie können Eigenschaften in Ihrem Komponentenprojekt festlegen, um Ihre Komponente in einem Mock zu testen Virtual Agent Client-Tool testen.

    Prozedur

    1. Fügen Sie Ihrem Komponentenprojekt eine Abhängigkeit vom Test-Client-Tool hinzu.
      1. Öffnen Sie <component-name>/Package.JSON Datei in Ihrem Komponentenprojekt.
      2. Hinzufügen „@servicenow/sdk-ci“: „1,0.8“ Und „@servicenow/Library-translate“: „^18.0,0“ An DevAbhängigkeiten Objekt.
      Hier ist ein Beispiel Package.JSON Datei mit den richtigen Abhängigkeiten. 
      "dependencies": {
    "@servicenow/ui-renderer-snabbdom": "Australien",
    "@servicenow/library-translate": "^18.0.0",
    "@servicenow/now-button": "Australien",
    "@servicenow/now-dropdown": "Australien",
    "@servicenow/sass-generic": "Australien",
    "@servicenow/cli-archetype": "Australien",
    "@servicenow/sdk-ci": "1.0.8"
}
    2. Fügen Sie Beispieleigenschaften hinzu, die als Anfangsstatus der Komponente in Ihrem Test verwendet werden sollen.
      1. Fügen Sie ein hinzu <component-name>/example/sampleProps.JSON Datei mit anfänglichen Eigenschaften, die in Ihrem Test gerendert werden sollen.
      Hier ist ein Beispiel SampleProps.JSON Datei mit anfänglichen Eigenschaften, die für eine Schiebereglerkomponente festgelegt sind. 
      {	
	"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. Aktualisieren Sie Beispiel.js Datei zum Öffnen der Komponente über das Test-Client-Tool mithilfe der von Ihnen erstellten Beispieleigenschaften.
      1. Öffnen Sie <component-name>/example/Element.js Datei in Ihrem Komponentenprojekt.
      2. Fügen Sie zu importierende Anweisungen hinzu @servicenow/sdk-ci Und die Beispieleigenschaftendatei, die Sie erstellt haben.
      3. Fügen Sie die folgende Anweisung hinzu und ersetzen Sie sie <component-name> Mit dem Namen Ihrer Komponente, um das Testtool mit Anfangsdaten aus Ihren Beispieleigenschaften zu erstellen. 
        const el = document.createElement('tool-ci-custom-control-tester');
el.componentTagName="<component-name>";
el.initialExampleData=sampleProps;
document.body.appendChild(el);
      Hier ist ein Beispiel Beispiel.js Datei, die die Komponente mit dem Test-Client-Tool öffnet. 
      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. Führen Sie den Entwicklungsserver-Befehl aus, um Ihre Komponente in einem Testbrowser anzuzeigen. 
      $ snc ui-component develop [--entry entry --open --port port --host host]

      Übergeben Sie Werte für diese Parameter.

      Name Beschreibung
      Eintrag Pfad zum Testmodul in Ihrem Komponentenprojekt.

      Standard: Example/index.js .
      offen Öffnet den Standardbrowser und navigiert zur Testseite.

      Standard: Falsch.
      Port Port, auf dem der Entwicklungsserver ausgeführt wird.

      Standard: 8081.
      host Hostadresse, die verwendet werden soll, wenn Ihr lokaler Entwicklungsserver für andere extern zugänglich sein soll. Normalerweise auf festgelegt 0.0.0.0 
      $ snc ui-component develop --entry example/hello.js --open --port 3000

      Die Komponente wird im Test-Client-Tool geöffnet. Sie können die bereitgestellten Anfangsdaten in anzeigen Anwenderdefinierte Steuerungs-JSON-Eingabedaten Und die Ausgabe der Komponente in Anwenderdefinierte Steuerung Gibt Daten Zurück Feld.

    Nächste Maßnahme

    Wenn Ihre Komponente wie erwartet funktioniert, stellen Sie sie in Ihrer Instanz bereit. Anweisungen finden Sie unter ServiceNow® Entwickler-Websitean.

    Fügen Sie die Komponente nach der Entwicklung und der Bereitstellung in Ihrer Instanz zu hinzu Virtual Agent-Designer Verwenden einer anwenderdefinierten Steuerung und Definition. Weitere Informationen finden Sie unter Anwenderdefinierte Virtual Agent-Steuerungen .