Good
Stabil bir id veya geliştiriciyle kararlaştırılmış data-testid kullan.QA PRACTICE•ID NAME
Locator Practice HubTopics / ID, name, and class
Lesson 3 / 20 · Beginner
ID, name, and class
Compare stable attributes with styling-oriented classes.
8 min
Not completed
Concept
ID ve name iyi birer anchor olabilir; ancak CSS-in-JS hashed class’lar ve useId ile üretilen değerler uygulama sürümleri arasında değişebilir. Gerçek bir test sözleşmesi değilse class’ı önceliklendirme.
Prerequisites: HTML & DOM basics
Live demo
Try the locator
Styled panel
Try the locator against the live demo.
Avoid
.css-1x9k2ab gibi hashed class’ı kalıcı kimlik sayma.Why
Görsel tasarım sistemi değiştiğinde testlerin gereksiz yere kırılmasını önlersin.
Real-world trap
Her id stabil değildir; dinamik prefix/suffix ve render sırasını kontrol et.
Framework comparison
Playwright
page.locator("[data-testid='account-email-input']")Selenium
driver.findElement(By.cssSelector("[data-testid='account-email-input']"))Cypress
cy.get("[data-testid='account-email-input']")