Menguasai pengembangan melalui pengujian di Android menggunakan tes UI

Latar Belakang

• Mengurangi waktu pengembangan
• Kode lebih sederhana, lebih bersih, dan lebih bisa dikelola
• Kode lebih andal dengan lebih percaya diri dalam pekerjaan kami.
• Cakupan tes yang lebih tinggi (ini terlihat agak jelas)

Langkah pertama

class LoginActivity: AppCompatActivity(), LoginContract.View {

    @Inject lateinit var loginPresenter: LoginContract.Presenter

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_login)
    }

    override fun setPresenter(presenter: LoginContract.Presenter) {
        loginPresenter = presenter
    }

    override fun showServerErrorMessage() {
        TODO("not implemented")
    }

    override fun showGeneralErrorMessage() {
        TODO("not implemented")
    }

    override fun showProgress() {
        TODO("not implemented")
    }

    override fun hideProgress() {
        TODO("not implemented")
    }

    override fun showInvalidEmailMessage() {
        TODO("not implemented")
    }

    override fun hideInvalidEmailMessage() {
        TODO("not implemented")
    }

    override fun showInvalidPasswordMessage() {
        TODO("not implemented")
    }

    override fun hideInvalidPasswordMessage() {
        TODO("not implemented")
    }

}

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <EditText
        android:id="@+id/input_email"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <EditText
        android:id="@+id/input_password"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <Button
        android:id="@+id/button_login"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

</LinearLayout>

<string name="error_message_invalid_email”>…</string>
<string name="error_message_invalid_password”>…</string>

Menambahkan Tes

• Ketika pengguna memasukkan alamat email yang tidak valid di bidang input email, kami perlu menampilkan pesan kesalahan. Jadi, kami akan menulis tes yang memeriksa apakah pesan kesalahan ini ditampilkan.
• Ketika pengguna mulai memasukkan data ke bidang input email lagi, pesan kesalahan di atas akan hilang - karena itu kita akan menulis tes untuk ini.
• Akhirnya, ketika API mengembalikan pesan kesalahan, itu harus ditampilkan dalam kotak dialog peringatan - jadi kami juga akan menambahkan tes untuk ini.

@Test
fun invalidEmailErrorHidesWhenUserTypes() {
    activity.launchActivity(null)

    onView(withId(R.id.button_login))
            .perform(click())

    onView(withId(R.id.input_email))
            .perform(typeText("j"))

    onView(withText(R.string.error_message_invalid_email))
            .check(doesNotExist())
}

@Test
fun invalidPasswordErrorDisplayed() {
    activity.launchActivity(null)

    onView(withId(R.id.button_login))
            .perform(click())

    onView(withText(R.string.error_message_invalid_password))
            .check(matches(isDisplayed()))
}

@Test
fun serverErrorMessageDisplays() {
    val response = ConnectResponseFactory.makeConnectResponseForError()
    stubConnectRepositorySignIn(Single.just(response))
    activity.launchActivity(null)

    onView(withId(R.id.input_email))
            .perform(typeText("joe@example.com"))

    onView(withId(R.id.input_password))
            .perform(typeText(DataFactory.randomUuid()))

    onView(withId(R.id.button_login))
            .perform(click())

    onView(withText(response.message))
            .check(matches(isDisplayed()))
}

• , , , , :

private fun setupLoginButtonClickListener() {
    button_login.setOnClickListener {
        loginPresenter.performSignIn(input_email.text.toString(),
                input_password.text.toString()) }
}

• , . TextInputLayout, , :

override fun showInvalidPasswordMessage() {
    layout_input_password.error = getString(R.string.error_message_invalid_password)
}

override fun showServerErrorMessage(message: String) {
    DialogFactory.createSimpleInfoDialog(this, R.string.error_message_login_title, message, 
            R.string.error_message_login_ok).show()
}

• Ketika pengguna mengklik tombol login dan alamat email tidak ada atau alamat email salah, kami menunjukkan pesan kesalahan kepada pengguna. Kami sudah menerapkan ini, saya hanya mengesampingkannya untuk kesederhanaan
• Namun, ketika pengguna mulai memasukkan data ke dalam bidang lagi, pesan kesalahan harus dihapus dari tampilan. Untuk melakukan ini, kita perlu mendengarkan ketika konten teks dari bidang input berubah:

private fun setupOnEmailTextChangedListener() {
    input_email.addTextChangedListener(object : TextWatcher {

        override fun afterTextChanged(s: Editable) {}

        override fun beforeTextChanged(s: CharSequence, start: Int,
                                       count: Int, after: Int) {
        }

        override fun onTextChanged(s: CharSequence, start: Int,
                                   before: Int, count: Int) {
            loginPresenter.handleEmailTextChanged(s)
        }
    })
}

Kesimpulan

• , , TDD . , . , Espresso (/, ), . activity, , , . .
• , , , , , , , . , , , , , ( , !). - . , , , - .
• , Ui- , , . , , , , , , .
• , . , — , , , - .
• Sepertinya lebih alami. Karena kenyataan bahwa TDD sudah digunakan untuk tes unit, Anda merasa sedikit terbelakang ketika Anda menulis tes unit, diikuti oleh implementasi, diikuti oleh tes UI. Anda akan merasa lebih alami dengan melangkah penuh dengan TDD, bukan di tengah jalan.