Aplikasi yang baik adalah aplikasi yang sudah diuji fungsionalitasnya secara ketat untuk memastikan semua fungsionalitasnya berjalan dengan baik. Ada berbagai jenis metode pengujian di dalam pengujian perangkat lunak: unit-testing digunakan untuk menguji ketepatan output/luaran dari suatu fungsi atau model di dalam aplikasi secara internal, integration-testing digunakan untuk menguji kepaduan antara setiap komponen aplikasi, dan masih banyak jenis pengujian lainnya.
Untuk menguji aplikasi berbasis Web, ada beberapa macam pendekatan untuk melakukan pengujian baik unit testing maupun integration testing. Untuk aplikasi yang hanya mengandalkan REST API berbasis JSON, mungkin melakukan pengujian melalui masing-masing endpoint sudah cukup. Namun, untuk aplikasi Web interaktif yang memerlukan interaksi dari pengguna (isi teks, klik tombol), maka satu-satunya cara paling efektif untuk memastikan fungsionalitas dari interaksi berjalan lancar adalah dengan menguji langsung elemen-elemen interaktif dari aplikasi Web. Pengujian interaktifitas aplikasi Web bisa dilakukan melalui medium tester oleh manusia. Namun akan lebih baik jika proses pengujian ini bisa diotomatisasi sehingga bisa dilakukan berulang-ulang dengan cepat. Salah satu kakas/tool yang bisa Anda gunakan untuk melakukan otomatisasi interaksi aplikasi Web adalah Selenium WebDriver (SWD).
SWD menyediakan fasilitas untuk mengontrol suatu peramban Web (web browser) melalui otomatisasi dengan bahasa pemrograman. Pada saat program otomatisasi dijalankan, SWD akan membuka aplikasi peramban Web pilihan pengguna dan melakukan kontrol pada peramban Web tersebut seperti misalnya:
- Membuka suatu halaman Web di bar alamat/address bar
- Memilih suatu elemen di halaman menggunakan id, class, name, XPath.
- Mengisi input pada elemen
- Melakukan klik pada elemen
- Menjalankan kode JavaScript (JS) pada halaman Web (termasuk mendapatkan nilai dari variabel JS)
- Menunggu suatu state (misal, apakah data yang diambil secara AJAX sudah diambil nilainya).
Bahasa pemrograman yang didukung secara resmi oleh Selenium antara lain Java, Python, C#, Perl, JavaScript, Ruby, dan PHP. Sedangkan peramban Web yang bisa digunakan untuk proses otomatisasi antara lain Chrome, Firefox, Opera, Safari dan IE.
Pemasangan SWD untuk Python
CATATAN: Saya asumsikan Anda sudah memahami Python dan seluk beluknya sebelum lanjut
Untuk memasang SWD dengan Bahasa Pemrograman Python, Anda bisa menggunakan pengelola paket PIP untuk memasang paket bernama selenium melalui perintah baris berikut :
$ pip install selenium
Jika Anda ingin menggunakan bahasa pemrograman lain, silahkan merujuk ke pranala berikut.
Pemasangan WebDriver
Sebelum Anda dapat menggunakan SWD, Anda diharuskan untuk memasang WebDriver (WD) yang berfungsi sebagai penghubung antar SWD dengan peramban Web sehingga bisa dikontrol melalui bahasa pemrograman. WD untuk masing-masing peramban Web bisa diunduh melalui pranala lini (di bagian Third Party, Bindings, and Plugins). Tempatkan berkas biner/EXE dari WD ke dalam direktori yang bisa diakses melalui environment variable PATH.
Hello World
Untuk memulai menggunakan SWD dengan Python, silahkan membuka Python Interpreter (melalui perintah python atau ipython di baris perintah) dan mengimpor modul webdriver.
from selenium import webdriver
Kemudian, untuk memulai suatu WD, gunakan perintah berikut:
browser = webdriver.Chrome() # Untuk WD berbasis Chrome
browser = webdriver.Firefox() # Untuk WD berbasis Firefox
Seketika juga, Anda akan melihat aplikasi peramban Web muncul di layar. Anda sekarang bisa mengendalikan interaksi ke peramban Web baik secara langsung melalui peramban Web tersebut ATAU melalui kode program di melalui interpreter Python yang Anda gunakan.
Untuk membuka suatu halaman Web melalui interpreter Python, gunakan kode berikut (misal, jika Anda ingin membuka situs Google):
browser.get("https://google.com")
Maka peramban Web akan diarahkan ke situs yang dituju. Interpreter akan menunggu sampai halaman benar-benar dimuat secara penuh (document ready) sehingga Anda tidak perlu membuat kode untuk menunggu secara eksplisit.
Memilih suatu elemen
Untuk melakukan interaksi pada suatu elemen halaman Web, SWD menyediakan fungsi pencarian elemen (dan elemen jamak) menggunakan beberapa kueri: id dari elemen, class dari elemen, name dari elemen dan masih banyak lagi. Anda dapat menggunakan bantuan fitur Inspect Element (dengan menekan tombol F12 pada peramban Web) di Google Chrome atau Developer Tools di Mozilla Firefox untuk melakukan pengecekan nama id, class, name dari suatu elemen halaman Web.
Untuk melakukan pencarian sebuah elemen, Anda dapat menggunakan contoh perintah kode berikut:
kotak_cari = browser.find_element_by_name("q") # Kotak pencarian
tombol_cari = browser.find_element_by_name("btnK") # Tombol "Penelusuran Google"
semua_input = browser.find_elements_by_tag_name("input") # Semua elemen dengan tag <input>
bahasa_google = browser.find_element_by_class_name("Q8LRLc") # Penunjuk nama bahasa di pojok kiri bawah
PERHATIAN: Jika Anda menggunakan fungsi dengan awalan find_element_* (element tanpa akhiran s), Anda harus memastikan bahwa id, class, atau properti elemen yang dicari memang ADA di halaman yang dibuka. Jika tidak, SWD akan melempar sebuah Exception.
Anda kemudian bisa menggunakan variabel luaran dari masing-masing fungsi find_element* (kita sebut variabel ini sebagai variabel elemen) untuk melihat properti DOM elemennya dengan menggunakan contoh kode berikut:
tombol_cari.get_attribute("value") # Hasil: "Penelusuran Google"
Anda juga bisa melakukan pencarian elemen kembali secara rekursif melalui suatu variabel elemen jika memang dibutuhkan:
body = browser.find_element_by_id("main").find_element_by_name("body")
Hanya saja, Anda tidak bisa melakukan manipulasi nilai DOM melalui fungsi bawaan SWD. Anda hanya bisa melakukan manipulasi nilai DOM dengan mengeksekusi suatu kode Javascript. Penjelasan mengenai eksekusi kode Javascript dijelaskan pada sub-bagian bawah.
Interaksi pada elemen
Anda dapat melakukan entri input dengan mensimulasikan entri tombol papan ketik ke suatu variabel elemen melalui perintah .send_keys seperti contoh penggunaan berikut:
kotak_cari.send_keys("Selenium Web Driver xx")
Anda juga bisa mensimulasikan tombol papan ketik khusus seperti berikut:
from selenium.webdriver.common.keys import Keys
kotak_cari.send_keys(Keys.BACKSPACE + Keys.BACKSPACE)
Untuk melakukan klik tombol, gunakan perintah .click atau .submit pada suatu variabel elemen seperti berikut:
tombol_cari.click() # Simulasi klik tombol "Penelusuran Google"
kotak_cari.submit() # Simulasi proses Submit
JavaScript
SWD menyediakan suatu fitur untuk mengeksekusi suatu JavaScript pada halaman yang sedang dibuka. Untuk melakukan hal ini, Anda dapat memanggil fungsi .execute_script melalui Web Driver dan mencantumkan snippet kode Javascript yang Anda ingin eksekusi. Anda dapat memasukkan lebih dari satu baris perintah JavaScript dengan membatasi tiap baris dengan tanda ;. Anda juga dapat mengambil nilai variabel dari Javascript ke dalam Python dengan menambahkan penanda return di sebelah kiri perintah/nama variabel.
Berikut adalah contoh penggunaan eksekusi skrip:
browser.execute_script("alert(0)") # Menampilkan alert
browser.execute_script("document.getElementsByName('q')[0].setAttribute('value','Selenium Web Driver'") # Set value dari kotak pencarian
isi_pencarian = browser.execute_script("return document.getElementsByName('q')[0].getAttribute('value')") # Ambil value dari kotak pencarian
Menunggu suatu state
Agar proses pengujian bisa dilakukan secara terprediksi, Anda dapat melakukan proses penungguan suatu state (bisa berupa state di DOM atau Javascript) melalui fitur Explicit Wait yang ada di SWD. Untuk membuat suatu Explicit Wait, Anda bisa membuat sebuah fungsi lambda di Python yang menghasilkan nilai true jika keadaan yang diharapkan tercapai, dan nilai false jika keadaan yang diharapkan belum tercapai dan program harus melakukan penungguan. Berikut adalah contoh kode-nya (untuk timeout 10 detik):
from selenium.webdriver.support.ui import WebDriverWait
## Tunggu sampai kotak pencarian berisi tulisan "Sesuatu"
## Jika lebih dari 10 detik tidak tercapai, lembar Exception
WebDriverWait(browser, 10).until(lambda x: return browser.execute_script("return document.getElementsByName('q')[0].getAttribute('value')") == "Sesuatu")
Penutup
Di atas sudah dibahas mengenai cara dan contoh penggunaan Selenium Web Driver (SWD) untuk melakukan otomatisasi pengujian dan interaksi aplikasi Web menggunakan Python. Sebenarnya ada beberapa fitur Selenium yang sangat mumpuni namun belum dibahas di artikel ini.
Selain menawarkan otomatisasi melalui skrip, Anda juga bisa menggunakan Selenium IDE untuk membuat skrip otomatisasi langsung melalui peramban Web tanpa melalui coding. Selenium IDE mungkin akan saya di artikel blog saya selanjutnya.
Akhir kata, semoga artikel ini bermanfaat bagi Anda semua.