• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

Jaranguda

Belajar Mengajar

  • Home
  • Sponsor/Jasa
  • Tentang

Cara Install dan Membuat Testing dengan Cypress

Last Updated on 29 May 2021 By tommy 1 Comment

Melakukan end to end testing kita akan menggunakan Cypress, beberapa kelebihan yang dimilikinya adalah multi browser support (Firefox, Electron, Google Chrome), mudah untuk membuat testing baik untuk API ataupun Web UI.

Kelebihan cypress yang lain:
1. Time travel, bisa digunakan untuk merekam saat script dijalankan baik dalam bentuk screenshot ataupun video.
2. Debuggability, mudah untuk di debug karena tersedia GUI
3. Network Traffic Control, mengontrol kecepatan internet yang ingin digunakan, contoh ADSL, 3G, 4G, 5G, Fiber.

mari kita mulai langkah demi langkah install cypress sampai membuat testing sederhana.

Pastikan anda sudah menginstall nodejs, lalu buat folder tempat menyimpan cypress

mkdir ~/cypress-testing
cd ~/cypress-testing
npm init

biarkan semua nilai default
npm init terminal linux

Install Cypress

Pindah ke folder yang baru dibuat, lalu install cypress

cd ~/cypress-testing
npm install cypress --save-dev

cek versi yang terinstall

$ node_modules/.bin/cypress -v
# output
Cypress package version: 7.4.0
Cypress binary version: 7.4.0
Electron version: 12.0.0-beta.14
Bundled Node version: 14.15.1

untuk pertama kali jalankan cypress, setelah menjalankan ini cypress akan menggenerate folder baru, beserta beberapa test file

node_modules/.bin/cypress open

keluar dari GUI cypress. Lalu hapus file test yang di generate oleh cypress, karena kita akan membuat dari awal.
cypress gui
bila anda mulai dari awal, ada baiknya buat sendiri folder cypress biar tidak ada file yang digenerate. Tetapi untuk pemula cara ini lebih diutamakan karena anda bisa langsung menggunakan fitur-fitur testing cypress tanpa perlu membuat test.

Hapus folder cypress dan buat baru

rm -fr cypress
mkdir -p cypress/integration

Sebagai contoh kita akan membuat script untuk membuka situs https://jaranguda.com, lalu di cek apakah situs tersebut bisa dibuka. Biasanya bila balikan dari server jaranguda.com adalah 200 (HTTP status 200) itu tandanya situs tersebut berhasil dibuka.

Buat file cypress/integration/jaranguda.spec.js yang berisi

context("jaranguda-com", () => {
  it("Buka situs jaranguda.com", () => {
    cy.request('https://jaranguda.com').should((response) => {
      expect(200).to.equal(response.status)
    })
  });
});

jalankan script test diatas dengan mode headless

node_modules/.bin/cypress run

cypress headless result
saya lebih prefer headless daripada menggunakan browser, karena lebih cepat dijalankan. Untuk menjalankan dengan GUI ganti run menjadi open.

dengan cy.request() kita bisa lihat respon header dari server. Untuk tes selanjutnya kita akan menggunakan cy.visit(), untuk membuka website dan mengklik link di situs tersebut

context("jaranguda-com", () => {
  it("Buka situs jaranguda.com", () => {
    cy.request('https://jaranguda.com').should((response) => {
      expect(200).to.equal(response.status)
    })
  });
 
  it("Buka situs jaranguda.com dan klik link", () => {
    cy.visit("https://jaranguda.com");
    cy.get('#recent-posts-12 > .widget-wrap > ul > :nth-child(2) > a').click();
  });
 
});

test cypress beberapa step

Tulisan menarik lainnya

  • Membuat Kalender dengan PHP

    Buat sebuah file dengan nama kalender.php lalu tambahkan script dibawah ini Minggu Senin Selasa Rabu…

  • Cara Membuat PDF dengan CodeIgniter

    Suatu saat mungkin anda butuh membuat laporan kedalam PDF di CodeIgniter. Sebenarnya caranya hampir sama…

  • Membuat Aplikasi Sederhana dengan Phonegap

    Bila anda belum melakukan instalasi phonegap, cordova silahkan merujuk ke Persiapan Membuat Development Phonegap 3.x…

  • Cara Install SSL di Mikrotik 6.29.1

    1. Generate Certificate Login lewat SSH, jalankan perintah /certificate add name=MikrotikJaranguda common-name=jaranguda.jrd key-size=2048 country=ID state=Jakarta…

Filed Under: Linux

Reader Interactions

Comments

  1. Diki says

    29 June 2021 at 12:45

    Ok

    Reply

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Primary Sidebar

Pencarian

Tanya Jawab tentang DevOps SRE CPE, gabung di https://t.me/devopsindonesia

Terbaru

  • Solusi AWS CLI SSL VALIDATION failed
  • Monitoring Kubernetes Cluster dengan Prometheus
  • Solusi Playwright Firefox version `GLIBCXX_3.4.30′ not found (required by /lib64/libicuuc.so.69)
  • Cara Upgrade Fedora 35 ke Fedora 36
  • Ekstrak Gzip File dan Ambil Total dengan Python

Komentar

  • Xpud on Script PHP untuk Mengambil History Lagu Shoutcast v2.5
  • Jrenx on Membuat Bot Telegram Sederhana dengan PHP
  • Sella on Kemana Menghilangnya Saldo BCA 50 ribu
  • Rian on Mengganti Halaman Error Laravel
  • Suchie on Kemana Menghilangnya Saldo BCA 50 ribu

Tulisan Populer

  • Password Router Huawei HG8245H5 Indihome 1m views
  • Password Terbaru ZTE F609 Indihome 781.5k views
  • Password Superadmin Huawei HG8245A 294.5k views
  • Cara Setting Manual Modem GPON ZTE F609 Indihome 267.9k views
  • Cara Setting Wireless ZTE F609 Indihome 251k views
  • Mengaktifkan Port LAN di Huawei HG8245 Indihome 165.4k views
  • Akses UseeTV Indihome via Wireless ZTE F609 154.8k views
  • Cara Reset Password ZTE F609 Indihome 146k views
  • Kemana Menghilangnya Saldo BCA 50 ribu 135.4k views
  • Cara Setting DHCP Server Modem/Router ZTE F609 109k views

Kategori

  • Delphi
  • dll
  • Gambas
  • Internet
  • Java
  • Lazarus
  • Linux
  • PHP
  • Review
  • Teknologi

Sponsor

kadal.id
Untuk jadi sponsor, hubungi kita lewat halaman sponsor
© 2021. Jaranguda
  • Linux
  • PHP
  • Internet
  • Teknologi
  • Delphi
  • Gambas
  • Java