⚙️ Kurulum (Installation)

Kurulum (Installation): Cypress, npm üzerinden kurulan ve hem GUI (Test Runner) hem de CLI (headless) modunda çalışabilen bir araçtır.

Cypress, npm üzerinden kurulan ve hem GUI (Test Runner) hem de CLI (headless) modunda çalışabilen bir araçtır. Kurulum tek bir paket yüklemekten ibarettir — Java'daki gibi ayrı bir driver indirme (ChromeDriver, geckodriver) derdi yoktur, Cypress kendi tarayıcı binary'lerini paketle birlikte indirir.

Adım Adım Kurulum (Windows / macOS / Linux)

Projede henüz package.json yoksa oluşturur. Zaten varsa bu adımı atlayabilirsin. Beklenen çıktı: "Wrote to .../package.json".

Cypress'i devDependency olarak kurar ve kendi tarayıcı binary'sini (~300MB) indirir. Linux'ta bazı sistem kütüphaneleri (libgtk2.0-0, libnotify-dev, xvfb) eksikse "apt-get install" ile eklenmesi gerekebilir; Windows ve macOS'ta ekstra bağımlılık gerekmez.

İlk çalıştırmada cypress/ klasör yapısını otomatik oluşturur ve interaktif Test Runner GUI'sini açar — burada E2E ya da Component Testing modunu seçip bir tarayıcı belirlersin. Beklenen çıktı: Cypress penceresi açılır, "Choose a browser" ekranı görünür.

Tüm testleri headless modda (görünür pencere olmadan) terminalde çalıştırır — CI/CD pipeline'larında kullanılan komuttur. Beklenen çıktı: terminalde geçen/kalan test sayısı ve bir video/screenshot yolu.

Cypress binary'sinin doğru kurulduğunu doğrular. Beklenen çıktı: "✔ Verified Cypress! ... It passed all the verification checks."

Otomatik Oluşturulan Klasör Yapısı

cypress.config.js (v10+) tüm konfigürasyonun tek kaynağıdır — eski cypress.json artık kullanılmaz. Java'da bunu Maven'in pom.xml'i ya da pytest.ini gibi düşünebilirsin: framework'ün nasıl davranacağını tanımlayan tek merkezi dosya.

cypress/e2e/login.cy.js — İlk Test Dosyan

Micro Lab: Cypress — Assertion yazma

TODO satirini beklenen cozumdeki kritik satirla degistir. Bu gercek runtime degil; amac dogru yapinin yazilmasini kontrollu olarak pekistirmek.

Adim Adim: Cypress — Assertion yazma

Neyi dogrulayacagini belirle: gorunurluk / metin / CSS / attribute

Kurulum adımları

  1. npm init -y — Projede henüz package.json yoksa oluşturur. Zaten varsa bu adımı atlayabilirsin. Beklenen çıktı: "Wrote to .../package.json".
  2. npm install cypress --save-dev — Cypress'i devDependency olarak kurar ve kendi tarayıcı binary'sini (~300MB) indirir. Linux'ta bazı sistem kütüphaneleri (libgtk2.0-0, libnotify-dev, xvfb) eksikse "apt-get install" ile eklenmesi gerekebilir; Windows ve macOS'ta ekstra bağımlılık gerekmez.
  3. npx cypress open — İlk çalıştırmada cypress/ klasör yapısını otomatik oluşturur ve interaktif Test Runner GUI'sini açar — burada E2E ya da Component Testing modunu seçip bir tarayıcı belirlersin. Beklenen çıktı: Cypress penceresi açılır, "Choose a browser" ekranı görünür.
  4. npx cypress run — Tüm testleri headless modda (görünür pencere olmadan) terminalde çalıştırır — CI/CD pipeline'larında kullanılan komuttur. Beklenen çıktı: terminalde geçen/kalan test sayısı ve bir video/screenshot yolu.
  5. npx cypress verify — Cypress binary'sinin doğru kurulduğunu doğrular. Beklenen çıktı: "✔ Verified Cypress! ... It passed all the verification checks."