Programmer's Diary

Sebuah diary mahasiswa Teknik Informatika.

Coded UI Test pada Visual Studio 2010

Posted by Alexander Rahardjo on June 3, 2010

Setelah saya menjelaskan mengenai salah satu fitur baru pada Visual Studio 2010 pada artikel sebelumnya Generate Sequence Diagram from Visual Studio 2010. Selanjutnya pada kesempatan kali ini saya akan mengenalkan sebuah fitur baru yang dimiliki oleh Visual Studio 2010 yang tentunya belum dimiliki oleh versi sebelumnya :).


Fitur yang satu ini cukup menarik yaitu Coded UI Test yang digunakan untuk GUI Test, dimana tester dimudahkan untuk melakukan testing GUI pada suatu perangkat lunak.
Pada kesempatan kali ini saya akan memberikan tutorial untuk menggunakan fitur baru tersebut. Adapun perangkat lunak yang saya gunakan di sini adalah ASP.NET MVC 2, Visual Studio 2010, dan Windows XP SP 3.

Berikut adalah tutorialnya:
1. Buka perangkat lunak anda pada Visual Studio 2010
2. Pilih menu Test, lalu new test

3. Lalu akan keluar sebuah windows dimana anda harus memilih Coded UI Test dan isikan nama test anda, dalam tutorial ini saya mengisikan AdminUITest, lalu klik OK

4. Apabila anda belum memiliki project test maka akan keluar windows untuk new project, dalam tutorial ini saya mengisikan MvcMusicStoreUI.Tests, lalu klik OK


5. Setelah itu akan muncul windows baru lagi, dimana anda harus memilih option yang atas Record actions, edit UI map or add assertions, lalu klik OK

6. Setelah itu akan muncul windows di sebelah kanan anda untuk melakukan test GUI
fungsi dari windows di atas antara lain:



Record : berguna jika anda ingin mulai merekan aktivitas testing.



Show Recorded Steps : untuk menunjukkan langkah-langkah mana saja yang telah dieksekusi.



Assertion : untuk menambahkan asersi/ pengencekan terhapa output dari aplikasi yang sedang ditest.



Generate Code : untuk menerjemahkan kode hasil rekaman tadi




7. Lalu klik tombol paling kiri/start recording/ALT+R


8. Karena saya menggunakan ASP.NET maka saya menggunakan Internet Explorer 8 ( IE 8 ) untuk melakukan GUI testing ini

9. Setelah itu jalankan IE 8 dan lakukan yang anda ingin testing (dalam tutorial ini saya melakukan testing terhadap GUI Admin, dengan melakukan masukan username dan password)

10. Visual Studio 2010 akan secara otomatis melakukan record perilaku anda terhadap GUI yang anda test

11. Setelah selesai melakukan testing klik tombol paling kiri/pause recording/ALT+P

12. Dan anda dapat melihat hasil/step yang anda lakukan pada testing tadi dengan mengklik tombol Show Recorded Steps/ALT+S

13. Lalu klik tombol paling kanan/generate code/ALT+G dan isikan nama method anda dan klik tombol Add and Generate

14. Kemudian secara otomatis Visual Studio 2010 akan melakukan generate program untuk test UI

15. Sebelum melakukan test jangan lupa untuk menutup program yang dijalankan tadi


16. Lalu untuk melakukan test anda cukup klik kanan pada method yang baru digenerate oleh Visual Studio 2010 tersebut lalu pilih Run Tests

17. Proses GUI Testing akan terlaksana secara otomatis (jangan menyentuh keyboard atau mouse karena akan mengganggu proses testing :))

18. Apabila proses testing berjalan dengan baik maka akan keluar tanda passed pada Test Result di Visual Studio anda

19. Apabila Anda ingin melakukan test lagi maka anda perlu masuk ke menu Test kemudian pilih Generate Code for Coded UI Test > Use Coded UI Test Builder


Demikian tutorial dari saya mengenai Coded UI Test pada Visual Studio 2010
Selamat mencoba 🙂
Advertisements

2 Responses to “Coded UI Test pada Visual Studio 2010”

  1. […] dengan Visual Studio 2010 – Part 1Software TestingGenerate Sequence Diagram pada Visual Studio 2010Coded UI Test pada Visual Studio 2010 – Part 1PortfolioMatahari Studio Jakarta TutupAboutNormalisasi Basis […]

  2. […] TestingUnit Testing ASP.NET MVC 2 dengan Visual Studio 2010 – Part 1Teknik Pengujian SoftwareCoded UI Test pada Visual Studio 2010Generating Test Cases From Use Cases Studi Kasus PerpustakaanMatahari Studio Jakarta TutupUnit […]

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

 
%d bloggers like this: