Mengklik, mengetik, dan mengisi formulir

Idenya

Banyak data baru muncul setelah kamu melakukan sesuatu: mencari sebuah kata, memilih filter, menyetujui banner, mengklik "Show more". Aksi-aksi Playwright (fill, click, press, check, select_option) berperilaku seperti pengguna sungguhan, termasuk menunggu otomatis sampai elemennya terlihat, aktif, dan tidak tertutup oleh hal lain.

Mengisi dan men-submit formulir pencarian

Ada data yang hanya muncul setelah kamu berinteraksi dengan halamannya, seperti hasil pencarian. Scraper bisa mengetik di kotak pencarian lalu mengirimnya, persis seperti manusia:

from playwright.sync_api import sync_playwright

with sync_playwright() as p:
    browser = p.chromium.launch()
    page = browser.new_page()
    page.goto("https://nusantara-gadget.test/")

    search_box = page.get_by_placeholder("Search products")
    search_box.fill("galaxy")
    search_box.press("Enter")

    print(page.url)
    print(page.locator(".result-count").inner_text())
    print(page.locator(".product-card .title").all_inner_texts())
    browser.close()

https://nusantara-gadget.test/search?q=galaxy
5 results
['Galaxy A55 5G', 'Galaxy S24', 'Galaxy Buds FE', 'Galaxy Watch6', 'Galaxy Fit3']

• fill(text) mengosongkan field lalu mengetik teksnya sekaligus.
• press("Enter") menekan sebuah tombol keyboard saat field sedang fokus, yang men-submit formulirnya, seperti yang dilakukan manusia.
• Mengklik tombol submit juga bisa: page.get_by_role("button", name="Search").click().

Perhatikan URL-nya: /search?q=galaxy. Formulirnya adalah formulir GET biasa, jadi kata pencariannya masuk ke URL. Begitu kamu melihat itu, kamu bisa langsung goto("/search?q=...") untuk setiap kata, melewati formulirnya sama sekali. Selalu cari jalan pintas seperti ini.

fill mengisi nilainya seketika. Sebagian situs bereaksi terhadap setiap ketukan tombol (kotak autocomplete); untuk situs seperti itu, press_sequentially("galaxy", delay=100) mengetik satu karakter dalam satu waktu.

Saat ada sesuatu yang menghalangi

Halaman deals dibuka dengan banner cookie yang menutupi halaman. Klik pada link sebuah deal gagal, karena pengguna sungguhan juga tidak akan bisa mengkliknya:

from playwright.sync_api import TimeoutError as PlaywrightTimeout

with sync_playwright() as p:
    browser = p.chromium.launch()
    page = browser.new_page()
    page.goto("https://nusantara-gadget.test/deals")
    try:
        page.locator(".deal-name").first.click(timeout=3000)
    except PlaywrightTimeout as error:
        print(str(error).splitlines()[-2].strip())

    page.get_by_role("button", name="Reject").click()        # dismiss the banner (choosing the privacy-friendly option)
    page.locator(".deal-name").first.click()
    print(page.url)
    print(page.locator(".product-title").inner_text())
    browser.close()

- <div id="cookie-banner"> intercepts pointer events
https://nusantara-gadget.test/product/2
Redmi Note 13 Pro

Log error Playwright menyebut biang keroknya: elemen cookie-banner menghalangi pointer event. Tutup dulu banner-nya, lalu lanjutkan. (click(force=True) melewati pengecekan ini, tetapi itu seperti mengklik menembus tembok: menyembunyikan masalah sebenarnya. Tutup overlay-nya saja.)

Klik pada link deal juga menunggu 2,5 detik sampai deals-nya termuat: auto-waiting juga berlaku untuk klik.

Tombol yang mengubah halaman

Tidak setiap klik melakukan navigasi. "Add to cart" memperbarui halaman di tempat:

with sync_playwright() as p:
    browser = p.chromium.launch()
    page = browser.new_page()
    page.goto("https://nusantara-gadget.test/product/1")
    add = page.get_by_role("button", name="Add to cart")
    add.click()
    add.click()
    print("cart:", page.locator("#cart-count").inner_text())

    page.goto("https://nusantara-gadget.test/product/2")
    button = page.get_by_role("button", name="Add to cart")
    print("enabled:", button.is_enabled(), "|", page.locator(".stock").inner_text())
    browser.close()

cart: 2
enabled: False | Sold out

Produk 2 habis, jadi tombolnya nonaktif. Mengklik tombol yang nonaktif akan menunggu sampai tombolnya aktif, lalu timeout. Cek is_enabled() (atau is_visible(), is_checked()) lebih dulu saat sebuah kontrol memang mungkin tidak tersedia; di sini, tombol yang nonaktif itu sendiri adalah data yang berguna: "stok habis".

Kontrol lainnya

Formulir punya lebih dari kotak teks. Setiap jenis kontrol punya method-nya sendiri, dan semuanya bekerja dengan cara yang sama, pada sebuah locator:

page.get_by_label("Remember me").check()                   # checkboxes and radio buttons
page.get_by_label("Sort by").select_option("price-asc")    # <select> dropdowns, by value or label
page.get_by_label("Quantity").fill("3")                    # number inputs are filled with strings
page.keyboard.press("Escape")                              # keys without a specific element

Semuanya menunggu otomatis dan bisa dipakai dengan locator apa pun.

Mengapa ini penting untuk kode yang bersih

Langkah-langkah interaksi adalah tempat scraper menjadi panjang dan berulang. Membungkus setiap langkah dalam fungsi kecil yang diberi nama (search(page, term), dismiss_cookies(page), add_to_cart(page)) mengubah script utama menjadi daftar langkah yang mudah dibaca, dan memberimu satu tempat untuk memperbaiki setiap langkah saat situsnya berubah.

Rangkuman

• fill(text), press("Enter"), click(); press_sequentially untuk mengetik per ketukan tombol.
• Formulir GET menaruh input-nya di URL: sering kali kamu bisa melewati formulirnya.
• Overlay seperti banner cookie menghalangi klik; tutup overlay-nya (utamakan "Reject" saat ditanya soal cookie), jangan force=True.
• Kontrol yang nonaktif membuat klik timeout; cek is_enabled() lebih dulu.
• check(), select_option(), page.keyboard.press() untuk kontrol lainnya.