在UI自動化測試中，有時候會遇到頁面元素無法定位的問題，包括xpath等方法都無法定位，是因為前端元素被設置為不可見導致。
這篇博客，介紹下如何通過JavaScript修改頁面元素屬性來定位的方法。。。
1、具體問題
常見的頁面元素不可見導致的不可定位，都是由於下面的問題：
通過查看相關文檔，可以看出display:none方法是設置元素不可見，這就是導致為什么通過定位頁面元素無法定位的原因。
關於display更多的信息，可以看這里：HTML DOM display用法
2、解決方案
對於這種問題，可以通過JavaScript修改頁面元素屬性來將元素置位可見，然后通過id、classname等方法去定位，示例代碼如下（針對上圖所示）：
js = "document.getElementById(\"txtPassword\").style.display='block';"
# 調用js腳本
driver.execute_script(js) sleep(3) driver.find_element_by_id("txtPassword").send_keys("123456")
代碼解析：
首先通過selenium封裝好的方法document去找到display元素，document提供以下方法來定位display元素：
getElementById()：返回對指定ID第一個對象的引用
getElementsByName() ：返回帶有指定名稱的對象集合
getElementsByTagName()：返回帶有指定標簽名的對象集合
關於document更多的信息，可以看這里：HTML DOM getElement()方法
上面我定義了一個js變量，然后通過getElementById()方法去引用display元素，修改none屬性為block屬性（作為塊級元素顯示），然后通過selenium自帶的execute_script方法執行腳本。
最后，當元素屬性置為可見時，可以通過ID去定位元素。
其實還有一個解決方案：讓前端修改display:none為block就好了，但這樣的話，帶來的變化和安全風險又是需要考慮的問題。一個問題的解決總是伴隨着新的問題，核裂變了解一下？
想起今天和同行聊天時說起的分裂BUG的話題，對話如下：
大佬N：核裂變的原理是通過中子撞擊原子核產生多個新的原子核，原子核是已有的BUG，中子是修改BUG加上的代碼，分裂之后這個bug消失了，取而代之的是更多的原子核（BUG）。。。
我：引起一個BUG的原因可能是多個，修改一段代碼可能造成多個BUG，就像用新技術解決舊問題而帶來的新問題一個意思。。。
自動化本身最大的挑戰還是變化，因此從分層測試角度結合公司項目具體情況，考慮解決問題的方法，才是最好的選擇。