เว็บเอสเปรสโซ

Espresso-Web เป็นจุดแรกเข้าในการทำงานร่วมกับคอมโพเนนต์ UI ของ Android WebView Espresso-Web จะใช้ Atom จาก WebDriver API ยอดนิยมเพื่อตรวจสอบและควบคุมลักษณะการทำงานของ WebView

ก่อน

เมื่อใดควรใช้ Espresso-Web

ใช้ Espresso-Web เพื่อทดสอบแอปแบบไฮบริดของคุณ โดยเฉพาะการผสานรวม คอมโพเนนต์ UI แบบดั้งเดิมของแอปที่มี WebView คอมโพเนนต์ UI คุณสามารถใช้ Espresso-Web API ร่วมกับ Espresso API เพื่อโต้ตอบกับองค์ประกอบเว็บภายในออบเจ็กต์ WebView อย่างเต็มรูปแบบ

หากคุณต้องการทดสอบเฉพาะ WebView เอง และไม่ต้อง การโต้ตอบระหว่าง WebView และคอมโพเนนต์แบบเนทีฟในแอป การเขียนการทดสอบเว็บทั่วไปโดยใช้เฟรมเวิร์กอย่าง WebDriver หากคุณใช้เฟรมเวิร์กการทดสอบเว็บ คุณจะไม่ดำเนินการดังนี้ คุณต้องใช้อุปกรณ์ Android หรือ Java Virtual Machine ซึ่งทำการทดสอบ ให้ทำงานได้รวดเร็วและเชื่อถือได้มากขึ้น นอกจากนี้ Espresso-Web ยังช่วยให้คุณสามารถ อะตอม WebDriver ที่กำหนดเองของคุณ ซึ่งมอบความยืดหยุ่นให้กับคุณอย่างมาก โดยเฉพาะอย่างยิ่ง เมื่อเขียนการทดสอบที่คุณวางแผนจะทำกับทั้งเว็บแอปแบบสแตนด์อโลน แอปที่มี UI ของ Android

วิธีการทำงาน

คล้ายกับ onData() ของ Espresso การโต้ตอบ WebView ประกอบด้วย Atom หลายตัว การโต้ตอบ WebView รายการใช้ทั้งภาษาโปรแกรม Java และ บริดจ์ JavaScript ในการทำงาน เนื่องจากไม่มีโอกาสได้แนะนำ การแข่งขันด้วยการเปิดเผยข้อมูล จากสภาพแวดล้อมของ JavaScript Espresso ที่เห็นในฝั่ง Java เป็นสำเนาที่แยกออกมา โดยส่งคืนข้อมูลจาก Web.WebInteraction รองรับออบเจ็กต์อย่างสมบูรณ์ ทำให้คุณสามารถยืนยันข้อมูลทั้งหมดที่ส่งคืนจาก คำขอ

WebDriver Atom คืออะไร

เฟรมเวิร์ก WebDriver ใช้ Atoms ในการค้นหาและจัดการองค์ประกอบเว็บ แบบเป็นโปรแกรม WebDriver จะใช้ Atoms เพื่ออนุญาตให้มีการปรับเปลี่ยนเบราว์เซอร์ CANNOT TRANSLATE Atom มีลักษณะคล้ายคลึงกัน ViewAction ชื่อย่อย หน่วยโฆษณาที่ดำเนินการใน UI ของคุณ คุณแสดง Atom โดยใช้รายการของ วิธีการที่กำหนดไว้ เช่น findElement() และ getElement() เบราว์เซอร์จากมุมมองของผู้ใช้ แต่ถ้าคุณใช้ WebDriver เฟรมเวิร์กโดยตรง Atoms จะต้องมีการจัดการเป็นกลุ่มอย่างเหมาะสม ซึ่งต้องใช้ตรรกะที่ มีรายละเอียดมาก

ใน Espresso ชั้นเรียน Web และ Web.WebInteraction รวมข้อความต้นแบบนี้และให้ความรู้สึกเหมือนเอสเปรสโซในการโต้ตอบกับ WebView ออบเจ็กต์ ดังนั้นในบริบทของ WebView ระบบจะใช้ Atom เป็น ที่ใช้แทนเอสเปรสโซ ViewMatchers และ ViewActions แบบดั้งเดิม

API ที่ดูเรียบง่าย:

KotlinJava
onWebView()
    .withElement(Atom)
    .perform(Atom)
    .check(WebAssertion)
 
onWebView()
    .withElement(Atom)
    .perform(Atom)
    .check(WebAssertion);

หากต้องการดูข้อมูลเพิ่มเติม โปรดอ่านเอกสารประกอบของ Selenium เกี่ยวกับ Atoms

ใช้ WebView

ทำตามคำแนะนำที่แสดงในส่วนต่อไปนี้เพื่อทำงาน WebView ในการทดสอบของแอป

แพ็กเกจ

หากต้องการรวม Espresso-Web ไว้ในโครงการ ให้ทำตามขั้นตอนต่อไปนี้

  1. เปิดไฟล์ build.gradle ของแอป ซึ่งปกติแล้วจะไม่ใช่ค่า ระดับบนสุด build.gradle ไฟล์แต่ app/build.gradle

  2. เพิ่มบรรทัดต่อไปนี้ภายในทรัพยากร Dependency

    ดึงดูดKotlin
        androidTestImplementation 'androidx.test.espresso:espresso-web:3.6.1'
        
        androidTestImplementation('androidx.test.espresso:espresso-web:3.6.1')
       

  3. Espresso-Web สามารถใช้ได้เฉพาะกับ Espresso 2.2 ขึ้นไป และ เวอร์ชัน 0.3 ขึ้นไปของไลบรารีการทดสอบ ดังนั้นอย่าลืมอัปเดต ด้วย:

    ดึงดูดKotlin
        androidTestImplementation 'androidx.test:runner:1.6.1'
        androidTestImplementation     'androidx.test:rules:1.6.1'
        androidTestImplementation     'androidx.test.espresso:espresso-core:3.6.1'
        
        androidTestImplementation('androidx.test:runner:1.6.1')
        androidTestImplementation    ('androidx.test:rules:1.6.1')
        androidTestImplementation    ('androidx.test.espresso:espresso-core:3.6.1')
       

การใช้งาน API ทั่วไป

onWebView() เป็นวิธีแรกเข้าหลักเมื่อทำงานกับ WebView บน Android โดยใช้ เอสเพรสโซ คุณใช้วิธีนี้เพื่อทำการทดสอบ Espresso-Web เช่น ดังต่อไปนี้:

KotlinJava
onWebView()
    .withElement(findElement(Locator.ID, "link_2")) // similar to onView(withId(...))
    .perform(webClick()) // Similar to perform(click())

    // Similar to check(matches(...))
    .check(webMatches(getCurrentUrl(), containsString("navigation_2.html")))
 
onWebView()
    .withElement(findElement(Locator.ID, "link_2")) // similar to onView(withId(...))
    .perform(webClick()) // Similar to perform(click())

    // Similar to check(matches(...))
    .check(webMatches(getCurrentUrl(), containsString("navigation_2.html")));

ในตัวอย่างนี้ Espresso-Web จะค้นหาองค์ประกอบ DOM ที่มีรหัสเป็น "link_2" และ ก็คลิกได้ จากนั้นเครื่องมือจะยืนยันว่า WebView ส่งคำขอ GET ที่มีสตริง "navigation_2.html"

การรองรับ JavaScript

เมื่อทำการทดสอบ ระบบจะดำเนินการโต้ตอบกับ WebView ทั้งหมดโดยใช้ JavaScript ดังนั้น เพื่อรองรับการประเมิน JavaScript WebView ที่อยู่ระหว่างการทดสอบ ต้องเปิดใช้งาน JavaScript

คุณสามารถบังคับให้เปิด JavaScript ด้วยการเรียก forceJavascriptEnabled() เป็นการกระทำของคุณในกิจกรรมของคุณภายใต้ test ดังที่แสดงใน โค้ดต่อไปนี้

@RunWith(AndroidJUnit4::class)
class MyTestSuite {
    @get:Rule val activityScenarioRule =
        activityScenarioRule<MyWebViewActivity>()

    @Test fun testWebViewInteraction() {
        onWebView().forceJavascriptEnabled()
    }
}

การโต้ตอบทั่วไปบนเว็บ

การโต้ตอบทั่วไปกับออบเจ็กต์ Web.WebInteraction มีดังนี้

  • withElement() อ้างอิงองค์ประกอบ DOM ภายใน WebView

    ตัวอย่าง

    KotlinJava
    onWebView().withElement(findElement(Locator.ID, "teacher"))
     
    onWebView().withElement(findElement(Locator.ID, "teacher"));

  • withContextualElement() อ้างอิงองค์ประกอบ DOM ที่มีขอบเขต ภายใน WebView ซึ่งสัมพันธ์กับองค์ประกอบ DOM อื่น คุณควรโทรหา withElement() ก่อนเพื่อสร้างข้อมูลอ้างอิง ออบเจ็กต์ Web.WebInteraction (องค์ประกอบ DOM)

    ตัวอย่าง

    KotlinJava
    .withElement(findElement(Locator.ID, "teacher"))
            .withContextualElement(findElement(Locator.ID, "person_name"))
     
    .withElement(findElement(Locator.ID, "teacher"))
            .withContextualElement(findElement(Locator.ID, "person_name"));

  • check() ประเมินเงื่อนไขเพื่อให้แน่ใจว่าแก้ไขได้ ไปยัง true

    ตัวอย่าง

    KotlinJava
    onWebView()
            .withElement(findElement(Locator.ID, "teacher"))
            .withContextualElement(findElement(Locator.ID, "person_name"))
            .check(webMatches(getText(), containsString("Socrates")))
     
    onWebView()
            .withElement(findElement(Locator.ID, "teacher"))
            .withContextualElement(findElement(Locator.ID, "person_name"))
            .check(webMatches(getText(), containsString("Socrates")));

  • perform() ดำเนินการบางอย่างภายใน WebView เช่น คลิกองค์ประกอบ

    ตัวอย่าง

    KotlinJava
    onWebView()
            .withElement(findElement(Locator.ID, "teacher"))
            .perform(webClick())
     
    onWebView()
            .withElement(findElement(Locator.ID, "teacher"))
            .perform(webClick());

  • reset() เปลี่ยน WebView กลับเป็นสถานะเริ่มต้น ซึ่งเป็นสิ่งจำเป็นเมื่อ การกระทำ เช่น การคลิก จะทำให้เกิดการเปลี่ยนแปลงการนำทาง เข้าถึงออบเจ็กต์ ElementReference และ WindowReference ไม่ได้

    หมายเหตุ: แม้ว่าการใช้ reset() จะมีประโยชน์ในกรณีต่อไปนี้ การยืนยันเวิร์กโฟลว์แบบหลายหน้า เช่น การส่งแบบฟอร์ม การทดสอบของคุณควรถูกจำกัดอยู่ในขอบเขตและเน้นไปที่หน้าเว็บหน้าเดียว

    ตัวอย่าง

    KotlinJava
    onWebView()
            .withElement(...)
            .perform(...)
            .reset()
     
    onWebView()
            .withElement(...)
            .perform(...)
            .reset();

ตัวอย่าง

ตัวอย่างต่อไปนี้จะทดสอบว่าหลังจากป้อนข้อความลงใน WebView แล้วหรือไม่ เมื่อเลือกปุ่มส่ง ข้อความเดียวกันจะปรากฏในองค์ประกอบอื่นใน WebView เดียวกัน

KotlinJava
const val MACCHIATO = "Macchiato"

@RunWith(AndroidJUnit4::class)
class MyEspressoWebTestSuite {

    @Test fun typeTextInInput_clickButton_SubmitsForm() {
        // Create an intent that displays a web form.
        val webFormIntent = Intent()
        // ...

        // Lazily launch the Activity with a custom start Intent per test.
        ActivityScenario.launchActivity(webFormIntent)

        // Selects the WebView in your layout. If you have multiple WebView
        // objects, you can also use a matcher to select a given WebView,
        // onWebView(withId(R.id.web_view)).
        onWebView()
            // Find the input element by ID.
            .withElement(findElement(Locator.ID, "text_input"))

            // Clear previous input and enter new text into the input element.
            .perform(clearElement())
            .perform(DriverAtoms.webKeys(MACCHIATO))

            // Find the "Submit" button and simulate a click using JavaScript.
            .withElement(findElement(Locator.ID, "submitBtn"))
            .perform(webClick())

            // Find the response element by ID, and verify that it contains the
            // entered text.
            .withElement(findElement(Locator.ID, "response"))
            .check(webMatches(getText(), containsString(MACCHIATO)))
    }
}
 
public static final String MACCHIATO = "Macchiato";

@Test
public void typeTextInInput_clickButton_SubmitsForm() {
    // Create an intent that displays a web form.
    Intent webFormIntent = new Intent();
    // ...

    // Lazily launch the Activity with a custom start Intent per test.
    ActivityScenario.launchActivity(webFormIntent);

    // Selects the WebView in your layout. If you have multiple WebView objects,
    // you can also use a matcher to select a given WebView,
    // onWebView(withId(R.id.web_view)).
    onWebView()
        // Find the input element by ID.
        .withElement(findElement(Locator.ID, "text_input"))

        // Clear previous input and enter new text into the input element.
        .perform(clearElement())
        .perform(DriverAtoms.webKeys(MACCHIATO))

        // Find the "Submit" button and simulate a click using JavaScript.
        .withElement(findElement(Locator.ID, "submitBtn"))
        .perform(webClick())

        // Find the response element by ID, and verify that it contains the
        // entered text.
        .withElement(findElement(Locator.ID, "response"))
        .check(webMatches(getText(), containsString(MACCHIATO)));
}

แหล่งข้อมูลเพิ่มเติม

หากต้องการข้อมูลเพิ่มเติมเกี่ยวกับการใช้ Espresso-Web ในการทดสอบ Android โปรดดู แหล่งข้อมูลต่อไปนี้

ตัวอย่าง

  • WebBasicSample: ใช้ Espresso-Web เพื่อโต้ตอบกับออบเจ็กต์ WebView รายการ