Sitzungsereignisse in einen E2E-Test umwandeln

Erfahren Sie, wie Sie Ihre OpenReplay-Sitzungsaufzeichnungen in automatisierten E2E-Testcode für Cypress, Playwright und Puppeteer umwandeln

Sitzungsereignisse in einen E2E⁠-⁠Test umwandeln

Mit der Funktion „Sitzungsereignisse in einen E2E-Test umwandeln“ können Sie aufgezeichnete Benutzersitzungen in automatisierten End-to-End-Testcode überführen. Diese leistungsstarke Funktion schlägt die Brücke zwischen echtem Benutzerverhalten und Testautomatisierung und ermöglicht es Ihnen, Benutzerabläufe schnell in dem Test-Framework Ihrer Wahl nachzubilden.

So funktioniert es: Sitzungen in E2E-Testcode umwandeln

Section titled So funktioniert es: Sitzungen in E2E-Testcode umwandeln
  1. Öffnen Sie im Dashboard die Ansicht Sessions
  2. Wählen Sie eine beliebige aufgezeichnete Sitzung aus, um die Ansicht Session Replay zu öffnen
  3. Klicken Sie auf den Tab Activity, um die Ereignis-Timeline anzuzeigen
  4. Suchen Sie das Symbol Copy Events neben der Suchleiste
  5. Klicken Sie auf das Symbol, um das Dropdown-Menü mit den Exportoptionen zu öffnen
Sitzungsereignisse in einen E2E-Test umwandeln

Funktion „Sitzungsereignisse in einen E2E-Test umwandeln“ verwenden

Section titled Funktion „Sitzungsereignisse in einen E2E-Test umwandeln“ verwenden
  1. Klicken Sie in der Ansicht „Activity“ auf das Symbol Copy Events
  2. Wählen Sie im Dropdown-Menü das gewünschte Test-Framework aus (Cypress, Playwright oder Puppeteer)
  3. Wählen Sie zwischen Events Only und Complete Test
  4. Verwenden Sie „Select events on the timeline“, um festzulegen, welche Ereignisse enthalten sein sollen
  5. Klicken Sie auf Copy, um den generierten Code in die Zwischenablage zu kopieren
  6. Fügen Sie ihn direkt in Ihre Testdatei ein

Die Funktion unterstützt den Export in drei beliebte Test-Frameworks:

  • Cypress – Web-Test-Framework mit Fokus auf Entwicklererfahrung und Zuverlässigkeit
  • Playwright – Moderne Testbibliothek mit browserübergreifender Unterstützung
  • Puppeteer – Bibliothek zur Automatisierung von Headless-Browsern
Test-Frameworks

Sie können zwischen zwei Exporttypen wählen:

  • Events Only – Erzeugt nur die Aktionsbefehle, ohne jede Teststruktur
  • Complete Test – Erstellt einen vollständig strukturierten Test mit dem passenden Grundgerüst

Mit dem Auswahlwerkzeug in der Timeline können Sie:

  • Einen bestimmten Bereich von Ereignissen für den Export auswählen
  • Die Ziehpunkte verschieben, um Start- und Endpunkt anzupassen

Events Only:

cy.visit('/en/deployment/')
cy.get('a:nth-of-type(9)').click()
cy.visit('/en/deployment/deploy-docker/')
cy.get('.active li:nth-of-type(13) > a').click()
cy.visit('/en/deployment/upgrade/')
cy.get('.active > .justify-between').click()
cy.get('.left-nav-parent > li:nth-of-type(4) > .flex').click()
cy.get('.active li:nth-of-type(5) > a').click()
cy.visit('/en/using-or/next/')
cy.get('.left-nav-parent > li:nth-of-type(5) > .flex').click()
cy.get('.left-nav-parent > li:nth-of-type(6) > .flex').click()
cy.visit('/en/installation/')
cy.get('.active li:nth-of-type(2) > a').click()
cy.visit('/en/installation/identify-user/')
cy.get('li:nth-of-type(7) > .flex').click()
cy.get('.logo-clickarea').click()

Complete Test:

// cypress/e2e/session_replay_test.cy.js

describe('Deployment - OpenReplay Documentation', () => {
  it('Navigates through /en/deployment/', () => {
    cy.visit('/en/deployment/')
    cy.get('a:nth-of-type(9)').click()
    cy.visit('/en/deployment/deploy-docker/')
    cy.get('.active li:nth-of-type(13) > a').click()
    cy.visit('/en/deployment/upgrade/')
    cy.get('.active > .justify-between').click()
    cy.get('.left-nav-parent > li:nth-of-type(4) > .flex').click()
    cy.get('.active li:nth-of-type(5) > a').click()
    cy.visit('/en/using-or/next/')
    cy.get('.left-nav-parent > li:nth-of-type(5) > .flex').click()
    cy.get('.left-nav-parent > li:nth-of-type(6) > .flex').click()
    cy.visit('/en/installation/')
    cy.get('.active li:nth-of-type(2) > a').click()
    cy.visit('/en/installation/identify-user/')
    cy.get('li:nth-of-type(7) > .flex').click()
    cy.get('.logo-clickarea').click()
  })
})

Wenn Sie beim Erstellen von E2E-Tests aus Ihren Sitzungen Probleme haben, wenden Sie sich an unsere Slack-Community und fragen Sie direkt unsere Entwickler!