跳到主要內容

導覽

簡介​

Playwright 可以導覽至 URL，並處理由頁面互動引起的導覽。

基本導覽​

最簡單的導覽形式是開啟 URL

# Navigate the page
page.goto("https://example.com")

上述程式碼會載入頁面，並等待網頁觸發 load 事件。當整個頁面（包括所有相依資源，例如樣式表、指令碼、iframe 和圖片）都載入完成時，就會觸發 load 事件。

注意

如果頁面在 load 之前執行用戶端重新導向，page.goto() 將等待重新導向的頁面觸發 load 事件。

頁面何時載入完成？​

現代頁面會在 load 事件觸發後執行許多活動。它們會延遲擷取資料、填入 UI，並在 load 事件觸發後載入耗用資源的資源、指令碼和樣式。沒有辦法判斷頁面是否「已載入」，這取決於頁面、框架等。那麼您何時可以開始與其互動？

在 Playwright 中，您可以隨時與頁面互動。它會自動等待目標元素變成可操作。

# Navigate and click element
# Click will auto-wait for the element
page.goto("https://example.com")
page.get_by_text("example domain").click()

對於上述情境，Playwright 將等待文字變成可見，將等待其餘的可操作性檢查通過該元素，然後按一下它。

Playwright 的運作方式就像一個非常快速的使用者 - 一旦看到按鈕，就會按一下它。在一般情況下，您不必擔心是否所有資源都已載入等等。

Hydration​

在某些時候，您會偶然發現一個使用案例，其中 Playwright 執行了動作，但似乎沒有任何事情發生。或者您在輸入欄位中輸入一些文字，然後它會消失。這背後最可能的原因是頁面 hydration 不佳。

當頁面被 hydration 時，首先，會將頁面的靜態版本傳送到瀏覽器。然後，動態部分會被傳送，頁面會變成「即時」。作為一個非常快速的使用者，Playwright 會在看到頁面的那一刻開始與頁面互動。如果頁面上的按鈕已啟用，但尚未新增接聽程式，Playwright 會執行其工作，但按一下不會有任何效果。

驗證您的頁面是否受到 hydration 不佳影響的簡單方法是開啟 Chrome DevTools，在「網路」面板中選取「Slow 3G」網路模擬，然後重新載入頁面。一旦您看到感興趣的元素，請與其互動。您會看到按鈕點擊將被忽略，並且輸入的文字將被後續的頁面載入程式碼重設。解決此問題的正確方法是確保在 hydration 之後，當頁面完全正常運作時，停用所有互動式控制項。

等待導覽​

按一下元素可能會觸發多次導覽。在這些情況下，建議明確使用 page.wait_for_url() 等待特定 URL。

page.get_by_text("Click me").click()
page.wait_for_url("**/login")

Playwright 將頁面中顯示新文件的過程分為導覽和載入。

導覽開始於變更頁面 URL 或與頁面互動（例如，按一下連結）。導覽意圖可能會被取消，例如，在遇到未解析的 DNS 位址時，或轉換為檔案下載。

當回應標頭已剖析且工作階段記錄已更新時，導覽已提交。只有在導覽成功（已提交）之後，頁面才會開始載入文件。

載入涵蓋透過網路取得剩餘的回應主體、剖析、執行指令碼和觸發載入事件

  • page.url 設定為新的 URL
  • 文件內容透過網路載入並剖析
  • page.on("domcontentloaded") 事件已觸發
  • 頁面執行一些指令碼並載入資源，例如樣式表和圖片
  • page.on("load") 事件已觸發
  • 頁面執行動態載入的指令碼