انتقل إلى المحتوى الرئيسي

مخرجات الاختبار

معلومات

تم استخدام موقع WebdriverIO التجريبي للحصول على مثال لمخرجات الصور.

enableLayoutTesting​

يمكن تعيين هذا في خيارات الخدمة وكذلك على مستوى الطريقة.

// wdio.conf.(js|ts)
export const config = {
    // ...
    // =====
    // Setup
    // =====
    services: [
        [
            'visual',
            {
                enableLayoutTesting: true
            }
        ]
    ]
    // ...
}

مخرجات الصور لـ خيارات الخدمة متساوية مع الطريقة، انظر أدناه.

مخرجات الصور​

await browser.saveElement(".features_vqN4", "example-element-tag", {enableLayoutTesting: true})
// Or
await browser.checkElement(".features_vqN4", "example-element-tag", {enableLayoutTesting: true})

saveElement Desktop

save(Screen/Element/FullPageScreen)​

مخرجات وحدة التحكم​

ستوفر طرق save(Screen/Element/FullPageScreen) المعلومات التالية بعد تنفيذ الطريقة:

const saveResult = await browser.saveFullPageScreen({ ... })
console.log(saveResults)
/**
 * {
 *   // The device pixel ratio of the instance that has run
 *   devicePixelRatio: 1,
 *   // The formatted filename, this depends on the options `formatImageName`
 *   fileName: "examplePage-chrome-latest-1366x768.png",
 *   // The path where the actual screenshot file can be found
 *   path: "/path/to/project/.tmp/actual/desktop_chrome",
 * };
 */

مخرجات الصور​

await browser.saveElement(".hero__title-logo", "example-element-tag")

saveElement Desktop

check(Screen/Element/FullPageScreen)​

مخرجات وحدة التحكم​

بشكل افتراضي، ستوفر طرق check(Screen/Element/FullPageScreen) فقط نسبة عدم التطابق مثل 1.23، ولكن عندما يكون للبرنامج المساعد خيار returnAllCompareData: true، يتم توفير المعلومات التالية بعد تنفيذ الطريقة:

const checkResult = await browser.checkFullPageScreen({ ... })
console.log(checkResult)
/**
 * {
 *     // The formatted filename, this depends on the options `formatImageName`
 *     fileName: "examplePage-chrome-headless-latest-1366x768.png",
 *     folders: {
 *         // The actual folder and the file name
 *         actual: "/path/to/project/.tmp/actual/desktop_chrome/examplePage-chrome-headless-latest-1366x768.png",
 *         // The baseline folder and the file name
 *         baseline:
 *             "/path/to/project/localBaseline/desktop_chrome/examplePage-chrome-headless-latest-1366x768.png",
 *         // This following folder is optional and only if there is a mismatch
 *         // The folder that holds the diffs and the file name
 *         diff: "/path/to/project/.tmp/diff/desktop_chrome/examplePage-chrome-headless-latest-1366x768.png",
 *     },
 *     // The mismatch percentage
 *     misMatchPercentage: 2.34,
 * };
 */

مخرجات الصور​

معلومات

ستظهر الصور أدناه فقط الاختلافات كنتيجة لتشغيل أوامر الفحص. يتم عرض الاختلافات فقط في متصفح، ولكن المخرجات لنظامي Android و iOS هي نفسها.

await browser.checkElement("#__docusaurus_skipToContent_fallback > header > div > div.buttons_pzbO > a:nth-child(1)", "example-element-tag")
معلومات

تم تغيير نص الزر من Get Started إلى Getting Started! وتم اكتشافه كتغيير.

Button Check Result

حجب مناطق معينة (Block-Outs)​

ستجد هنا مثالاً على مخرجات حجب مناطق معينة في Android NativeWebScreenshot و iOS حيث تم حجب شريط الحالة+العنوان وشريط الأدوات.

Blockouts Android

Welcome! How can I help?

WebdriverIO AI Copilot