首頁 > 軟體

python playwright之元素定位範例詳解

2022-07-23 18:01:22

定位篇

UI 自動化很多時候的苦惱都是定位不到,其實說實話我到現在有時候也是莫名其妙的定位到或者定位不到。好在這個框架定位方式的上限非常以及特別的高,這就像人有錢和沒錢的區別主要在於選擇權一樣,有選擇的人生才是幸福的。出門想開法拉利就開法拉利,想開拖拉機就開拖拉機。

定位的詳細介紹

1、官方是不推薦 xpath 和 css 的,原話意思是 CSS 和 XPATH 是繫結於 DOM 上的,當 DOM 結構出現更改他們將失效。

2、文字內容,輸入框內的 placeholder,labels 等這些我們可以理解成面向業務的屬性這些反而不那麼容易改變所以定位應該儘量的去面向業務。

文字選擇器定位

下文這樣是一個基礎的文字定位 特點有

1、模糊匹配

2、不缺分英文的大小寫

3、如果存在多個會報錯

page.locator("text=社群").click()

也可以使用簡寫的方式,注意其中的單引號

page.locator("'Log in'").click()

比較精準的方式,點選 id=main-nav-menu 包含的元素裡文字='社群'的元素,這裡使用了 text() 偽類

page.locator("#main-nav-menu :text('社群')").click()

結合 CSS 使用,僅匹配 article 元素

page.locator('article:has-text("All products")').click()

CSS 選擇器定位

點選 button 按鈕

page.locator("button").click()

通過屬性定位,點選屬性中存在 href="/topics"的元素

page.locator('[href="/topics" rel="external nofollow"  rel="external nofollow" ]').click()

通過屬性精準定位:點選 ID=nav-bar 元素下的 href="/topics"的元素

page.locator('#main-nav-menu [href="/topics" rel="external nofollow"  rel="external nofollow" ]').click()

通過 placeholder 定位以及輸入

page.locator('[placeholder="搜尋"]').fill('電子校的故事')

佈局定位結合 CSS,也是我最喜歡的

page.locator("input:right-of(:text('開源專案'))").fill('電子校的故事')

非常的實用,尤其是在我們經常測的管理系統裡邊 dialog 裡,只要左側的 label 不變~ 程式碼就不用改

解釋下上邊這段程式碼,大家一邊看程式碼一邊把頭往顯示器的右上偏左側看下。

定位的的呢是一個 Input,一個在文字為'開源專案'右側的 input。

同理這裡可以使用:right-of、:left-of、:above、:below、:near 這幾種佈局定位的方式

根據元素可用

點選一個可用的 button

page.locator("button:visible").click()
page.locator("button >> visible=true").click()

繼續說說屬性

點選一個按鈕,它的文字包含了 Click me。另這裡也可使用正規表示式

page.locator("button", has_text="Click me").click()

以上就是python playwright之元素定位範例詳解的詳細內容,更多關於python playwright元素定位的資料請關注it145.com其它相關文章!


IT145.com E-mail:sddin#qq.com