Pengujian GUI: Kasus Uji & Contoh UI

Untuk memahami pengujian GUI, mari kita pahami terlebih dahulu apa itu GUI.

Apa itu GUI?

Ada dua jenis antarmuka untuk aplikasi komputer. Antarmuka Baris Perintah adalah tempat Anda mengetik teks dan komputer merespons perintah itu. GUI adalah singkatan dari Graphical User Interface tempat Anda berinteraksi dengan komputer menggunakan gambar, bukan teks.

Berikut ini adalah elemen GUI yang dapat digunakan untuk interaksi antara pengguna dan aplikasi:

Pengujian GUI adalah validasi elemen di atas.

Apa itu Pengujian GUI?

Pengujian GUI adalah jenis pengujian perangkat lunak yang memeriksa Antarmuka Pengguna Grafis Perangkat Lunak. Tujuan Pengujian Antarmuka Pengguna Grafis (GUI) adalah untuk memastikan fungsionalitas aplikasi perangkat lunak berfungsi sesuai spesifikasi dengan memeriksa layar dan kontrol seperti menu, tombol, ikon, dll.

GUI adalah apa yang dilihat pengguna. Kunjungi guru99.com dan halaman beranda yang muncul adalah GUI dari situs tersebut. Kode sumber tetap tersembunyi; hanya antarmuka yang terlihat. Oleh karena itu, pengujian GUI berfokus pada struktur desain dan apakah gambar ditampilkan dengan benar.

Pada tangkapan layar di atas, pengujian GUI dimulai dengan memastikan bahwa setiap gambar terlihat sepenuhnya di berbagai browser. Pemeriksaan selanjutnya pada halaman yang sama adalah:

• Tautan-tautan tersebut tersedia, dan setiap tombol berfungsi saat diklik.
• Mengubah ukuran layar tidak akan pernah menyebabkan gambar atau teks menyusut, terpotong, atau tumpang tindih.
• Tidak ada elemen dalam tata letak yang runtuh ketika jendela browser dipersempit.

💡 Kiat: Jalankan halaman yang sama pada resolusi 1920×1080, 1366×768, dan 375×812 sebelum melaporkan cacat apa pun. Banyak laporan "tata letak rusak" hanyalah breakpoint yang belum diuji.

Kebutuhan Pengujian GUI

Sekarang konsep dasar pengujian GUI sudah jelas. Beberapa pertanyaan yang mungkin muncul di benak Anda adalah:

• Mengapa melakukan pengujian GUI?
• Apakah itu benar-benar diperlukan?
• Bukankah menguji fungsionalitas dan logika aplikasi saja sudah cukup, dan mengapa harus menghabiskan waktu ekstra untuk antarmuka?

Untuk mendapatkan jawabannya, berpikirlah sebagai pengguna, bukan sebagai penguji. Seorang pengguna tidak mengetahui bagaimana aplikasi tersebut dibangun. Antarmuka-lah yang menentukan apakah pengguna tersebut melanjutkan penggunaan aplikasi atau meninggalkannya.

Pengguna biasa pertama-tama akan mengamati desain dan tampilan aplikasi, serta kemudahan pemahaman antarmuka. Jika pengguna tidak nyaman dengan antarmuka, atau menganggap aplikasi tersebut sulit dipahami, pengguna tersebut tidak akan pernah kembali. Oleh karena itu, GUI (Graphical User Interface) merupakan hal yang perlu diperhatikan, dan pengujian yang tepat harus dilakukan untuk memastikan antarmuka bebas dari bug.

Jenis Pengujian GUI

Mengetahui mengapa antarmuka itu penting hanyalah setengah dari gambaran keseluruhan. Pengujian GUI terdiri dari lima jenis, dan masing-masing menjawab pertanyaan yang berbeda tentang layar yang sama.

• Pengujian GUI fungsional: Memastikan bahwa setiap kontrol melakukan apa yang dijanjikan. Berkaitan erat dengan pengujian fungsional, ini menanyakan apakah sebuah tombol mengirimkan data, sebuah dropdown berfungsi sebagai filter, dan sebuah kolom menerima input yang valid.
• Pengujian kegunaan: Mengukur seberapa mudah seseorang menyelesaikan suatu tugas. Pengujian kegunaan Mempertimbangkan kedalaman navigasi, keterbacaan, dan apakah pesan kesalahan benar-benar membantu.
• Pengujian kompatibilitas: Menampilkan tampilan layar yang sama di berbagai browser, sistem operasi, dan ukuran perangkat. Pengujian lintas browser Mendeteksi kesalahan rendering yang hanya muncul di satu mesin.
• Pengujian aksesibilitas: Memverifikasi navigasi keyboard, label pembaca layar, dan kontras warna terhadap WCAG. Pengujian aksesibilitas Saat ini, hal tersebut merupakan persyaratan kepatuhan di banyak pasar, bukan lagi fitur tambahan opsional.
• Pengujian visual dan kinerja: Membandingkan tangkapan layar yang dihasilkan dengan garis dasar dan mengukur seberapa cepat antarmuka menampilkan dan merespons, serta tumpang tindihnya.ping dengan pengujian kinerja.

Sebagian besar tim menjalankan kelima hal tersebut tetapi memberikan bobot yang berbeda: situs web publik lebih mengutamakan kompatibilitas dan aksesibilitas, sedangkan dasbor internal lebih fokus pada pemeriksaan fungsional.

Apa yang Anda periksa dalam pengujian GUI?

Daftar periksa berikut akan memastikan Pengujian GUI terperinci dalam Pengujian Perangkat Lunak.

• Periksa semua elemen GUI untuk ukuran, posisi, lebar, panjang, dan penerimaan karakter atau angka. Misalnya, Anda harus dapat memberikan masukan ke kolom masukan.
• Periksa apakah Anda dapat menjalankan fungsionalitas aplikasi yang diinginkan menggunakan GUI
• Periksa apakah Pesan Kesalahan ditampilkan dengan benar
• Periksa Hapus demarkasi bagian yang berbeda di layar
• Periksa apakah Font yang digunakan dalam aplikasi dapat dibaca
• Periksa perataan teks sudah benar
• Periksa Warna font dan pesan peringatan apakah estetis
• Periksa apakah gambar memiliki kejelasan yang baik
• Periksa apakah gambar sudah sejajar dengan benar
• Periksa posisi elemen GUI untuk resolusi layar yang berbeda.

Teknik Pengujian GUI

Setelah daftar periksa dibuat, keputusan selanjutnya adalah bagaimana melaksanakannya. Teknik Pengujian GUI dapat dikelompokkan menjadi tiga bagian:

Pengujian Berbasis Manual

Dalam pendekatan ini, layar grafis diperiksa secara manual oleh penguji sesuai dengan persyaratan yang tercantum dalam dokumen persyaratan bisnis.

Rekam dan Putar Ulang

Pengujian GUI dapat dilakukan menggunakan alat otomatisasi. Ini dilakukan dalam 2 bagian. Selama perekaman, langkah-langkah pengujian ditangkap oleh alat otomatisasi. Selama pemutaran ulang, langkah-langkah pengujian yang direkam dieksekusi pada Aplikasi yang Sedang Diuji. Contoh alat tersebut adalah – QTP.

Pengujian Berbasis Model

Model adalah deskripsi grafis dari perilaku suatu sistem. Model membantu kita memahami dan memprediksi perilaku sistem. Model membantu dalam menghasilkan kasus uji yang efisien menggunakan persyaratan sistem. Diagram di bawah ini menunjukkan bagaimana model mendorong pembuatan pengujian:

Berikut ini perlu dipertimbangkan untuk pengujian berbasis model ini:

• Bangun model
• Tentukan Input untuk model
• Hitung keluaran yang diharapkan untuk model tersebut
• Jalankan tes
• Bandingkan keluaran aktual dengan keluaran yang diharapkan
• Keputusan mengenai tindakan lebih lanjut terhadap model tersebut

Beberapa teknik pemodelan yang dapat digunakan untuk memperoleh kasus uji:

• Bagan – Menggambarkan keadaan suatu sistem dan memeriksa keadaan setelah beberapa masukan.
• Tabel Keputusan – Tabel yang digunakan untuk menentukan hasil setiap masukan yang diterapkan

Pengujian berbasis model adalah teknik yang berkembang untuk menghasilkan kasus uji dari persyaratan. Keuntungan utamanya, dibandingkan dengan dua metode di atas, adalah metode ini dapat menentukan keadaan yang tidak diinginkan yang dapat dicapai oleh GUI Anda.

Pengujian GUI Manual vs Otomatis

Dua dari tiga teknik tersebut bersifat manual dan satu otomatis, yang menimbulkan pertanyaan praktis tentang di mana masing-masing teknik tersebut seharusnya ditempatkan. Pengujian manual Dengan menempatkan manusia di depan layar, alat ini dapat menangkap alur kerja yang canggung, pilihan kata yang kikuk, dan animasi yang terasa salah — penilaian yang tidak dapat dilakukan oleh naskah.

Pengujian otomatis Memutar ulang interaksi yang sama ribuan kali tanpa kelelahan, yang menjadikannya solusi tepat untuk jalur regresi yang stabil dan untuk mengulang satu rangkaian pengujian di banyak browser. Kelemahannya adalah pemeliharaan: skrip GUI otomatis akan rusak setiap kali penunjuk lokasi atau tata letak berubah. Oleh karena itu, sebagian besar tim yang berpengalaman menjalankan pendekatan hibrida, mengotomatiskan hal-hal yang dapat diulang dan mengalokasikan sumber daya manusia untuk hal-hal yang bersifat pengalaman.

Faktor	Pengujian GUI Manual	Pengujian GUI Otomatis
Terbaik untuk	Layar baru, pemeriksaan eksplorasi, tampilan dan nuansa	Rangkaian pengujian regresi yang stabil, pengujian lintas browser.
Kecepatan per siklus	Lambat, terbatas oleh jam kerja penguji.	Cepat, dapat beroperasi tanpa pengawasan sepanjang malam.
Biaya dimuka	Rendah	Tingkat tinggi (pengaturan skrip dan kerangka kerja)
pemeliharaan	Tidak ada yang lain selain memperbarui daftar periksa.	Penting ketika antarmuka berubah
Mencakup isu-isu subjektif.	Ya	Tidak

Contoh Kasus Uji Pengujian GUI

Pengujian GUI pada dasarnya melibatkan

1. Menguji ukuran, posisi, lebar, tinggi elemen.
2. Pengujian pesan kesalahan yang ditampilkan.
3. Menguji berbagai bagian layar.
4. Pengujian font apakah dapat dibaca atau tidak.
5. Pengujian layar pada resolusi berbeda dengan bantuan pembesaran dan pengecilan seperti 640 x 480, 600×800, dst.
6. Menguji keselarasan teks dan elemen lain seperti ikon, tombol, dll. Apakah pada tempatnya atau tidak.
7. Menguji warna font.
8. Menguji warna pesan kesalahan, pesan peringatan.
9. Menguji apakah gambar mempunyai kejernihan yang baik atau tidak.
10. Menguji keselarasan gambar.
11. Pengujian ejaan.
12. Pengguna tidak boleh merasa frustrasi saat menggunakan antarmuka sistem.
13. Menguji apakah antarmuka berada padatracpositif atau tidak.
14. Pengujian scrollbar sesuai dengan ukuran halaman jika ada.
15. Menguji bidang yang dinonaktifkan jika ada.
16. Menguji ukuran gambar.
17. Menguji judul apakah sudah benar atau belum.
18. Menguji warna hyperlink.

Demo: Bagaimana melakukan Tes GUI

Daftar di atas akan menjadi jauh lebih jelas ketika diterapkan pada layar sebenarnya, jadi di sini kita akan menggunakan beberapa contoh kasus uji untuk dialog berikut.

Berikut ini adalah contoh Kasus Uji, yang terdiri dari skenario pengujian UI dan Usabilitas. Jika Anda baru dalam menulisnya, lihat cara menulis kasus uji pertama.

Kasus uji 01 – Pastikan kotak teks dengan label “Folder Sumber” diselaraskan dengan benar.

Kasus uji 02 – Pastikan kotak teks dengan label “Paket” diselaraskan dengan benar.

Kasus uji 03 – Verifikasi label dengan nama “Browse” adalah tombol yang terletak di akhir TeksBox dengan nama "Folder Sumber. "

Kasus uji 04 – Verifikasi label dengan nama “Browse” adalah tombol yang terletak di akhir TeksBox dengan nama "Paket. "

Kasus uji 05 – Pastikan kotak teks dengan label “Nama” diselaraskan dengan benar.

Kasus uji 06 – Pastikan label “Pengubah” terdiri dari 4 radio button dengan nama public, default, private, protected.

Kasus uji 07 – Pastikan label “Pengubah” terdiri dari 4 tombol radio yang disejajarkan dengan baik dalam satu baris.

Kasus uji 08 – Pastikan label “Kelas Super” di bawah label “Pengubah” terdiri dari dropdown yang harus disejajarkan dengan benar.

Kasus uji 09 – Pastikan label “Kelas Super” terdiri dari tombol dengan label “Browse” di atasnya yang harus disejajarkan dengan benar.

Kasus uji 10 – Pastikan bahwa saat mengklik tombol radio mana pun, penunjuk mouse default harus diubah menjadi penunjuk mouse berbentuk tangan.

Kasus uji 11 – Pastikan pengguna tidak dapat mengetik di menu tarik-turun "Kelas Super. "

Kasus uji 12 – Pastikan bahwa akan muncul pesan kesalahan yang sesuai jika ada sesuatu yang salah dipilih.

Kasus uji 13 – Pastikan bahwa kesalahan harus ditampilkan dengan warna MERAH di tempat yang diperlukan.

Kasus uji 14 – Pastikan label yang tepat digunakan dalam pesan kesalahan.

Kasus uji 15 – Pastikan bahwa tombol radio tunggal harus dipilih secara default setiap saat.

Kasus uji 16 – Pastikan tombol TAB berfungsi dengan benar saat melompatping di bidang lain di sebelah bidang sebelumnya.

Kasus uji 17 – Pastikan semua halaman memuat judul yang tepat.

Kasus uji 18 – Pastikan teks halaman sejajar dengan benar.

Kasus uji 19 – Pastikan bahwa setelah memperbarui bidang apa pun, pesan konfirmasi yang sesuai harus ditampilkan.

Kasus uji 20 – Pastikan hanya 1 tombol radio yang harus dipilih dan lebih dari satu kotak centang dapat dipilih.

Tantangan dalam Pengujian GUI

Menulis kasus-kasus tersebut cukup mudah; terusping Menjaga agar tetap hidup selama beberapa rilis bukanlah hal yang mudah. ​​Dalam Rekayasa Perangkat Lunak, masalah yang paling umum saat melakukan hal tersebut adalah... Pengujian Regresi adalah GUI aplikasi sering berubah. Sangat sulit untuk menguji dan mengidentifikasi apakah ini merupakan masalah atau peningkatan. Masalahnya muncul ketika Anda tidak memiliki dokumen apa pun mengenai perubahan GUI.

⚠️ Peringatan: Skrip yang menemukan elemen berdasarkan koordinat layar atau ID yang dihasilkan secara otomatis akan gagal pada build berikutnya. Perlakukan strategi pencarian sebagai bagian dari desain, bukan sebagai tambahan yang dipikirkan kemudian.

Alat Pengujian GUI

Peralatan yang tepat dapat menyerap sebagian besar gejolak tersebut. Berikut adalah daftar peralatan populer. Alat Pengujian GUI :

1. Selenium
2. QTP
3. Cucumber
4. Tes Sutra
5. TestComplete
6. Penguji GUI Squish

Klik di sini untuk belajar Selenium, QTP & Cucumber.

Berikut ini adalah alat sumber terbuka yang tersedia untuk melakukan Uji UI otomatis.

Produk	Berlisensi Di Bawah
AutoHotkey	GPL
Selenium	Apache
Sikuli	MIT
Kerangka Robot	Apache
air	BSD
Perangkat Dojo	BSD

Sikuli Berbasis gambar, berguna ketika suatu kontrol tidak memiliki penunjuk lokasi yang andal; Selenium tetap menjadi default untuk pengujian aplikasi web.

Pertanyaan Umum Demo Slot