Robot + Browser library (Playwright) (2. díl) - UI test

Úvod

V této kapitole ukážu jednoduchý UI test - registrace uživatele s unikátním emailem.

Test provede tyto kroky:

• otevře prohlížeč,
• přejde na stránku s formulářem,
• vyplní registrační formulář s unikátním e-mailem,
• odešle formulář,
• a ověří, že se na stránce objeví očekávaná zpráva.

Test

*** Settings ***
Library    Browser
Library    DateTime
Suite Setup    New Browser    chromium    headless=False
Suite Teardown    Close Browser

*** Variables ***
${URL}        https://users.projects.icanbreakit.eu
${PASSWORD}   secret123
${EXPECTED_TEXT}    User registered

*** Test Cases ***
Registration Test

    ${timestamp}=    Get Current Date    result_format=%Y%m%d%H%M%S
    ${email}=        Set Variable    testuser_${timestamp}@example.com
    Log    ${email}

    New Page    ${URL}

    # Opens registration form
    Click    css=[data-testid="register-button"]

    # fill email + password
    Fill Text    css=[data-testid="email-input"]    ${email}
    Fill Text    css=[data-testid="password-input"]    ${PASSWORD}

    # Submit
    Click    css=[data-testid="register-submit"]

    # Check text of successful registration
    ${text}=    Get Text    css=[data-testid="registration-message"]
    Should Be Equal    ${text}    ${EXPECTED_TEXT}

Vysvětlení částí testu

1. *** Settings ***

   • Library Browser – přidává knihovnu Browser - umožňuje ovládat webový prohlížeč pomocí Playwrightu
   • Library DateTime – umožňuje pracovat s datem a časem, tady pro generování unikátního e-mailu.
   • Suite Setup – příkaz, který se spustí před všemi testy (otevření prohlížeče).
   • Suite Teardown – příkaz, který se spustí po všech testech (zavření prohlížeče).

2. *** Variables ***

• Proměnné použité v testu:

  • URL – adresa testované aplikace.
  • PASSWORD – testovací heslo.
  • EXPECTED_TEXT – očekávaný text, který potvrzuje úspěšnou registraci.

3. *** Test Cases ***

Vytváření dynamického e-mailu:

${timestamp}=    Get Current Date    result_format=%Y%m%d%H%M%S
${email}=        Set Variable    testuser_${timestamp}@example.com

Díky časovému razítku je e-mail pokaždé unikátní.

Otevření stránky:

New Page    ${URL}

Interakce s formulářem: kliknutí na tlačítko, vyplnění e-mailu a hesla, kliknutí na odeslání.

Click    css=[data-testid="register-button"]
Fill Text    css=[data-testid="email-input"]    ${email}
Fill Text    css=[data-testid="password-input"]    ${PASSWORD}
Click    css=[data-testid="register-submit"]

Ověření výsledku:

${text}=    Get Text    css=[data-testid="registration-message"]
Should Be Equal    ${text}    ${EXPECTED_TEXT}

Test končí porovnáním skutečného a očekávaného textu. Pokud se neshodují, test selže.

• pomocí Get Current Date vytvářím unikátní email pro každý test (kvůli opakování testu bez kolizí)
• Headless=False otevře prohlížeč

Čekání na elementy

Robot Framework s Browser knihovnou má vestavěné čekací mechanismy, velmi podobné Playwrightu.

Implicitní čekání (auto-waiting)

Klíčová slova jako Click, Fill Text, Get Text sama čekají, dokud je element viditelný nebo interaktivní. Pokud element není připraven, Browser knihovna opakuje pokus až do vypršení defaultního timeoutu (10s).

Click    css=button#submit

Explicitní čekání

Pro přesnější kontrolu můžeme použít klíčová slova jako:

• Wait For Elements State (exists, visible, hidden, stable, enabled, disabled)
• Wait For Navigation
• Wait For Response
• Wait For Request
• Wait Until Network Is Idle

Wait For Elements State    css=div#message    visible    5s

Konfigurace timeoutu

Defaultní timeout je 10 sekund. Změnu timeoutu na 20 sekund provedu tímto příkazem:

New Browser    chromium    headless=False    defaultTimeout=20000

Nebo na úrovni testu:

Set Browser Timeout    20s