《最新出爐》系列初窺篇-Python+Playwright自動化測試-32-JavaScript的呼叫執行-下篇

宏哥發表於2023-11-22
PythonJavaScript

1.簡介

 在實際工作中，我們需要對處理的元素進行高亮顯示，或者有時候為了看清楚操作過程和步驟我們需要跟蹤滑鼠點選了哪些元素需要標記出來。雖然很少遇到，但是為了以後大家可以參考或者提供一種思路，今天宏哥就在這裡把這種測試場景playwright是如何處理的講解和分享一下。

2.用法

上一篇中就提到過，這裡提取一下，語法如下：

# 原生js
js = '原生js;'
# 呼叫js
page.evaluate(js)

3.場景三

利用JS處理元素高亮顯示。其實這個前邊在程式碼中也有實現過，只不過沒有提到可能沒有注意或者看到過，宏哥在這裡就講解一下。

3.1程式碼設計

3.2參考程式碼

# coding=utf-8?

# 1.先設定編碼，utf-8可支援中英文，如上，一般放在第一行

# 2.註釋：包括記錄建立時間，建立人，專案名稱。
'''
Created on 2023-11-11
@author: 北京-宏哥   QQ交流群：705269076
公眾號：北京宏哥
Project: 《最新出爐》系列初窺篇-Python+Playwright自動化測試-31-JavaScript的呼叫執行-下篇
'''

# 3.匯入模組
from playwright.sync_api import sync_playwright

with sync_playwright() as p:
    browser = p.chromium.launch(headless=False)
    page = browser.new_page()
    page.goto("https://www.baidu.com/")
    #定位點選登入
    #page.pause()
    page.locator("#s-top-loginbtn").click()
    page.locator("#TANGRAM__PSP_11__userName").fill("北京-宏哥")
    #設定顏色
    usernamejs ="var u = document.getElementById('TANGRAM__PSP_11__userName').style.background = 'yellow'; var u1=document.getElementById('TANGRAM__PSP_11__userName').style.border = '2px solid red'"
    page.evaluate(usernamejs)
    passwordjs = "var u = document.getElementById('TANGRAM__PSP_11__password').style.background = 'yellow'"
    page.evaluate(passwordjs)
    submitjs = "var u = document.getElementById('TANGRAM__PSP_11__submit').style.background = 'yellow'"
    page.evaluate(submitjs)
    page.wait_for_timeout(3000)
    # page.pause()
    browser.close()

3.3執行程式碼

1.執行程式碼，右鍵Run'Test'，控制檯輸出，如下圖所示：

2.執行程式碼後電腦端的瀏覽器的動作。如下圖所示：

4.小結

 宏哥今天講解的這種辦法優點是：可以幫你清楚的看到那些功能執行了，那些沒有執行，對滑鼠都點選走過的路線進行一個追蹤。缺點是：前期需要編寫程式碼新增顏色以及要熟悉JavaScript語法和css知識。好了，時間不早了，今天就分享和講解到這裡，感謝大家耐心的閱讀，喜歡宏哥的，別忘記在文章末尾支援一下。

相關文章