Showing posts with label browser. Show all posts
Showing posts with label browser. Show all posts

Tuesday, December 5, 2017

Automasi browser dengan Node, Selenium The Origin

Hai Geeks, di series ke-4 dan terakhir dari Automasi browser dengan Node, kita akan membahas automasi browser yang paling tua dan menginspirasi automasi lain, Selenium. Casper, Zombie, Nightmare lahir setelah adanya Node, sedangkan Selenium telah ada sebelum Node. Selenium di bahasa pemrograman lain pun sudah sering digunakan sebagai standar untuk testing



Selenium adalah framework automasi web browser untuk cross browser testing. Selenium membutuhkan driver spesifik untuk setiap browser. Setelah setting driver, selenium akan men-drive browser tersebut untuk menjalankan automasi. Untuk download driver sudah disediakan di npm selenium-webdriver

Untuk demo pertama, kita akan mencoba cek harga terkini dari bitcoin

npm i selenium-webdriver


Lalu demo kedua seperti biasa, cek instagram Adi Trioka muncul pertama di Google


Kelebihan dan kekurangan selenium sebagai berikut

Pro :

  • Untuk penggunaan sehari-hari lebih mudah karena dari browser
  • Browser menyimpan cookies

Kontra :

  • Kode Panjang
  • Cukup berat saat membuka browser

Sumber
Selenium


Friday, December 1, 2017

Automasi browser dengan Node, Casper the new Phantom

Hai Geeks, di series ke 3 dari Automasi browser dengan Node dan posting ke 5 ini, kita akan membahas mengenai salah satu headless browser yang sudah lama dikenal, PhantomJS. Uniknya, PhantomJS adalah buatan salah seorang developer Indonesia bernama Ariya Hidayat, dan PhantomJS ini sudah ada sejak tahun  2010

Sayangnya PhantomJS hanyalah sebuah browser, jadi untuk navigasi dan testingnya sulit. Untuk mempermudah maka bisa menggunakan CasperJS. Duet Casper dan Phantom yang saling melengkapi



Untuk menjalankan CasperJS, harus dengan mendownload PhantomJS terlebih dahulu di download PhantomJS. Lalu atur environtment variabel. Untuk macOS maka arahkan ke phantomJS, contohnya

export PHANTOMJS_EXECUTABLE=/User/phantomjs/bin/phantomjs phantomjs

Setelah ini lalu install casperJS secara global dengan

npm i casperjs -g

Demo pertama akan kita coba untuk list semua blog terbaru di blog nostratech

Berbeda dengan yang lain, cara menjalankan file ini dengan

casperjs list_blog.js

Lalu untuk demo kedua seperti biasa, cek instagram aditrioka muncul pertama, namun kali ini tidak menggunakan mocha, tapi casper itu sendiri

Untuk menjalankannya dengan

casperjs test casper-test.js

Kelebihan dan kekurangan casper-phantom yang terasa sebagai berikut
Pro:
  • Made by Indonesian
  • Sudah langsung support assert untuk testing
  • Pemrosesan cepat
Con:
  • Setting cukup membingungkan dengan banyaknya requirement
  • Dokumentasi Phantom dan version sangat membingungkan
  • Untuk penggemar mocha, beda feeling
  • Proses hanya bisa dipantau dengan command line
  • Kode panjang
Selamat mencoba casper-phantom. Creativity is the limit


Sumber

Phantom
Casper

Wednesday, November 15, 2017

Automasi browser dengan Node, Zombie Apocalypse

Hai Geeks, di postingan ke 4 ini, saya akan melanjutkan series Automasi browser dengan Node, selanjutnya adalah ZombieJS



Zombie adalah framework untuk automasi browser buatan developer Assaf Arkin. Proses zombie sangat cepat, dan headless, karena itulah diibaratkan zombie. Zombie dibuat untuk testing dan sudah support assert.

Awalnya saya ingin mendemokan search di Google, namun setelah dicoba ada error dari javascript. Ternyata, Google memiliki sistem yang menangkal tools otomatis seperti zombie, berikut kutipan dari Stackoverflow

Karena keterbatasan ini maka saya akan mendemokan dengan Search Engine DuckDuckGo

Demo pertama untuk lihat postingan terbaru blog Nostra

npm install zombie

Lalu demo kedua untuk testing menggunakan Mocha, di test ini sama seperti di Nightmare, akan membuka search engine dan memeriksa apakah instagram aditrioka muncul pertama

untuk menjalakan, run command diawali dengan mocha

Kelebihan dan kekurangan Nightmare sebagai berikut
Pro :
  • Ringan dan cepat
  • Sudah langsung support assert untuk testing
Con:
  • Proses hanya bisa dipantau dengan command line
  • Terdeteksi sebagai automatic tools
Selamat mencoba zombie. Creativity is the limit

Sumber
ZombieJS

Friday, October 6, 2017

Automasi browser dengan Node, Face the NightmareJS

Hai Geeks, di posting bulanan ke 3 ini, saya akan membahas tentang Nightmare


Nightmare adalah salah satu npm untuk automasi browser high-level buatan segment, tujuannya adalah meniru perilaku user di browser, seperti goto, click, type, check dan lain-lain. Pada awal pengembangan sebenarnya digunakan untuk automasi task di web yang tidak memberikan API secara publik, lalu berkembang dan sering digunakan untuk UI testing dan crawling

Nightmare mudah digunakan dengan memberikan pengalaman yang synchronous untuk setiap script block dibandingkan dengan callback. Nightmare dibangun dengan Electron, sama dengan PhantomJS, tapi Nightmare mengklaim 2x lebih cepat dibanding PhantomJS dan lebih modern. Dari kode yang saya lihat, memang kode yang digunakan Nightmare lebih simple dengan feel yang didapat seperti Promise, sedangkan PhantomJS dengan feel Callback

Di posting ini, mari kita demo untuk stalking instagram Yuki Buwana. Pertama, cari instagram atas nama Yuki Buwana, lalu klik posting terbarunya, terakhir, print statusnya

npm install nightmare


Di line ke-2 option bisa diatur untuk menampilkan browser
Idealnya elemen didapat dari id nya, tapi karena tidak ada maka diambil dari class

Untuk demo kedua, nightmare digunakan sebagai Tester sederhana untuk load home page google dan memastikan instagram Adi Trioka muncul sebagai pencarian pertama dengan Mocha

npm install mocha -g
npm install assert

untuk menjalakan, run command diawali dengan mocha

Kelebihan dan kekurangan Nightmare sebagai berikut
Pro :
  • Mudah digunakan pemula
  • Dapat berjalan di background process ataupun windows hanya dengan merubah option
  • Dapat diinterupsi di tengah proses, contoh kebutuhan multi factor authentication
Con:
  • Load time lama karena load javascript

Selamat menikmati nightmare. Creativity is the limit

Sumber
Nightmare
Testing Nightmare