Freigeben über


Erste Schritte mit Power Platform Playwright-Beispielen

Dieser Leitfaden hilft Ihnen bei den ersten Schritten mit Power Platform Playwright-Beispielen, indem Sie das Repository klonen, Umgebungsvariablen konfigurieren, authentifizieren und Ihren ersten End-to-End-Test ausführen.

Voraussetzungen

Bevor Sie beginnen, stellen Sie sicher, dass Sie folgendes haben:

  • Node.js 20 oder höher
  • Git
  • Eine Power Platform-Umgebung mit mindestens einer bereitgestellten App
  • Ein Benutzerkonto mit Zugriff auf die App, die Sie testen möchten

Hinweis

Die Beispieltests in diesem Repository zielen auf die Northwind Traders-Lösung ab. Sie können Ihre eigene App verwenden, indem Sie denselben Mustern folgen. Anweisungen zum Einrichten finden Sie unter Beispieltests .

Schritt 1: Klonen des Repositorys

git clone https://github.com/microsoft/power-platform-playwright-samples.git
cd power-platform-playwright-samples

Schritt 2: Installieren von Abhängigkeiten

Das Repository verwendet Rush zur Verwaltung des Monorepos. Installieren von Abhängigkeiten mit:

node common/scripts/install-run-rush.js install

Wenn Sie lieber direkt mit dem e2e-tests Paket arbeiten möchten:

cd packages/e2e-tests
npm install

Schritt 3: Installieren von Browsern

Installieren sie Microsoft Edge (der Standardbrowser für Power Platform-Tests):

cd packages/e2e-tests
npx playwright install msedge

Schritt 4: Konfigurieren Ihrer Umgebung

Kopieren Sie die Umgebungsvorlage, und füllen Sie Ihre Werte aus:

cp .env.example .env

Öffnen Sie .env und legen Sie die erforderlichen Variablen fest.

# Power Apps
POWER_APPS_BASE_URL=https://make.powerapps.com
POWER_APPS_ENVIRONMENT_ID=<your-environment-guid>

# Model-driven app (for model-driven app tests)
MODEL_DRIVEN_APP_URL=https://<org>.crm.dynamics.com/main.aspx?appid=<app-guid>

# Canvas app (for canvas tests)
CANVAS_APP_ID=<canvas-app-guid>
CANVAS_APP_TENANT_ID=<tenant-guid>

# Authentication
MS_AUTH_EMAIL=<your-test-user@domain.com>
MS_AUTH_CREDENTIAL_TYPE=password
MS_USER_PASSWORD=<password>

Tipp

Verwenden Sie für CI/CD-Pipelines die zertifikatbasierte Authentifizierung anstelle von Kennwörtern. Ausführliche Informationen finden Sie im Authentifizierungshandbuch .

Die vollständige Liste der Umgebungsvariablen finden Sie unter Referenz zu Umgebungsvariablen.

Schritt 5: Authentifizieren

Die Authentifizierung wird einmal ausgeführt, um einen Browserspeicherstatus zu erfassen, den alle Tests wiederverwenden.

Authentifizieren bei Power Apps

Führen Sie den folgenden Befehl aus: Ein Browserfenster wird geöffnet, in dem Sie sich anmelden können:

npm run auth:headful

Der Speicherstatus wird gespeichert in .playwright-ms-auth/state-<email>.json.

Authentifizieren bei der modellgesteuerten App (optional)

Wenn Sie modellgesteuerte Apps testen, führen Sie eine zweite Authentifizierung für die Dynamics 365 Domäne aus:

npm run auth:mda:headful

Der Status des modellgesteuerten Appspeichers wird in .playwright-ms-auth/state-mda-<email>.json gespeichert.

Hinweis

Der Authentifizierungsspeicherstatus läuft mit der Sitzung ab. Wiederholen Sie diese Schritte, wenn Tests mit Authentifizierungsfehlern beginnen oder die CI/CD-Authentifizierung so konfigurieren, dass der Zustand automatisch verlängert wird.

Schritt 6: Ausführen der Tests

Führen Sie alle Tests aus:

npx playwright test

Führen Sie nur Canvas-App-Tests aus:

npx playwright test tests/northwind/canvas --project=default

Führen Sie nur modellgesteuerte App-Tests aus:

npx playwright test tests/northwind/mda --project=model-driven-app

Zeigen Sie den HTML-Bericht nach der Ausführung an:

npx playwright show-report

Schritt 7: Schreiben Ihres ersten Power Platform Playwright-Tests

Das folgende Beispiel zeigt einen minimalen Canvas-App-Test. Erstellen sie eine Datei unter tests/my-app/my-app.test.ts:

import { test, expect } from '@playwright/test';
import { AppProvider, AppType, AppLaunchMode } from 'power-platform-playwright-toolkit';

const CANVAS_APP_URL = process.env.CANVAS_APP_URL!;

test('should load the app and display the gallery', async ({ page, context }) => {
  const app = new AppProvider(page, context);

  await app.launch({
    app: 'My Canvas App',
    type: AppType.Canvas,
    mode: AppLaunchMode.Play,
    skipMakerPortal: true,
    directUrl: CANVAS_APP_URL,
  });

  const canvasApp = app.getCanvasAppPage();
  const canvasFrame = page.frameLocator('iframe[name="fullscreen-app-host"]');

  await expect(canvasFrame.locator('[data-control-name="Gallery1"]')).toBeVisible();
});

Führen Sie den Test aus:

npx playwright test tests/my-app/my-app.test.ts --project=default

Nächste Schritte

Siehe auch