1. 程式人生 > >Autofill chrome 表格自動填充

Autofill chrome 表格自動填充

簡單配置 必須 bst 執行 個性化定制 匹配 賬號 入口 建立

轉自:https://blog.csdn.net/com542948180/article/details/78832494

背景

  公司CD Team團隊執行測試時需要填寫多到10來個的表單頁面,如果每個表單都靠人工一個一個去輸入那勢必會非常的繁瑣,帶來非常多的工作量,而且原來的ART工具也無法在新的站點上使用,所以急需一個類似ART的工具,有自動填寫表單的功能。

Autofill 介紹

  Autofill 正是一個只需要前期簡單配置,便可以輔助填寫表單的Chrome 瀏覽器插件。

Autofill 簡單原理介紹

  Autofill 其實是通過用戶在配置界面配置的網址,控件定位方式,控件類型,控件操作內容從而通過這些信息去執行JS腳本以達到自動填充表單的目的。

安裝

  既然是Chrome的一個插件,那麽只需要進入到Chrome網上應用商店搜索“Autofill”便可以找到,當前最新版是v7.1,這裏直接給地址:https://chrome.google.com/webstore/detail/autofill/nlmmgnhgdeffjkdckmikfpnddkbbfkkk?utm_source=chrome-app-launcher-info-dialog
註意:國內需要Chrome 插件安裝需要FQ

技術分享圖片

Paste_Image.png

點擊【添加至CHROME】等待安裝完成便可。

技術分享圖片

Paste_Image.png

界面介紹

  安裝完Autofill 後,會在Chrome瀏覽器右上角出現一個閃電圖標,右鍵圖標點擊選項打開Aufofill 配置界面:

技術分享圖片

Paste_Image.png

  Autofill配置界面相對還是比較簡潔,分為四大塊:

  1. Form Fields(表單字段):最主要的配置界面,用於配置自動填表單的信息。
  2. Expressions(例外):用於設置你不想自動填寫表單的網頁地址,支持正則。
  3. Other Stuff(其它標簽):這裏有一些高級設置,主要用於設置自動填表單規則和導入導出。
  4. Support(支持):這個主要是幫助文檔,還有一些快捷鍵列表。

技術分享圖片

Paste_Image.png

快速上手

  Autofill 提供了非常方便的錄制功能,可以快速生成配置文件。

錄制

  假設我們以Autofill提供的【練習表單頁面】為例子:http://www.tohodo.com/autofill/form.html
1.打開頁面,在需要自動填寫表單的控件中(支持下拉選項框,單選框,復選框,文本框)編輯內容,例如下:

技術分享圖片

Paste_Image.png

2.表單填寫完後右鍵:Autofill --> 為此頁面增加規則...

技術分享圖片

Paste_Image.png

3.如果是第一次使用,那麽在生成自動填充規則前,我們需要新建一個配置文件。

技術分享圖片

Paste_Image.png

4.創建完或者已經選取了一個配置文件,最後直接點擊 【生成自動填充規則】,這樣我們就根據填寫的表單生成一個配置文件,打開Autofill的設定中的表單字段可以查看到:

技術分享圖片

Paste_Image.png

使用配置文件,自動填充表單

  完成配置文件後,那麽我們就可以使用該配置文件來進行自動化填充。
進行自動填充工具提供了兩種模式既1.自動模式 2.手動模式, 默認為手動模式。

自動模式

  再次去刷新【練習表單頁面】,你會發現不管怎麽刷新我們錄制過的控件,總是會按我們錄制時的情況自動填充。

手動模式

  要使用手動模式,需要先到Autofill設定中的其他標簽-->高級選學校中勾選【開啟手動模式】。

技術分享圖片

Paste_Image.png

  開啟手動模式後,我們再次進入到【練習表單頁面】,刷新頁面,這時頁面表單就無法自動填充,如果想實現自動填充需要鼠標右鍵-->Autofill-->使用配置-->Test1,這時就可以完成自動化填表單操作。

技術分享圖片

Paste_Image.png

填充時是否覆蓋原來的內容

  有時我們的表單中已經有包含了一些內容,我們希望在自動填充時不去修改已填充的文本框,這時我們可以打開Autofill設定找到對應的配置文件,去掉【覆蓋非空字段】的勾選框便可。

技術分享圖片

Paste_Image.png

配置文件導入和導出

  Autofill 提供了配置文件的導入和導出功能,方便團隊成員間互相分享配置。
  導入和導出的入口都在其它標簽裏面。點擊導出可以把導出的文本copy到記事本或者保存成csv文件給夥伴。 導入可以把導出的文本copy到文本框點擊導入完成。 同時導出支持替換和追加,替換就是把自己原來的配置都刪除,玩玩全全使用導入的配置,追加則在原有的配置基礎上添加新導入的配置。

技術分享圖片

Paste_Image.png

增強配置文件

讓同一個配置支持多個站點

  如果A,B兩個網站存在相同的表單(空間定位方式也一樣),而你又不想因此建立多個配置文件,那麽可以修改配置文件中的站點,使之支持多個網站。 修改規則只需要添加 “|”後跟上其它站點地址。 例如下:

技術分享圖片

Paste_Image.png

內容變量設置

  通過錄制生成的配置文件中【內容】項是個固定值,然後實際使用中我們往往需要一些隨機數或者變量,例如創建賬號的表單,總是希望每次自動填表單自動生成的用戶名都是不一樣的,那麽Autofill提供了4種變量設置。
隨機數
隨機數生成分成純數字和數字與字符串結合兩種方式,語法如下:
1.隨機生成N位數字: {#N}
2.隨機生成N位字符串: {$N}

遞增 or 遞減
遞增:{1++}
遞減:{1000--}

隨機選取某個選項
從某些選項中隨機選取一個,進行填寫表單。 例如隨機從a,b,c,d中選取一個: {a|b|c|d}

獲取規則表中的值
也許我們會有這麽場景,我們的確認密碼文本框的值,必須等於文本框的值,那麽其實我們可以通過Autofill提供的獲取規則表中的值來解決,這裏主要提供了獲取配置文件中【名稱】【內容】的值。
例如下圖:通過{v7} 來獲取 上一個內容的值,當然如果想獲取名稱裏面的值,只需要{n7}便可,每個【名稱】和【內容】框的右上角都會對應一個值,而且唯一。

技術分享圖片

Paste_Image.png

個性化定制

  Autofill 提供了個性化定制或者說提供了執行JS的功能,我們可以寫一段JS 放入配置文件中,那麽配置文件被執行時會自動執行這段JS。
具體步驟如下圖:

  1. 點擊 + 號圖標,添加一條配置
  2. 類型全球JavaScript類型
  3. 在內容中把調試通過的JS黏貼進去
  4. 配置要執行JS的站點

    技術分享圖片

    Paste_Image.png

執行效果:

技術分享圖片

Paste_Image.png

補充:在錄制生成或者手工編寫的配置中的【名稱】既定位方式,其匹配優先級由高到底為:name,id,placeholder,title,class,同時可以使用正則表達式。

小結

與手工對比優勢:

  1. 節約大量時間,由原來純手工測試1個case半小時左右的執行時間縮短到只需要10分鐘左右。
  2. 可以預先設置規則
  3. 避免重復操作

與ART對比優勢:

  1. 支持medicare網站
  2. 通用性更強
  3. 更容易維護

不足:

  1. 缺乏快捷鍵選取配置文件
  2. 值支持原生JS,不支持jquery等框架

更多詳細幫助,可以參考Autofill在線幫助文檔:http://www.tohodo.com/autofill/help-chrome.html

Autofill chrome 表格自動填充