背景

公司A團隊執行測試時需要填寫多到10來個的表單頁面，如果每個表單都靠人工一個一個去輸入那勢必會非常的繁瑣，帶來非常多的工作量，所以急需一個能自動填寫表單的功能。

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 插件安裝需要翻墻

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

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

注意：這里只支持原生的JS 不支持Jquery等框架。

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

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