Why Test the Obvious?

Photo by Fabian Grohs on Unsplash

Halo guys, jadi sekarang kita sudah beralih menggunakan Bahasa Indonesia 🎉 dan di tulisan pertama saya dengan bahasa, saya akan membahas lebih lanjut soal the importance of testing yang lebih menjurus terhadap front-end. 

Front-end juga memiliki unit testing, tentang sebelum kita membangun aplikasi setiap fungsi yang kita miliki sudah dapat berjalan. Kemudian terdapat acceptance test untuk memastikan bahwa setiap fungsi yang ada berhubungan dengan baik dan bekerja seperti skenario yang ditentukan. Beberapa hal yang perlu dipastikan oleh front-end engineer sendiri di antara lain adalah, apakah component telah di-render sebagaimana mestinya, state dari sebuah component berubah seperti seharusnya setelah sebuah aksi, dan lain-lain. 

Apakah setiap hal ini sendiri penting dilakukan pada front-end? Memang masih ada beberapa yang mengatakan bahwa unit-testing tidak dapat atau perlu dilakukan untuk front-end, karena view dari front-end sendiri dapat dilihat secara jelas dan dicoba langsung. Menurut saya sendiri, hal ini tergantung dari scope dan kompleksitas dari aplikasi yang kita bangun.

Front-end engineer dituntut untuk menjaga konsistensi dan stabilitas dari sebuah aplikasi yang besar dan kompleks, testing menjadi hal yang memudahkan untuk memastikan beberapa hal yang telah disebutkan. Disebabkan oleh berbagai macam behaviour atau state yang dapat terjadi dari sebuah fungsi, mudah untuk mengecek setiap skenario yang ada telah di-handle. 

Sebagai contoh, pada kode di bawah ini ketika kita memberikan props yang berbeda pada component Button, maka ada dua kemungkinan yang dapat terjadi. Kita bisa menggunakan tag <a> atau <button> tergantung dari apakah ada props handleRoute

describe('<Button />', () => {
  it('should render an <a> tag if no route is specified', () => {
    const renderedComponent = renderComponent({ href });
    expect(renderedComponent.find('a').length).toEqual(1);
  });

  it('should render a <button> tag to change route if the handleRoute prop is specified', () => {
    const renderedComponent = renderComponent({ handleRoute });
    expect(renderedComponent.find('button').length).toEqual(1);
  });
});

Nah, kalau front-end saja yang sudah jelas dapat dilihat perlu di-test, bagaimana dengan back-end? Pada perjalanan saya selama 11 minggu ini, saya sudah menyentuh beberapa test untuk API call. Terdapat beberapa hal yang perlu di-handle jika terjadi hal-hal yang tidak diinginkan, dan kita harus melakukan test untuk skenario-skenario yang dapat terjadi. Berikut adalah contoh dari test API yang saya lakukan, di mana user meminta sebuah list pada nomor sekian, namun nomor tersebut melebihi jumlah list yang ada, maka server akan mengembalikan error code 416 (Range Not Satisfiable).

    def test_workloads_offset_max(self):
        revision = Revision()
        role = Role()
        role.name = 'penyuluh'

        profile = Profile(
            id=1,
            first_name='Penyuluh',
            last_name='1',
            role=role,
            revision=revision
        )

        role = Role()
        role.name = 'ketua_arisan'

        territory = Territory(
            id=1,
            province='jawa',
            city='depok',
            subdistrict='cimanggis',
            village='beji',
            revision=revision,
            code='12345'
        )

        penyuluh = Penyuluh()
        penyuluh.profile = profile

        profile = Profile(
            id=2,
            first_name='Ketua Arisan',
            last_name='1',
            territory=territory,
            role=role,
            revision=revision
        )

        ketua_arisan = KetuaArisan()
        ketua_arisan.profile = profile

        status = Status()
        status.name = 'todo'

        assignment_revision = AssignmentRevision()

        assignment = Assignment(
            ketua_arisan=ketua_arisan,
            penyuluh=penyuluh,
            status=status,
            visit_date=datetime.datetime.now(),
            assignment_revision=assignment_revision
        )

        db.session.add(assignment)
        db.session.commit()

        response = self.app.get(
            '{}/workloads?offset=2'.format(self.__api_path)
        )
        assert (
            response.status_code == 416
        )

Kalau dilihat dari potongan kode di atas, saya harus membangun database untuk testing dan tidak dapat menggunakan database yang asli. Kenapa? Karena database yang asli dapat terus berubah-berubah dan bisa saja tidak sesuai/dapat mengecek setiap test yang ada. Mungkin hal tersebut terlihat menyulitkan di awal, namun untuk kemudahan quality assurance hal ini memberikan kita keuntungan bahwa tidak ada lagi bug-bug sepele yang belum di-handle saat fungsi sudah selesai. 

Seperti itulah sebagian pengalaman saya bersama test di Allocateam, semoga membantu! :)