Testen Sie eine Komponente für Virtual Agent

  • Freigeben Version: Yokohama
  • Aktualisiert 30. Januar 2025
  • 2 Minuten Lesedauer

    • Testen Sie Ihre anwenderdefinierte Komponente Virtual Agent, bevor Sie sie in Ihrer -Instanz bereitstellen.

    Vorbereitungen

    Erforderliche Rolle: virtual_agent_admin oder admin

    Warum und wann dieser Vorgang ausgeführt wird

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

    Prozedur

    1. Fügen Sie Ihrem Komponentenprojekt eine Abhängigkeit vom Testclient-Tool hinzu.
      1. Öffnen Sie<component-name> Datei /package.json in Ihrem Komponentenprojekt.
      2. Fügen Sie „@servicenow/sdk-ci“: „1.0.8“ und „@servicenow/library-translate“: „^18.0.0“ dem devDependencies- Objekt hinzu.
      Hier ist eine Beispieldatei des Typs „package.json“ mit den richtigen Abhängigkeiten. 
      "dependencies": {
    "@servicenow/ui-renderer-snabbdom": "Yokohama",
    "@servicenow/library-translate": "^18.0.0",
    "@servicenow/now-button": "Yokohama",
    "@servicenow/now-dropdown": "Yokohama",
    "@servicenow/sass-generic": "Yokohama",
    "@servicenow/cli-archetype": "Yokohama",
    "@servicenow/sdk-ci": "1.0.8"
}
    2. Fügen Sie Beispieleigenschaften hinzu, die Sie als Anfangsstatus der Komponente in Ihrem Test verwenden möchten.
      1. Fügen Sie eine hinzu<component-name> /example/sampleProps.json mit anfänglichen Eigenschaften zum Rendern in Ihrem Test.
      Hier ist eine Beispieldatei vom Typ „sampleProps.json“ 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 die Datei „example.js“, um die Komponente über das Test-Client-Tool mit den von Ihnen erstellten Beispieleigenschaften zu öffnen.
      1. Öffnen Sie<component-name> Datei /example/element.js in Ihrem Komponentenprojekt.
      2. Fügen Sie Anweisungen zum Importieren von @servicenow/sdk-ci und der von Ihnen erstellten Beispieleigenschaftendatei hinzu.
      3. Fügen Sie die folgende Aussage hinzu und ersetzen Sie<component-name> mit dem Namen Ihrer Komponente, um das Test-Tool mit den ursprünglichen Daten 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 eine Beispieldatei vom Typ „example.js“, 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 Entwicklungsserverbefehl 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: false.
      port Port, auf dem der Entwicklungsserver ausgeführt wird.

      Standard: 8081.
      host Zu verwendende Hostadresse, wenn Ihr lokaler Entwicklungsserver von extern zugänglich sein soll. Normalerweise auf 0.0.0.0festgelegt 
      $ snc ui-component develop --entry example/hello.js --open --port 3000

      Die Komponente wird im Testclient-Tool geöffnet. Sie können die anfänglich bereitgestellten Daten im Feld JSON-Eingabedaten für anwenderdefiniertes Steuerelement und die Ausgabe der Komponente im Feld Rückgabedaten für anwenderdefiniertes Steuerelement sehen.

      Das Test-Client-Tool, in dem eine Beispiel-Schiebereglerkomponente angezeigt wird.

    Nächste Maßnahme

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

    Nachdem Sie die Komponente entwickelt und in Ihrer Instanz bereitgestellt haben, fügen Sie sie mithilfe eines anwenderdefinierten Steuerelements und einer Definition zu Virtual Agent-Designer hinzu. Weitere Informationen finden Sie unter Anwenderdefinierte Steuerungen für Virtual Agent.