Post

Pengantar Selenium WebDriver — Automasi Testing Aplikasi Web

Posted
Preview Image
By Alifsa Rezky Rahmah Sabran
8 min read
Pengantar Selenium WebDriver — Automasi Testing Aplikasi Web

🌐 1. Apa Itu Selenium?

Selenium adalah framework open-source yang digunakan untuk automation testing pada browser. Dengan Selenium, penguji (QA Engineer) dapat membuat skrip otomatis untuk melakukan klik, input teks, login, logout, dan validasi UI secara cepat tanpa harus melakukan tes manual satu per satu.

✨ Keunggulan Selenium:

  • Gratis dan open-source
  • Mendukung banyak bahasa (Python, Java, C#, JavaScript)
  • Bisa dijalankan di berbagai browser (Chrome, Firefox, Edge, Safari)
  • Mudah diintegrasikan dengan framework testing seperti Pytest, JUnit, TestNG

🧠 2. Apa Itu Selenium WebDriver?

WebDriver adalah komponen utama dari Selenium yang berfungsi sebagai jembatan antara script dan browser.

🎯 Dengan WebDriver, kita bisa:

  • Membuka browser otomatis
  • Mengisi form secara otomatis
  • Klik tombol seperti user sungguhan
  • Memvalidasi apakah elemen tampil sesuai harapan

Singkatnya: Selenium WebDriver memungkinkan komputer melakukan klik seperti manusia.

⚙️ 3. Kenapa QA Menggunakan Selenium?

AlasanPenjelasan
💸 Open-sourceTidak perlu biaya lisensi
🔄 Repetitif task jadi otomatisTidak perlu klik manual berulang-ulang
🚀 Mendukung berbagai bahasaCocok untuk developer dan QA
♻ Bisa digabung dengan CI/CDMendukung pipeline otomatis saat deploy
👥 Komunitas besarBanyak dokumentasi dan solusi online

🏗️ 4. Arsitektur Selenium WebDriver

1
2
3
4
5
6
7

Script Test (Python/Java) 
    ↓
WebDriver (Selenium Library)
    ↓
Browser Driver (ChromeDriver/GeckoDriver)
    ↓
Browser (Chrome/Firefox/Edge)

Komponen:

KomponenFungsi
Test ScriptKode automation yang kita tulis
WebDriver APILibrary Selenium yang menyediakan perintah automation
Browser DriverPenghubung antara WebDriver dan browser (misal: ChromeDriver)
BrowserAplikasi browser yang akan ditest

💻 5. Instalasi Selenium (Python)

Step 1: Install Selenium

1

pip install selenium

Step 2: Download Browser Driver

Pilih sesuai browser yang akan digunakan:

BrowserDriverDownload Link
ChromeChromeDriverhttps://chromedriver.chromium.org
FirefoxGeckoDriverhttps://github.com/mozilla/geckodriver/releases
EdgeEdgeDriverhttps://developer.microsoft.com/en-us/microsoft-edge/tools/webdriver
SafariSafariDriverBuilt-in di macOS

💡 Tips: Gunakan webdriver-manager untuk otomatis download driver:

1

pip install webdriver-manager

Step 3: Verifikasi Instalasi

1
2
3
4
5
6
7

from selenium import webdriver

# Membuka browser Chrome
driver = webdriver.Chrome()
driver.get("https://www.google.com")
print("Browser opened successfully!")
driver.quit()

🎯 6. Script Dasar Selenium WebDriver

Contoh 1: Membuka Website

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

from selenium import webdriver
from selenium.webdriver.chrome.service import Service
from webdriver_manager.chrome import ChromeDriverManager

# Setup ChromeDriver otomatis
driver = webdriver.Chrome(service=Service(ChromeDriverManager().install()))

# Buka website
driver.get("https://www.google.com")

# Print title halaman
print(f"Title: {driver.title}")

# Tutup browser
driver.quit()

Contoh 2: Mencari Elemen dan Klik

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.chrome.service import Service
from webdriver_manager.chrome import ChromeDriverManager
import time

driver = webdriver.Chrome(service=Service(ChromeDriverManager().install()))

# Buka website
driver.get("https://www.google.com")

# Cari search box menggunakan name attribute
search_box = driver.find_element(By.NAME, "q")

# Ketik keyword
search_box.send_keys("Selenium WebDriver")

# Submit form
search_box.submit()

# Tunggu 3 detik untuk melihat hasil
time.sleep(3)

# Tutup browser
driver.quit()

Contoh 3: Login Automation

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.chrome.service import Service
from webdriver_manager.chrome import ChromeDriverManager
import time

driver = webdriver.Chrome(service=Service(ChromeDriverManager().install()))

# Buka halaman login
driver.get("https://example.com/login")

# Cari dan isi username
username_field = driver.find_element(By.ID, "username")
username_field.send_keys("testuser@example.com")

# Cari dan isi password
password_field = driver.find_element(By.ID, "password")
password_field.send_keys("password123")

# Klik tombol login
login_button = driver.find_element(By.XPATH, "//button[@type='submit']")
login_button.click()

# Tunggu halaman load
time.sleep(3)

# Validasi login berhasil
if "dashboard" in driver.current_url:
    print("✅ Login berhasil!")
else:
    print("❌ Login gagal!")

driver.quit()

🔍 7. Metode Menemukan Elemen (Locators)

Selenium menyediakan berbagai cara untuk menemukan elemen di halaman web:

LocatorSyntaxContoh
IDBy.IDdriver.find_element(By.ID, "username")
NameBy.NAMEdriver.find_element(By.NAME, "email")
Class NameBy.CLASS_NAMEdriver.find_element(By.CLASS_NAME, "btn-primary")
Tag NameBy.TAG_NAMEdriver.find_element(By.TAG_NAME, "input")
Link TextBy.LINK_TEXTdriver.find_element(By.LINK_TEXT, "Login")
Partial Link TextBy.PARTIAL_LINK_TEXTdriver.find_element(By.PARTIAL_LINK_TEXT, "Log")
CSS SelectorBy.CSS_SELECTORdriver.find_element(By.CSS_SELECTOR, "#username")
XPathBy.XPATHdriver.find_element(By.XPATH, "//input[@id='username']")

Best Practices:

  • ✅ Prioritas: ID > Name > CSS Selector > XPath
  • ✅ ID paling cepat dan stabil (jika tersedia)
  • ✅ XPath paling fleksibel tapi bisa lambat
  • ✅ Hindari Class Name jika class nya dinamis

🛠️ 8. Operasi Umum WebDriver

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

# Buka URL
driver.get("https://example.com")

# Kembali ke halaman sebelumnya
driver.back()

# Maju ke halaman berikutnya
driver.forward()

# Refresh halaman
driver.refresh()

# Dapatkan URL saat ini
current_url = driver.current_url

# Dapatkan title halaman
page_title = driver.title

Interaksi dengan Elemen

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

# Klik elemen
element.click()

# Ketik teks
element.send_keys("Hello World")

# Clear text field
element.clear()

# Dapatkan text dari elemen
text = element.text

# Dapatkan attribute value
value = element.get_attribute("value")

# Cek apakah elemen ditampilkan
is_displayed = element.is_displayed()

# Cek apakah elemen enabled
is_enabled = element.is_enabled()

# Cek apakah checkbox/radio selected
is_selected = element.is_selected()

Window & Tab Management

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

# Dapatkan window handle saat ini
current_window = driver.current_window_handle

# Dapatkan semua window handles
all_windows = driver.window_handles

# Switch ke window/tab lain
driver.switch_to.window(all_windows[1])

# Buka tab baru
driver.execute_script("window.open('');")

# Close tab saat ini
driver.close()

# Close semua window dan quit driver
driver.quit()

⏰ 9. Menangani Wait (Penantian)

Implicit Wait

Menunggu elemen muncul dengan timeout tertentu:

1
2
3
4
5

# Set implicit wait 10 detik
driver.implicitly_wait(10)

# Selenium akan menunggu max 10 detik saat mencari elemen
element = driver.find_element(By.ID, "dynamic-element")

Explicit Wait

Menunggu kondisi spesifik terpenuhi:

1
2
3
4
5
6
7

from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC

# Tunggu sampai elemen clickable (max 10 detik)
wait = WebDriverWait(driver, 10)
element = wait.until(EC.element_to_be_clickable((By.ID, "submit-btn")))
element.click()

Expected Conditions yang Sering Digunakan:

ConditionFungsi
presence_of_element_locatedElemen ada di DOM
visibility_of_element_locatedElemen terlihat di halaman
element_to_be_clickableElemen bisa diklik
title_containsTitle halaman mengandung text tertentu
url_containsURL mengandung text tertentu

📸 10. Screenshot untuk Dokumentasi Bug

1
2
3
4
5
6
7
8
9

# Ambil screenshot dan simpan
driver.save_screenshot("error_page.png")

# Atau dengan path lengkap
driver.save_screenshot("/path/to/screenshots/login_failed.png")

# Screenshot elemen tertentu
element = driver.find_element(By.ID, "error-message")
element.screenshot("error_element.png")

🎭 11. Menangani Alert, Popup, dan Frame

Alert / Popup

1
2
3
4
5
6
7
8
9
10
11
12
13

from selenium.webdriver.common.alert import Alert

# Tunggu dan accept alert
alert = driver.switch_to.alert
print(f"Alert text: {alert.text}")
alert.accept()

# Atau dismiss alert
alert.dismiss()

# Input text ke alert (jika prompt)
alert.send_keys("Input text")
alert.accept()

iFrame

1
2
3
4
5
6
7
8
9
10
11
12

# Switch ke iframe by index
driver.switch_to.frame(0)

# Switch ke iframe by name/id
driver.switch_to.frame("iframe-name")

# Switch ke iframe by element
iframe_element = driver.find_element(By.TAG_NAME, "iframe")
driver.switch_to.frame(iframe_element)

# Kembali ke main content
driver.switch_to.default_content()

1
2
3
4
5
6
7
8
9
10
11

from selenium.webdriver.support.ui import Select

# Select by visible text
dropdown = Select(driver.find_element(By.ID, "country"))
dropdown.select_by_visible_text("Indonesia")

# Select by value
dropdown.select_by_value("ID")

# Select by index
dropdown.select_by_index(2)

🧪 12. Contoh Test Case Lengkap

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.chrome.service import Service
from webdriver_manager.chrome import ChromeDriverManager
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
import time

class TestLogin:
    def setup_method(self):
        """Setup sebelum setiap test"""
        self.driver = webdriver.Chrome(
            service=Service(ChromeDriverManager().install())
        )
        self.driver.maximize_window()
        self.driver.implicitly_wait(10)
    
    def teardown_method(self):
        """Cleanup setelah setiap test"""
        self.driver.quit()
    
    def test_login_success(self):
        """Test login dengan credentials valid"""
        driver = self.driver
        
        # Buka halaman login
        driver.get("https://example.com/login")
        
        # Input username
        username = driver.find_element(By.ID, "username")
        username.send_keys("testuser@example.com")
        
        # Input password
        password = driver.find_element(By.ID, "password")
        password.send_keys("Test@123")
        
        # Klik login button
        login_btn = driver.find_element(By.CSS_SELECTOR, "button[type='submit']")
        login_btn.click()
        
        # Tunggu redirect ke dashboard
        wait = WebDriverWait(driver, 10)
        wait.until(EC.url_contains("dashboard"))
        
        # Validasi login berhasil
        assert "dashboard" in driver.current_url
        print("✅ Test login success - PASSED")
    
    def test_login_invalid_credentials(self):
        """Test login dengan credentials invalid"""
        driver = self.driver
        
        driver.get("https://example.com/login")
        
        # Input credentials salah
        driver.find_element(By.ID, "username").send_keys("wrong@example.com")
        driver.find_element(By.ID, "password").send_keys("wrongpass")
        driver.find_element(By.CSS_SELECTOR, "button[type='submit']").click()
        
        # Tunggu error message muncul
        wait = WebDriverWait(driver, 10)
        error_msg = wait.until(
            EC.visibility_of_element_located((By.CLASS_NAME, "error-message"))
        )
        
        # Validasi error message
        assert "Invalid credentials" in error_msg.text
        print("✅ Test login invalid - PASSED")
        
        # Screenshot error
        driver.save_screenshot("login_error.png")

# Jalankan test
if __name__ == "__main__":
    test = TestLogin()
    test.setup_method()
    test.test_login_success()
    test.teardown_method()

✅ Kesimpulan

  • Selenium WebDriver adalah tool automation testing yang powerful dan gratis
  • Mendukung berbagai browser dan bahasa pemrograman
  • Locators yang tepat membuat test lebih stabil dan maintainable
  • Wait mechanisms penting untuk menangani elemen dinamis
  • Best practices membuat test suite lebih efisien dan mudah di-maintain
  • Integrasi dengan CI/CD membuat testing menjadi bagian dari development pipeline

💡 Next Step: Pelajari Page Object Model (POM) untuk struktur kode yang lebih baik dan Pytest untuk framework testing yang lebih powerful!

Software Testing & Quality Assurance
Selenium Automation Testing QA STQA WebDriver UI Testing
This post is licensed under CC BY 4.0 by the author.