快速入门

具有登录页面和仪表板的简单场景，其中包含一些定位器选择器和一个文本选择器。

代码示例

使用代码

from playwright.sync_api import expect, sync_playwright
from hitchpage import PlaywrightPageConfig
from pathlib import Path

browser = sync_playwright().start().chromium.connect("ws://127.0.0.1:3605")
page = browser.new_page()

conf = PlaywrightPageConfig(
    *Path(".").glob("*.yml"),    # all .yml files in this folder
    playwright_page=page,
)

page.goto("https://127.0.0.1:8001")

selectors.yml

login:
  element:
    username: "#id_username"
    password: "#id_password"
    ok: "#id_ok_button"
dashboard:
  element:
    dashboard: "#id_this_is_a_dashboard_element"
    message: "#id_dashboard_message"
    next:
      text: next

使用 HTML

index.html

<div class="form-login">
<input type="text" id="id_username" placeholder="username" /></br>
<input type="text" id="id_password" placeholder="password" /></br>
<div class="wrapper">
<span class="group-btn">     
<a id="id_ok_button" href="/dashboard.html" class="btn btn-primary btn-md">login <i class="fa fa-sign-in"></i></a>
</span>
</div>
</div>

dashboard.html

<div class="form-login">
  <h4 id="id_this_is_a_dashboard_element">Dashboard</h4>
  <p id="id_dashboard_message">hello!</a>
</div>

conf.next_page("login")
print("login page")
conf.element("username").fill("myusername")
conf.element("password").fill("mypassword")
conf.element("ok").click()

conf.next_page("dashboard")
print("dashboard page")
expect(conf.element("message")).to_be_visible()

将输出

login page                                                                                                                                                      
dashboard page

可执行规范

从 quickstart.story storytests 自动生成的文档。