方法選項
方法選項是每個方法可以設定的選項。如果選項的鍵與外掛程式實例化期間設定的選項相同,則此方法選項會覆寫外掛程式選項值。
儲存選項
disableCSSAnimation
- 類型:
boolean
- 必要: 否
- 預設值:
false
- 使用於: 所有方法
- 支援: 網頁、混合應用程式 (Webview)
啟用/停用應用程式中的所有 CSS 動畫和輸入插入符號。如果設定為 true,則在拍攝螢幕擷取畫面之前,所有動畫都將停用,並在完成後重設
enableLayoutTesting
- 類型:
boolean
- 必要: 否
- 預設值:
false
- 使用於: 所有方法
- 支援: 網頁
這會隱藏頁面上的所有文字,因此只會使用版面配置進行比較。隱藏將透過在每個元素上新增樣式 'color': 'transparent !important'
來完成。
有關輸出,請參閱測試輸出
透過使用此旗標,每個包含文字的元素(因此不僅是 p, h1, h2, h3, h4, h5, h6, span, a, li
,還有 div|button|..
)都會取得此屬性。沒有選項可以自訂此設定。
hideScrollBars
- 類型:
boolean
- 必要: 否
- 預設值:
true
- 使用於: 所有方法
- 支援: 網頁、混合應用程式 (Webview)
隱藏應用程式中的捲軸。如果設定為 true,則會在拍攝螢幕擷取畫面之前停用所有捲軸。為了避免額外的問題,預設設定為 true
。
hideElements
- 類型:
array
- 必要: 否
- 使用於: 所有方法
- 支援: 網頁、混合應用程式 (Webview)、原生應用程式
此方法可以透過提供元素陣列,將屬性 visibility: hidden
新增至 1 個或多個元素,以隱藏這些元素。
removeElements
- 類型:
array
- 必要: 否
- 使用於: 所有方法
- 支援: 網頁、混合應用程式 (Webview)、原生應用程式
此方法可以透過提供元素陣列,將屬性 display: none
新增至 1 個或多個元素,以移除這些元素。
resizeDimensions
- 類型:
object
- 必要: 否
- 預設值:
{ top: 0, right: 0, bottom: 0, left: 0}
- 使用於: 僅適用於
saveElement
或checkElement
- 支援: 網頁、混合應用程式 (Webview)、原生應用程式
一個物件,需要保存 top
、right
、bottom
和 left
的像素數量,這些像素數量需要使元素剪裁區域變大。
fullPageScrollTimeout
- 類型:
number
- 必要: 否
- 預設值:
1500
- 使用於: 僅適用於
saveFullPageScreen
或saveTabbablePage
- 支援: 網頁
捲動後等待的逾時時間,以毫秒為單位。這可能有助於識別具有延遲載入的頁面。
hideAfterFirstScroll
- 類型:
array
- 必要: 否
- 使用於: 僅適用於
saveFullPageScreen
或saveTabbablePage
- 支援: 網頁
此方法將透過提供元素陣列,將屬性 visibility: hidden
新增至 1 個或多個元素,以隱藏這些元素。當頁面例如具有在頁面捲動時會隨之捲動的黏性元素時,這會非常方便,但製作全頁螢幕擷取畫面時,會產生令人煩惱的效果
waitForFontsLoaded
- 類型:
boolean
- 必要: 否
- 預設值:
true
- 使用於: 所有方法
- 支援: 網頁、混合應用程式 (Webview)
字型(包括第三方字型)可以同步或非同步載入。非同步載入表示字型可能會在 WebdriverIO 判斷頁面已完全載入後載入。為了防止字型轉譯問題,預設情況下,此模組會在拍攝螢幕擷取畫面之前,等待所有字型載入。
比較(檢查)選項
比較選項是影響比較方式的選項,比較方式由ResembleJS執行。
- 「儲存選項」中的所有選項都可用於比較方法
- 所有比較選項都可以在服務實例化期間或每個單獨的檢查方法中使用。如果方法選項的鍵與服務實例化期間設定的選項相同,則方法比較選項會覆寫服務比較選項值。
- 所有選項都可用於
- 網頁
- 混合應用程式
- 原生應用程式
ignoreAlpha
- 類型:
boolean
- 預設值:
false
- 必要: 否
比較影像並捨棄 alpha。
blockOutSideBar
- 類型:
boolean
- 預設值:
true
- 必要: 否
- 備註: 只能用於
checkScreen()
。這僅適用於 iPad
在比較期間,自動封鎖橫向模式中 iPad 的側邊欄。這可防止在索引標籤/私人/書籤原生元件上發生失敗。
blockOutStatusBar
- 類型:
boolean
- 預設值:
true
- 必要: 否
- 備註: 這僅適用於 行動裝置
在比較期間,自動封鎖狀態列和網址列。這可防止在時間、wifi 或電池狀態上發生失敗。
blockOutToolBar
- 類型:
boolean
- 預設值:
true
- 必要: 否
- 備註: 這僅適用於 行動裝置
自動封鎖工具列。
ignoreAntialiasing
- 類型:
boolean
- 預設值:
false
- 必要: 否
比較影像並捨棄反鋸齒。
ignoreColors
- 類型:
boolean
- 預設值:
false
- 必要: 否
即使影像為彩色,比較也會比較 2 個黑/白影像
ignoreLess
- 類型:
boolean
- 預設值:
false
- 必要: 否
比較影像並以 red = 16, green = 16, blue = 16, alpha = 16, minBrightness=16, maxBrightness=240
進行比較
ignoreNothing
- 類型:
boolean
- 預設值:
false
- 必要: 否
比較影像並以 red = 0, green = 0, blue = 0, alpha = 0, minBrightness=0, maxBrightness=255
進行比較
rawMisMatchPercentage
- 類型:
boolean
- 預設值:
false
- 必要: 否
如果為 true,則傳回的百分比將會像 0.12345678
,預設值為 0.12
returnAllCompareData
- 類型:
boolean
- 預設值:
false
- 必要: 否
這將傳回所有比較資料,而不僅僅是差異百分比
saveAboveTolerance
- 類型:
number
- 預設值:
0
- 必要: 否
misMatchPercentage
的允許值,可防止儲存有差異的影像
largeImageThreshold
- 類型:
number
- 預設值:
0
- 必要: 否
比較大型影像可能會導致效能問題。當在此處為像素數提供數字(大於 0)時,當影像寬度或高度大於 largeImageThreshold
像素時,比較演算法會跳過像素。
scaleImagesToSameSize
- 類型:
boolean
- 預設值:
false
- 必要: 否
在執行比較之前,將 2 個影像縮放為相同大小。強烈建議啟用 ignoreAntialiasing
和 ignoreAlpha
資料夾選項
基準資料夾和螢幕截圖資料夾(實際、差異)是在外掛程式或方法實例化期間可以設定的選項。若要在特定方法上設定資料夾選項,請將資料夾選項傳遞至方法選項物件。這可以用於
- 網頁
- 混合應用程式
- 原生應用程式
import path from 'node:path'
const methodOptions = {
actualFolder: path.join(process.cwd(), 'customActual'),
baselineFolder: path.join(process.cwd(), 'customBaseline'),
diffFolder: path.join(process.cwd(), 'customDiff'),
}
// You can use this for all methods
await expect(
await browser.checkFullPageScreen("checkFullPage", methodOptions)
).toEqual(0)
actualFolder
- 類型:
string
- 必要: 否
用於存放測試中擷取之快照的資料夾。
baselineFolder
- 類型:
string
- 必要: 否
用於存放作為比較基準的基準圖片的資料夾。
diffFolder
- 類型:
string
- 必要: 否
用於存放 ResembleJS 渲染的圖片差異的資料夾。