{"id":38856,"date":"2026-02-09T12:01:17","date_gmt":"2026-02-09T09:01:17","guid":{"rendered":"https:\/\/fatihsoysal.com\/blog\/playwright-locators-rehberi-getbyrole-getbytext-getbylabel-css-ve-xpath-ile-guclu-seciciler\/"},"modified":"2026-02-09T12:01:17","modified_gmt":"2026-02-09T09:01:17","slug":"playwright-locators-rehberi-getbyrole-getbytext-getbylabel-css-ve-xpath-ile-guclu-seciciler","status":"publish","type":"post","link":"https:\/\/fatihsoysal.com\/blog\/playwright-locators-rehberi-getbyrole-getbytext-getbylabel-css-ve-xpath-ile-guclu-seciciler\/","title":{"rendered":"Playwright Locators Rehberi: getByRole, getByText, getByLabel, CSS ve XPath ile G\u00fc\u00e7l\u00fc Se\u00e7iciler"},"content":{"rendered":"<h2>Playwright Locators Rehberi: getByRole, getByText, getByLabel, CSS ve XPath ile G\u00fc\u00e7l\u00fc Se\u00e7iciler<\/h2>\n<p>Web otomasyonu ve u\u00e7tan uca test s\u00fcre\u00e7lerinde elementleri do\u011fru, stabil ve verimli bir \u015fekilde bulmak, testlerin ba\u015far\u0131s\u0131 i\u00e7in kritik \u00f6neme sahiptir. Playwright, modern web uygulamalar\u0131n\u0131 test etmek i\u00e7in g\u00fc\u00e7l\u00fc ve esnek bir ara\u00e7 seti sunarken, element se\u00e7icileri (locators) bu s\u00fcrecin temelini olu\u015fturur. Bu makale, Playwright&#8217;\u0131n sundu\u011fu ba\u015fl\u0131ca locator stratejilerini \u2013 <code>getByRole<\/code>, <code>getByText<\/code>, <code>getByLabel<\/code>, CSS se\u00e7iciler ve XPath \u2013 derinlemesine inceleyecek, her birinin avantajlar\u0131n\u0131, dezavantajlar\u0131n\u0131 ve en iyi kullan\u0131m senaryolar\u0131n\u0131 detayl\u0131 kod \u00f6rnekleriyle a\u00e7\u0131klayacakt\u0131r. Amac\u0131m\u0131z, Playwright ile daha sa\u011flam, okunabilir ve bak\u0131m\u0131 kolay otomasyon testleri yazman\u0131z i\u00e7in size kapsaml\u0131 bir rehber sunmakt\u0131r.<\/p>\n<h3>Playwright Locators&#8217;a Giri\u015f: Neden \u00d6nemliler?<\/h3>\n<p>Playwright&#8217;\u0131n test otomasyonundaki g\u00fcc\u00fc, elementleri bulma ve onlarla etkile\u015fim kurma yetene\u011finden gelir. Bir web sayfas\u0131ndaki bir butona t\u0131klamak, bir metin alan\u0131na veri girmek veya bir elementin g\u00f6r\u00fcn\u00fcrl\u00fc\u011f\u00fcn\u00fc do\u011frulamak i\u00e7in \u00f6ncelikle o elementi do\u011fru bir \u015fekilde hedeflememiz gerekir. \u0130\u015fte tam bu noktada Playwright locators devreye girer. Do\u011fru locator se\u00e7imi, testlerinizin kararl\u0131l\u0131\u011f\u0131n\u0131 art\u0131r\u0131r, uygulaman\u0131n UI de\u011fi\u015fikliklerinden daha az etkilenmesini sa\u011flar ve test kodunuzun okunabilirli\u011fini y\u00fckseltir.<\/p>\n<h4>Stabil ve G\u00fcvenilir Testler \u0130\u00e7in Temel<\/h4>\n<p>Elementlerin dinamik ID&#8217;leri veya s\u0131k de\u011fi\u015fen CSS s\u0131n\u0131flar\u0131 oldu\u011funda, geleneksel se\u00e7icilerle yaz\u0131lan testler k\u0131r\u0131lgan hale gelebilir. Playwright locators, bu t\u00fcr sorunlar\u0131 minimize etmek i\u00e7in daha ak\u0131ll\u0131 ve anlamsal yakla\u015f\u0131mlar sunar. \u00d6rne\u011fin, bir butonun metnine veya eri\u015filebilirlik rol\u00fcne g\u00f6re se\u00e7im yapmak, o butonun g\u00f6rsel stilinin veya konumunun de\u011fi\u015fmesinden etkilenme olas\u0131l\u0131\u011f\u0131n\u0131 azalt\u0131r.<\/p>\n<h4>Farkl\u0131 Senaryolar \u0130\u00e7in Esnek Yakla\u015f\u0131mlar<\/h4>\n<p>Her elementin benzersiz bir tan\u0131m\u0131 veya kolayca eri\u015filebilir bir niteli\u011fi olmayabilir. Playwright, bu farkl\u0131 senaryolar\u0131 ele almak i\u00e7in geni\u015f bir yelpazede locator stratejileri sunar. Bir elementin eri\u015filebilirlik rol\u00fc yoksa metnine, metni yoksa ili\u015fkili etiketine veya karma\u015f\u0131k bir yap\u0131ya sahipse CSS veya XPath&#8217;e ba\u015fvurabilirsiniz. Bu esneklik, her t\u00fcrl\u00fc web uygulamas\u0131n\u0131 test etme yetene\u011fi sa\u011flar.<\/p>\n<h4>Otomasyon Testlerinde Bak\u0131m Kolayl\u0131\u011f\u0131<\/h4>\n<p>Testlerin bak\u0131m\u0131, yaz\u0131lmas\u0131 kadar \u00f6nemlidir. Anlaml\u0131 ve stabil locators kullanmak, bir UI de\u011fi\u015fikli\u011fi oldu\u011funda test kodunuzda yapman\u0131z gereken de\u011fi\u015fiklik miktar\u0131n\u0131 \u00f6nemli \u00f6l\u00e7\u00fcde azalt\u0131r. \u00d6rne\u011fin, <code>getByRole('button', { name: 'G\u00f6nder' })<\/code> ile bir butonu se\u00e7mek, geli\u015ftiricinin o butonun class ad\u0131n\u0131 de\u011fi\u015ftirmesi durumunda testin bozulmamas\u0131n\u0131 sa\u011flar. Bu da uzun vadede test otomasyonu maliyetlerini d\u00fc\u015f\u00fcr\u00fcr.<\/p>\n<h3>Anlamsal Se\u00e7iciler: getByRole ve Eri\u015filebilirlik Odakl\u0131 Yakla\u015f\u0131m<\/h3>\n<p><code>getByRole<\/code>, Playwright&#8217;\u0131n en g\u00fc\u00e7l\u00fc ve \u00f6nerilen locator stratejilerinden biridir. Web elementlerini eri\u015filebilirlik (ARIA) rol\u00fcne g\u00f6re bulmay\u0131 sa\u011flar. Bu yakla\u015f\u0131m, sadece testlerinizi daha sa\u011flam hale getirmekle kalmaz, ayn\u0131 zamanda uygulaman\u0131z\u0131n eri\u015filebilirlik standartlar\u0131na uygunlu\u011funu da dolayl\u0131 olarak kontrol etmenize yard\u0131mc\u0131 olur.<\/p>\n<h4>getByRole Nedir ve Nas\u0131l Kullan\u0131l\u0131r?<\/h4>\n<p><code>getByRole<\/code>, HTML elementlerinin sahip oldu\u011fu standart ARIA rollerini (\u00f6rne\u011fin, <code>button<\/code>, <code>textbox<\/code>, <code>link<\/code>, <code>checkbox<\/code>, <code>heading<\/code>) kullanarak elementleri bulur. Bu y\u00f6ntem, bir elementin g\u00f6rsel \u00f6zelliklerinden ziyade anlamsal anlam\u0131na odaklan\u0131r. Kullan\u0131m\u0131 olduk\u00e7a basittir:<\/p>\n<pre><code class=\"language-typescript\">\nawait page.getByRole('button', { name: 'G\u00f6nder' }).click();\nawait page.getByRole('textbox', { name: 'Kullan\u0131c\u0131 Ad\u0131' }).fill('testuser');\nawait page.getByRole('link', { name: 'Daha Fazla Bilgi' }).click();\nawait page.getByRole('checkbox', { name: 'Beni Hat\u0131rla' }).check();\nawait page.getByRole('heading', { name: '\u00dcr\u00fcn Detaylar\u0131', level: 2 }).isVisible();\n<\/pre>\n<p><\/code><\/p>\n<p><code>name<\/code> se\u00e7ene\u011fi, genellikle elementin eri\u015filebilir ad\u0131n\u0131 (\u00f6rne\u011fin, butonun metni, input'un etiketi) belirtir. <code>level<\/code> se\u00e7ene\u011fi ba\u015fl\u0131klar i\u00e7in (h1, h2 vb.), <code>checked<\/code>, <code>selected<\/code>, <code>expanded<\/code> gibi durumlar ise ilgili elementin anl\u0131k durumunu kontrol etmek i\u00e7in kullan\u0131l\u0131r.<\/p>\n<h4>Eri\u015filebilirlik ve Test Kalitesi \u0130li\u015fkisi<\/h4>\n<p><code>getByRole<\/code> kullanmak, uygulaman\u0131z\u0131n eri\u015filebilirlik a\u00e7\u0131s\u0131ndan daha iyi olmas\u0131n\u0131 te\u015fvik eder. \u00c7\u00fcnk\u00fc bu locator, bir elementin eri\u015filebilir ad\u0131n\u0131 veya rol\u00fcn\u00fc bulmaya \u00e7al\u0131\u015f\u0131r. E\u011fer bir geli\u015ftirici, bir element i\u00e7in eri\u015filebilir bir rol veya isim tan\u0131mlamam\u0131\u015fsa, <code>getByRole<\/code> o elementi bulamayabilir. Bu durum, geli\u015ftiricileri eri\u015filebilirlik standartlar\u0131na uygun kod yazmaya y\u00f6nlendirir ve sonu\u00e7 olarak hem kullan\u0131c\u0131lar hem de otomasyon testleri i\u00e7in daha iyi bir deneyim sunar.<\/p>\n<h4>Yayg\u0131n getByRole Kullan\u0131m Senaryolar\u0131 ve Parametreleri<\/h4>\n<ul>\n<li><strong>Butonlar:<\/strong> <code>getByRole('button', { name: 'Kaydet' })<\/code><\/li>\n<li><strong>Metin Kutular\u0131:<\/strong> <code>getByRole('textbox', { name: 'Email' })<\/code><\/li>\n<li><strong>Linkler:<\/strong> <code>getByRole('link', { name: 'Hakk\u0131m\u0131zda' })<\/code><\/li>\n<li><strong>Ba\u015fl\u0131klar:<\/strong> <code>getByRole('heading', { name: 'Ana Sayfa', level: 1 })<\/code><\/li>\n<li><strong>Onay Kutular\u0131:<\/strong> <code>getByRole('checkbox', { name: '\u015eartlar\u0131 Kabul Ediyorum' })<\/code><\/li>\n<li><strong>Radyo Butonlar\u0131:<\/strong> <code>getByRole('radio', { name: 'Erkek' })<\/code><\/li>\n<li><strong>Listeler:<\/strong> <code>getByRole('list', { name: 'Men\u00fc \u00d6\u011feleri' })<\/code><\/li>\n<\/ul>\n<p>Parametreler, elementleri daha spesifik olarak hedeflemek i\u00e7in kullan\u0131l\u0131r. \u00d6rne\u011fin, ayn\u0131 metne sahip birden fazla buton varsa, di\u011fer nitelikleri (\u00f6rne\u011fin, <code>pressed: true<\/code>) kullanarak ay\u0131rt edebilirsiniz.<\/p>\n<h3>Metin Tabanl\u0131 Se\u00e7iciler: getByText ile Kullan\u0131c\u0131 Odakl\u0131 Yakla\u015f\u0131m<\/h3>\n<p><code>getByText<\/code>, bir elementin g\u00f6r\u00fcn\u00fcr metin i\u00e7eri\u011fine g\u00f6re se\u00e7im yapman\u0131z\u0131 sa\u011flar. Bu, \u00f6zellikle kullan\u0131c\u0131lar\u0131n etkile\u015fimde bulundu\u011fu metin etiketli elementleri hedeflemek i\u00e7in olduk\u00e7a sezgisel ve kullan\u0131\u015fl\u0131 bir y\u00f6ntemdir. Kullan\u0131c\u0131lar bir butona \"G\u00f6nder\" yaz\u0131s\u0131 y\u00fcz\u00fcnden t\u0131kl\u0131yorsa, testlerinizin de ayn\u0131 mant\u0131kla o butonu bulmas\u0131 mant\u0131kl\u0131d\u0131r.<\/p>\n<h4>getByText Nedir ve Avantajlar\u0131 Nelerdir?<\/h4>\n<p><code>getByText<\/code>, bir elementin i\u00e7indeki veya alt\u0131ndaki metin i\u00e7eri\u011fini arar. En b\u00fcy\u00fck avantaj\u0131, kullan\u0131c\u0131 aray\u00fcz\u00fcndeki metin de\u011fi\u015fikliklerine kar\u015f\u0131 daha diren\u00e7li olmas\u0131d\u0131r. Bir elementin ID'si veya class'\u0131 de\u011fi\u015fse bile, metni ayn\u0131 kald\u0131\u011f\u0131 s\u00fcrece testiniz \u00e7al\u0131\u015fmaya devam eder.<\/p>\n<pre><code class=\"language-typescript\">\nawait page.getByText('Ho\u015f Geldiniz!').isVisible();\nawait page.getByText('Sepete Ekle').click();\nawait page.getByText('Toplam: 150 TL').textContent();\n<\/pre>\n<p><\/code><\/p>\n<h4>Tam E\u015fle\u015fme ve K\u0131smi E\u015fle\u015fme (exact: true)<\/h4>\n<p>Varsay\u0131lan olarak, <code>getByText<\/code> k\u0131smi e\u015fle\u015fme yapar ve b\u00fcy\u00fck\/k\u00fc\u00e7\u00fck harf duyarl\u0131 de\u011fildir. Yani \"Sepete Ekle\" arad\u0131\u011f\u0131n\u0131zda, \"sepete ekle\" veya \"Sepete ekle\" gibi metinleri de bulabilir. Tam e\u015fle\u015fme istiyorsan\u0131z <code>exact: true<\/code> se\u00e7ene\u011fini kullanmal\u0131s\u0131n\u0131z:<\/p>\n<pre><code class=\"language-typescript\">\n\/\/ K\u0131smi e\u015fle\u015fme (varsay\u0131lan)\nawait page.getByText('Sepete Ekle').click(); \/\/ \"Sepete Ekle\" veya \"sepete ekle\" bulur\n\n\/\/ Tam e\u015fle\u015fme\nawait page.getByText('Sepete Ekle', { exact: true }).click(); \/\/ Sadece \"Sepete Ekle\" bulur\n<\/pre>\n<p><\/code><\/p>\n<h4>Dikkat Edilmesi Gerekenler ve En \u0130yi Uygulamalar<\/h4>\n<p><code>getByText<\/code> kullan\u0131rken dikkatli olunmas\u0131 gereken baz\u0131 noktalar vard\u0131r:<\/p>\n<ul>\n<li><strong>Benzersizlik:<\/strong> Sayfada ayn\u0131 metne sahip birden fazla element varsa, <code>getByText<\/code> ilk e\u015fle\u015feni d\u00f6nd\u00fcrebilir veya belirsizlik hatas\u0131 verebilir. Bu durumda, daha spesifik bir locator (\u00f6rne\u011fin, \u00fcst elementiyle zincirleme) kullanman\u0131z gerekebilir.<\/li>\n<li><strong>G\u00f6r\u00fcn\u00fcr Metin:<\/strong> Sadece kullan\u0131c\u0131ya g\u00f6r\u00fcnen metinleri hedefler. Gizli metinleri bulmaz.<\/li>\n<li><strong>Performans:<\/strong> \u00c7ok b\u00fcy\u00fck ve karma\u015f\u0131k sayfalarda, metin tabanl\u0131 arama di\u011fer se\u00e7icilere g\u00f6re biraz daha yava\u015f olabilir, ancak \u00e7o\u011fu senaryoda farkedilir bir performans d\u00fc\u015f\u00fc\u015f\u00fc ya\u015fanmaz.<\/li>\n<\/ul>\n<h3>Etiket Tabanl\u0131 Se\u00e7iciler: getByLabel ile Form Elementlerini Hedefleme<\/h3>\n<p><code>getByLabel<\/code>, \u00f6zellikle form elementleri (input, textarea, select) i\u00e7in tasarlanm\u0131\u015f bir locator'd\u0131r. Bir <code><label><\/code> etiketi ile ili\u015fkili olan input elementini bulmay\u0131 sa\u011flar. Bu, kullan\u0131c\u0131lar\u0131n bir formu doldururken g\u00f6rd\u00fckleri etiketi kullanarak elementleri hedeflemenin do\u011fal bir yoludur.<\/p>\n<h4>getByLabel Nedir ve Neden Kullan\u0131l\u0131r?<\/h4>\n<p>HTML'de <code><label><\/code> etiketi, bir form kontrol\u00fc (genellikle <code><input><\/code>) ile ili\u015fkilendirilir. Bu ili\u015fki ya <code>for<\/code> niteli\u011fi ile input'un <code>id<\/code>'sine ba\u011flanarak ya da input'u label'\u0131n i\u00e7ine alarak kurulur. <code>getByLabel<\/code>, bu ili\u015fkiyi kullanarak etiketin metni arac\u0131l\u0131\u011f\u0131yla ilgili input elementini bulur.<\/p>\n<pre><code class=\"language-typescript\">\n\/\/ HTML: <label for=\"username\">Kullan\u0131c\u0131 Ad\u0131<\/label><input id=\"username\" type=\"text\">\nawait page.getByLabel('Kullan\u0131c\u0131 Ad\u0131').fill('testuser');\n\n\/\/ HTML: <label>Email: <input type=\"email\"><\/label>\nawait page.getByLabel('Email').fill('test@example.com');\n<\/pre>\n<p><\/code><\/p>\n<h4><code>label<\/code> Etiketinin Rol\u00fc ve \u0130li\u015fkili Inputlar<\/h4>\n<p><code><label><\/code> etiketi, eri\u015filebilirlik a\u00e7\u0131s\u0131ndan hayati \u00f6neme sahiptir. Ekran okuyucular, label metnini ilgili input ile ili\u015fkilendirerek g\u00f6rme engelli kullan\u0131c\u0131lara formlar\u0131 daha iyi anlamalar\u0131n\u0131 sa\u011flar. <code>getByLabel<\/code> bu eri\u015filebilirlik \u00f6zelli\u011finden faydalanarak testlerinizi daha sa\u011flam ve eri\u015filebilir yapar.<\/p>\n<p>Bir <code><label><\/code> etiketi iki \u015fekilde bir form kontrol\u00fc ile ili\u015fkilendirilebilir:<\/p>\n<ol>\n<li><code>for<\/code> niteli\u011fi ile: <code><label for=\"emailInput\">Email<\/label><input id=\"emailInput\" type=\"email\"><\/code><\/li>\n<li>\u0130\u00e7 i\u00e7e yerle\u015ftirme: <code><label>Ad\u0131n\u0131z: <input type=\"text\" name=\"name\"><\/label><\/code><\/li>\n<\/ol>\n<p>Her iki durumda da <code>getByLabel('Email')<\/code> veya <code>getByLabel('Ad\u0131n\u0131z')<\/code> ilgili input elementini bulacakt\u0131r.<\/p>\n<h4>Yayg\u0131n Kullan\u0131m Alanlar\u0131 ve S\u0131n\u0131rlamalar<\/h4>\n<p><code>getByLabel<\/code>, \u00f6zellikle kullan\u0131c\u0131 ad\u0131, \u015fifre, email, adres gibi form alanlar\u0131n\u0131 doldurmak i\u00e7in idealdir. Ancak, bir elementin ili\u015fkili bir <code><label><\/code> etiketi yoksa veya label metni benzersiz de\u011filse bu locator kullan\u0131lamaz. Bu durumda <code>getByRole('textbox', { name: 'Placeholder Metni' })<\/code> veya CSS\/XPath gibi di\u011fer se\u00e7icilere ba\u015fvurmak gerekebilir.<\/p>\n<h3>Geleneksel ve G\u00fc\u00e7l\u00fc Se\u00e7iciler: CSS Se\u00e7iciler<\/h3>\n<p>CSS se\u00e7iciler, web otomasyonunda en yayg\u0131n kullan\u0131lan ve en esnek locator stratejilerinden biridir. HTML elementlerini niteliklerine, konumlar\u0131na ve ili\u015fkilerine g\u00f6re hedeflemek i\u00e7in g\u00fc\u00e7l\u00fc bir s\u00f6zdizimi sunarlar. Playwright, taray\u0131c\u0131n\u0131n yerle\u015fik CSS se\u00e7ici motorunu kullanarak h\u0131zl\u0131 ve g\u00fcvenilir element bulma yetene\u011fi sa\u011flar.<\/p>\n<h4>CSS Se\u00e7icilerin Temelleri ve Playwright Entegrasyonu<\/h4>\n<p>CSS se\u00e7iciler, web geli\u015ftiricileri taraf\u0131ndan elementleri stilize etmek i\u00e7in kullan\u0131l\u0131r. Playwright bu se\u00e7icileri elementleri bulmak i\u00e7in kullan\u0131r. Temel s\u00f6zdizimi \u015f\u00f6yledir:<\/p>\n<ul>\n<li><strong>Etiket Ad\u0131:<\/strong> <code>button<\/code>, <code>input<\/code>, <code>div<\/code><\/li>\n<li><strong>ID:<\/strong> <code>#myId<\/code> (benzersiz olmal\u0131d\u0131r)<\/li>\n<li><strong>Class:<\/strong> <code>.myClass<\/code> (birden fazla elementte olabilir)<\/li>\n<li><strong>Nitelik:<\/strong> <code>[name=\"username\"]<\/code>, <code>[type=\"text\"]<\/code>, <code>[data-test-id=\"login-button\"]<\/code><\/li>\n<\/ul>\n<pre><code class=\"language-typescript\">\nawait page.locator('#loginButton').click(); \/\/ ID ile\nawait page.locator('.product-card').first().click(); \/\/ Class ile\nawait page.locator('input[name=\"password\"]').fill('secret'); \/\/ Nitelik ile\n<\/pre>\n<p><\/code><\/p>\n<h4>Kombinat\u00f6rler ve Pseudo-Class'lar<\/h4>\n<p>CSS se\u00e7iciler, elementler aras\u0131ndaki ili\u015fkileri (ebeveyn-\u00e7ocuk, karde\u015f vb.) tan\u0131mlamak i\u00e7in kombinat\u00f6rler kullan\u0131r:<\/p>\n<ul>\n<li><strong>\u00c7ocuk Se\u00e7ici:<\/strong> <code>.parent > .child<\/code> (do\u011frudan \u00e7ocuk)<\/li>\n<li><strong>Torun Se\u00e7ici:<\/strong> <code>.ancestor .descendant<\/code> (herhangi bir derinlikteki torun)<\/li>\n<li><strong>Biti\u015fik Karde\u015f Se\u00e7ici:<\/strong> <code>h2 + p<\/code> (hemen sonra gelen karde\u015f)<\/li>\n<li><strong>Genel Karde\u015f Se\u00e7ici:<\/strong> <code>h2 ~ p<\/code> (herhangi bir sonra gelen karde\u015f)<\/li>\n<\/ul>\n<p>Pseudo-class'lar, elementlerin durumlar\u0131na veya konumlar\u0131na g\u00f6re se\u00e7im yapmay\u0131 sa\u011flar:<\/p>\n<ul>\n<li><code>:hover<\/code>, <code>:focus<\/code>, <code>:active<\/code> (durumlar)<\/li>\n<li><code>:nth-child(n)<\/code>, <code>:first-child<\/code>, <code>:last-child<\/code> (konum)<\/li>\n<li><code>:not(.class)<\/code> (hari\u00e7 tutma)<\/li>\n<\/ul>\n<pre><code class=\"language-typescript\">\nawait page.locator('div.card > button.add-to-cart').click();\nawait page.locator('ul li:nth-child(2)').click(); \/\/ \u0130kinci liste \u00f6\u011fesi\n<\/pre>\n<p><\/code><\/p>\n<h4>En \u0130yi Uygulamalar ve Performans \u0130pu\u00e7lar\u0131<\/h4>\n<ul>\n<li><strong>Benzersiz Nitelikler:<\/strong> M\u00fcmk\u00fcnse <code>id<\/code> veya <code>data-test-id<\/code> gibi benzersiz nitelikleri kullan\u0131n. Bu, testlerinizi daha sa\u011flam yapar.<\/li>\n<li><strong>K\u0131sa ve Net:<\/strong> Se\u00e7icilerinizi olabildi\u011fince k\u0131sa ve okunabilir tutun. Gereksiz yere karma\u015f\u0131k se\u00e7icilerden ka\u00e7\u0131n\u0131n.<\/li>\n<li><strong>De\u011fi\u015fkenlere Atama:<\/strong> S\u0131k kullan\u0131lan veya karma\u015f\u0131k se\u00e7icileri bir de\u011fi\u015fkene atayarak kodu daha d\u00fczenli hale getirebilirsiniz.<\/li>\n<li><strong>Performans:<\/strong> ID se\u00e7iciler en h\u0131zl\u0131s\u0131d\u0131r. Genel etiket se\u00e7iciler ve \u00e7ok karma\u015f\u0131k kombinat\u00f6rler performans\u0131 bir miktar etkileyebilir, ancak \u00e7o\u011fu durumda bu fark g\u00f6z ard\u0131 edilebilir.<\/li>\n<\/ul>\n<h3>Geli\u015fmi\u015f Se\u00e7iciler: XPath ile Esneklik ve Karma\u015f\u0131kl\u0131k<\/h3>\n<p>XPath (XML Path Language), XML ve HTML belgelerindeki elementleri se\u00e7mek i\u00e7in kullan\u0131lan g\u00fc\u00e7l\u00fc bir sorgu dilidir. CSS se\u00e7icilerin yetersiz kald\u0131\u011f\u0131, \u00f6zellikle elementlerin metin i\u00e7eri\u011fine veya karma\u015f\u0131k ebeveyn-\u00e7ocuk ili\u015fkilerine g\u00f6re se\u00e7ilmesi gereken durumlarda XPath devreye girer. Playwright, XPath'i destekleyerek en karma\u015f\u0131k senaryolar i\u00e7in bile bir \u00e7\u00f6z\u00fcm sunar.<\/p>\n<h4>XPath Nedir ve Ne Zaman Kullan\u0131lmal\u0131?<\/h4>\n<p>XPath, bir HTML belgesinin DOM a\u011fac\u0131nda gezinerek elementleri bulman\u0131z\u0131 sa\u011flar. En b\u00fcy\u00fck avantaj\u0131, CSS se\u00e7icilerle yap\u0131lamayan baz\u0131 \u015feyleri yapabilmesidir:<\/p>\n<ul>\n<li>Elementleri metin i\u00e7eri\u011fine g\u00f6re se\u00e7me (<code>text()<\/code> fonksiyonu).<\/li>\n<li>Geriye do\u011fru gezinme (ebeveyn elementleri se\u00e7me).<\/li>\n<li>Karde\u015f elementler aras\u0131nda daha esnek gezinme.<\/li>\n<\/ul>\n<p>XPath, genellikle CSS se\u00e7icilerin yetersiz kald\u0131\u011f\u0131 durumlarda (\u00f6rne\u011fin, \"Bu metni i\u00e7eren div'in ebeveynindeki butona t\u0131kla\" gibi senaryolar) tercih edilir.<\/p>\n<h4>Temel XPath S\u00f6zdizimi ve Yollar<\/h4>\n<p>XPath yollar\u0131, bir dosya sistemindeki yollara benzer:<\/p>\n<ul>\n<li><code>\/html\/body\/div[1]\/p<\/code>: Mutlak yol (genellikle \u00f6nerilmez, k\u0131r\u0131lgan).<\/li>\n<li><code>\/\/div<\/code>: Belgedeki t\u00fcm <code>\n<div><\/code> elementleri.<\/li>\n<li><code>\/\/button[text()='Kaydet']<\/code>: Metni \"Kaydet\" olan t\u00fcm butonlar.<\/li>\n<li><code>\/\/*[@id='loginForm']<\/code>: ID'si 'loginForm' olan herhangi bir element.<\/li>\n<\/ul>\n<pre><code class=\"language-typescript\">\nawait page.locator('xpath=\/\/button[text()=\"Giri\u015f Yap\"]').click();\nawait page.locator('xpath=\/\/input[@name=\"kullaniciAdi\" and @type=\"text\"]').fill('testuser');\n<\/pre>\n<p><\/code><\/p>\n<p>Playwright'ta XPath kullan\u0131rken, se\u00e7icinin ba\u015f\u0131na <code>xpath=<\/code> eklemeniz gerekir.<\/p>\n<h4>Nitelik Tabanl\u0131 Se\u00e7im ve \u0130li\u015fkisel Yollar<\/h4>\n<p>XPath, niteliklere g\u00f6re se\u00e7im yapmak i\u00e7in <code>@<\/code> sembol\u00fcn\u00fc kullan\u0131r:<\/p>\n<ul>\n<li><code>\/\/input[@id='username']<\/code><\/li>\n<li><code>\/\/a[@href='\/profile']<\/code><\/li>\n<li><code>\/\/div[contains(@class, 'card')]<\/code> (class'\u0131 'card' i\u00e7eren div'ler)<\/li>\n<\/ul>\n<p>\u0130li\u015fkisel yollar, elementler aras\u0131ndaki ba\u011flant\u0131lar\u0131 kullan\u0131r:<\/p>\n<ul>\n<li><code>\/\/div[@class='parent']\/button<\/code> (<code>.parent<\/code> class'\u0131na sahip div'in do\u011frudan alt\u0131ndaki buton)<\/li>\n<li><code>\/\/input[@id='username']\/following-sibling::button<\/code> (<code>username<\/code> input'undan sonra gelen karde\u015f buton)<\/li>\n<li><code>\/\/span[text()='\u00dcr\u00fcn Ad\u0131']\/ancestor::div[@class='product-card']<\/code> (Metni '\u00dcr\u00fcn Ad\u0131' olan span'in <code>.product-card<\/code> class'\u0131na sahip ebeveyni)<\/li>\n<\/ul>\n<h4>Avantajlar\u0131 ve Dezavantajlar\u0131<\/h4>\n<p><strong>Avantajlar\u0131:<\/strong><\/p>\n<ul>\n<li>CSS se\u00e7icilerden daha esnektir, \u00f6zellikle metin i\u00e7eri\u011fi ve ebeveyn-\u00e7ocuk ili\u015fkileri s\u00f6z konusu oldu\u011funda.<\/li>\n<li>Geriye do\u011fru gezinme yetene\u011fi.<\/li>\n<li>Dinamik elementleri bulmak i\u00e7in g\u00fc\u00e7l\u00fc fonksiyonlar (<code>contains()<\/code>, <code>starts-with()<\/code>).<\/li>\n<\/ul>\n<p><strong>Dezavantajlar\u0131:<\/strong><\/p>\n<ul>\n<li>S\u00f6zdizimi daha karma\u015f\u0131k ve okunmas\u0131 zor olabilir.<\/li>\n<li>Mutlak XPath yollar\u0131 \u00e7ok k\u0131r\u0131lgan olabilir.<\/li>\n<li>Performans, \u00f6zellikle \u00e7ok karma\u015f\u0131k sorgularda, CSS se\u00e7icilere g\u00f6re biraz daha yava\u015f olabilir.<\/li>\n<li>Geli\u015ftirici ara\u00e7lar\u0131nda hata ay\u0131klamas\u0131 CSS se\u00e7icilere g\u00f6re daha zor olabilir.<\/li>\n<\/ul>\n<h3>Locator Stratejileri Kar\u015f\u0131la\u015ft\u0131rmas\u0131 ve En \u0130yi Uygulamalar<\/h3>\n<p>Playwright'\u0131n sundu\u011fu zengin locator se\u00e7enekleri, her senaryo i\u00e7in en uygun arac\u0131 se\u00e7me \u00f6zg\u00fcrl\u00fc\u011f\u00fc tan\u0131r. Ancak bu \u00e7e\u015fitlilik, do\u011fru se\u00e7imi yapma konusunda bazen kafa kar\u0131\u015f\u0131kl\u0131\u011f\u0131na yol a\u00e7abilir. \u0130\u015fte farkl\u0131 locator stratejilerinin kar\u015f\u0131la\u015ft\u0131rmas\u0131 ve genel en iyi uygulamalar:<\/p>\n<h4>Hangi Locator Ne Zaman Kullan\u0131lmal\u0131?<\/h4>\n<table>\n<thead>\n<tr>\n<th>Locator Tipi<\/th>\n<th>Avantajlar\u0131<\/th>\n<th>Ne Zaman Kullan\u0131lmal\u0131?<\/th>\n<th>Ne Zaman Ka\u00e7\u0131n\u0131lmal\u0131?<\/th>\n<\/tr>\n<\/thead>\n<tbody>\n<tr>\n<td><code>getByRole<\/code><\/td>\n<td>En sa\u011flam, eri\u015filebilirlik odakl\u0131, UI de\u011fi\u015fikliklerine dayan\u0131kl\u0131.<\/td>\n<td>Eri\u015filebilirlik rol\u00fc ve ad\u0131 olan t\u00fcm elementler (butonlar, inputlar, linkler, ba\u015fl\u0131klar vb.).<\/td>\n<td>Elementin belirgin bir rol\u00fc veya eri\u015filebilir ad\u0131 yoksa.<\/td>\n<\/tr>\n<tr>\n<td><code>getByText<\/code><\/td>\n<td>Kullan\u0131c\u0131 odakl\u0131, sezgisel, metin i\u00e7eri\u011fi de\u011fi\u015fmedik\u00e7e sa\u011flam.<\/td>\n<td>G\u00f6r\u00fcn\u00fcr metin i\u00e7eri\u011fi olan elementler (butonlar, span'ler, div'ler).<\/td>\n<td>Ayn\u0131 metne sahip birden fazla element varsa veya metin s\u0131k de\u011fi\u015fiyorsa.<\/td>\n<\/tr>\n<tr>\n<td><code>getByLabel<\/code><\/td>\n<td>Form elementleri i\u00e7in ideal, eri\u015filebilirlik dostu.<\/td>\n<td><code><label><\/code> etiketi ile ili\u015fkili input, textarea, select elementleri.<\/td>\n<td>Elementin ili\u015fkili bir <code><label><\/code> etiketi yoksa.<\/td>\n<\/tr>\n<tr>\n<td>CSS Se\u00e7iciler<\/td>\n<td>\u00c7ok y\u00f6nl\u00fc, h\u0131zl\u0131, yayg\u0131n olarak kullan\u0131l\u0131r, geli\u015ftirici ara\u00e7lar\u0131nda kolay hata ay\u0131klama.<\/td>\n<td>ID, class, nitelik veya element hiyerar\u015fisine g\u00f6re se\u00e7im yaparken.<\/td>\n<td>Metin i\u00e7eri\u011fine g\u00f6re se\u00e7im yap\u0131lmas\u0131 gerekti\u011finde veya geriye do\u011fru gezinme ihtiyac\u0131nda.<\/td>\n<\/tr>\n<tr>\n<td>XPath<\/td>\n<td>En esnek, metin i\u00e7eri\u011fine g\u00f6re se\u00e7im, geriye do\u011fru gezinme.<\/td>\n<td>CSS se\u00e7icilerin yetersiz kald\u0131\u011f\u0131 karma\u015f\u0131k senaryolar, metin i\u00e7eri\u011fine veya ebeveyn elementlere g\u00f6re se\u00e7im.<\/td>\n<td>Daha basit bir CSS se\u00e7ici veya anlamsal locator yeterliyse (karma\u015f\u0131kl\u0131\u011f\u0131 nedeniyle).<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<h4>Birden Fazla Locator Kullan\u0131m\u0131 ve Zincirleme<\/h4>\n<p>Playwright, birden fazla locator'\u0131 birle\u015ftirerek daha spesifik hedefler olu\u015fturman\u0131za olanak tan\u0131r. Buna \"locator zincirleme\" denir. Bu, \u00f6zellikle ayn\u0131 tipte birden fazla element oldu\u011funda veya belirli bir konteyner i\u00e7indeki elementleri hedeflemek istedi\u011finizde kullan\u0131\u015fl\u0131d\u0131r.<\/p>\n<pre><code class=\"language-typescript\">\n\/\/ Bir kart i\u00e7indeki butonu bulma\nawait page.locator('.product-card').filter({ hasText: '\u00dcr\u00fcn Ad\u0131 X' }).getByRole('button', { name: 'Sepete Ekle' }).click();\n\n\/\/ Belirli bir form i\u00e7indeki inputu bulma\nawait page.locator('form#loginForm').getByLabel('Kullan\u0131c\u0131 Ad\u0131').fill('testuser');\n<\/pre>\n<p><\/code><\/p>\n<p>Zincirleme, testlerinizin okunabilirli\u011fini art\u0131r\u0131r ve elementleri daha kesin bir \u015fekilde hedeflemenizi sa\u011flar.<\/p>\n<h4>Bak\u0131m Kolayl\u0131\u011f\u0131 ve Test Sa\u011flaml\u0131\u011f\u0131 \u0130\u00e7in \u0130pu\u00e7lar\u0131<\/h4>\n<ul>\n<li><strong>Anlamsal Se\u00e7icilere \u00d6ncelik Verin:<\/strong> Her zaman <code>getByRole<\/code>, <code>getByText<\/code>, <code>getByLabel<\/code> gibi anlamsal se\u00e7icileri tercih edin. Bunlar, uygulaman\u0131n UI de\u011fi\u015fikliklerinden en az etkilenen ve eri\u015filebilirlik standartlar\u0131n\u0131 destekleyen se\u00e7icilerdir.<\/li>\n<li><strong>Veri Test Nitelikleri Kullan\u0131n:<\/strong> Geli\u015ftiricilerinizden elementlere <code>data-test-id<\/code> veya <code>data-qa<\/code> gibi \u00f6zel nitelikler eklemelerini isteyin. Bu nitelikler, UI veya stil de\u011fi\u015fikliklerinden etkilenmez ve testleriniz i\u00e7in sa\u011flam bir temel olu\u015fturur. \u00d6rne\u011fin: <code>page.locator('[data-test-id=\"login-button\"]')<\/code>.<\/li>\n<li><strong>A\u015f\u0131r\u0131 Spesifik Olmaktan Ka\u00e7\u0131n\u0131n:<\/strong> Gereksiz yere uzun ve karma\u015f\u0131k CSS veya XPath se\u00e7iciler kullanmay\u0131n. Bu t\u00fcr se\u00e7iciler, DOM yap\u0131s\u0131ndaki k\u00fc\u00e7\u00fck de\u011fi\u015fikliklerde bile kolayca k\u0131r\u0131labilir.<\/li>\n<li><strong>G\u00f6rsel Do\u011frulama:<\/strong> Baz\u0131 durumlarda, bir elementin varl\u0131\u011f\u0131n\u0131 veya metnini do\u011frulamak yeterli olmayabilir. Playwright'\u0131n g\u00f6rsel kar\u015f\u0131la\u015ft\u0131rma \u00f6zelliklerini kullanarak UI'\u0131n do\u011fru g\u00f6r\u00fcnd\u00fc\u011f\u00fcnden emin olun.<\/li>\n<li><strong>Hata Ay\u0131klama Ara\u00e7lar\u0131n\u0131 Kullan\u0131n:<\/strong> Playwright'\u0131n yerle\u015fik test runner'\u0131 ve taray\u0131c\u0131 geli\u015ftirici ara\u00e7lar\u0131 (\u00f6rne\u011fin, \"Elements\" sekmesi ve \"Console\" sekmesindeki <code>$$()<\/code> ve <code>$x()<\/code> fonksiyonlar\u0131) locator'lar\u0131n\u0131z\u0131 test etmek ve hata ay\u0131klamak i\u00e7in \u00e7ok faydal\u0131d\u0131r.<\/li>\n<\/ul>\n<h3>Sonu\u00e7<\/h3>\n<p>Playwright, modern web uygulamalar\u0131n\u0131n test otomasyonu i\u00e7in g\u00fc\u00e7l\u00fc ve \u00e7ok y\u00f6nl\u00fc bir platform sunar. Bu makalede ele ald\u0131\u011f\u0131m\u0131z <code>getByRole<\/code>, <code>getByText<\/code>, <code>getByLabel<\/code>, CSS ve XPath gibi locator stratejileri, testlerinizi daha sa\u011flam, okunabilir ve bak\u0131m\u0131 kolay hale getirmeniz i\u00e7in size zengin bir ara\u00e7 seti sunar. Anlamsal se\u00e7icilere \u00f6ncelik vermek, veri test niteliklerini kullanmak ve do\u011fru locator'\u0131 do\u011fru senaryoda uygulamak, ba\u015far\u0131l\u0131 bir test otomasyon stratejisinin temel ta\u015flar\u0131d\u0131r. Playwright'\u0131n esnekli\u011fi sayesinde, her t\u00fcrl\u00fc web uygulamas\u0131n\u0131 g\u00fcvenle test edebilir ve geli\u015ftirme s\u00fcrecinizin kalitesini art\u0131rabilirsiniz.<\/p>\n<h3>SSS (S\u0131k Sorulan Sorular)<\/h3>\n<dl>\n<dt>getByRole ve getByText aras\u0131ndaki temel fark nedir?<\/dt>\n<dd><code>getByRole<\/code>, elementleri eri\u015filebilirlik rol\u00fcne (\u00f6rne\u011fin, buton, metin kutusu) ve eri\u015filebilir ad\u0131na g\u00f6re bulur. Bu, elementin anlamsal anlam\u0131na odaklan\u0131r ve UI de\u011fi\u015fikliklerine kar\u015f\u0131 daha diren\u00e7lidir. <code>getByText<\/code> ise elementin g\u00f6r\u00fcn\u00fcr metin i\u00e7eri\u011fine g\u00f6re se\u00e7im yapar. Kullan\u0131c\u0131lar\u0131n do\u011frudan g\u00f6rd\u00fc\u011f\u00fc metinleri hedeflemek i\u00e7in idealdir.<\/dd>\n<dt>XPath ne zaman CSS'e tercih edilmeli?<\/dt>\n<dd>XPath, CSS se\u00e7icilerin yapamad\u0131\u011f\u0131 belirli senaryolarda tercih edilir. Bunlar aras\u0131nda elementleri metin i\u00e7eri\u011fine g\u00f6re se\u00e7me (<code>text()<\/code> fonksiyonu), bir elementin ebeveynini bulma (geri gezinme) veya daha karma\u015f\u0131k karde\u015f ili\u015fkilerini hedefleme bulunur. Genellikle, daha basit bir CSS se\u00e7ici veya anlamsal locator yeterliyse CSS tercih edilmelidir.<\/dd>\n<dt>Performans a\u00e7\u0131s\u0131ndan hangi locator daha iyidir?<\/dt>\n<dd>Genel olarak, ID se\u00e7iciler (<code>#myId<\/code>) en h\u0131zl\u0131s\u0131d\u0131r. Ard\u0131ndan basit CSS se\u00e7iciler gelir. Anlamsal se\u00e7iciler (<code>getByRole<\/code>, <code>getByText<\/code>) ve XPath, taray\u0131c\u0131n\u0131n DOM \u00fczerinde daha fazla i\u015flem yapmas\u0131n\u0131 gerektirebilir, ancak modern taray\u0131<\/p>\n","protected":false},"excerpt":{"rendered":"Web otomasyonu ve u\u00e7tan uca test s\u00fcre\u00e7lerinde elementleri do\u011fru, stabil ve verimli bir \u015fekilde bulmak, testlerin ba\u015far\u0131s\u0131 i\u00e7in kritik \u00f6neme sahipti&#8230;","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"csco_page_header_type":"","csco_page_load_nextpost":"","csco_page_subscribe_form":"","csco_page_contact_form":"","footnotes":""},"categories":[126],"tags":[],"class_list":{"0":"post-38856","1":"post","2":"type-post","3":"status-publish","4":"format-standard","6":"category-css3-html5","7":"cs-entry","8":"cs-video-wrap"},"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v20.5 (Yoast SEO v25.3.1) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Playwright Locators Rehberi: getByRole, getByText, getByLabel, CSS ve XPath ile G\u00fc\u00e7l\u00fc Se\u00e7iciler - Kodlar\u0131n Gizemli D\u00fcnyas\u0131<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/fatihsoysal.com\/blog\/playwright-locators-rehberi-getbyrole-getbytext-getbylabel-css-ve-xpath-ile-guclu-seciciler\/\" \/>\n<meta property=\"og:locale\" content=\"tr_TR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Playwright Locators Rehberi: getByRole, getByText, getByLabel, CSS ve XPath ile G\u00fc\u00e7l\u00fc Se\u00e7iciler\" \/>\n<meta property=\"og:description\" content=\"Web otomasyonu ve u\u00e7tan uca test s\u00fcre\u00e7lerinde elementleri do\u011fru, stabil ve verimli bir \u015fekilde bulmak, testlerin ba\u015far\u0131s\u0131 i\u00e7in kritik \u00f6neme sahipti...\" \/>\n<meta property=\"og:url\" content=\"https:\/\/fatihsoysal.com\/blog\/playwright-locators-rehberi-getbyrole-getbytext-getbylabel-css-ve-xpath-ile-guclu-seciciler\/\" \/>\n<meta property=\"og:site_name\" content=\"Kodlar\u0131n Gizemli D\u00fcnyas\u0131\" \/>\n<meta property=\"article:published_time\" content=\"2026-02-09T09:01:17+00:00\" \/>\n<meta name=\"author\" content=\"Fatih Soysal\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Yazan:\" \/>\n\t<meta name=\"twitter:data1\" content=\"Fatih Soysal\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tahmini okuma s\u00fcresi\" \/>\n\t<meta name=\"twitter:data2\" content=\"16 dakika\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/playwright-locators-rehberi-getbyrole-getbytext-getbylabel-css-ve-xpath-ile-guclu-seciciler\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/playwright-locators-rehberi-getbyrole-getbytext-getbylabel-css-ve-xpath-ile-guclu-seciciler\/\"},\"author\":{\"name\":\"Fatih Soysal\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"headline\":\"Playwright Locators Rehberi: getByRole, getByText, getByLabel, CSS ve XPath ile G\u00fc\u00e7l\u00fc Se\u00e7iciler\",\"datePublished\":\"2026-02-09T09:01:17+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/playwright-locators-rehberi-getbyrole-getbytext-getbylabel-css-ve-xpath-ile-guclu-seciciler\/\"},\"wordCount\":2746,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"articleSection\":[\"CSS3 - HTML5\"],\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/fatihsoysal.com\/blog\/playwright-locators-rehberi-getbyrole-getbytext-getbylabel-css-ve-xpath-ile-guclu-seciciler\/#respond\"]}],\"copyrightYear\":\"2026\",\"copyrightHolder\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/playwright-locators-rehberi-getbyrole-getbytext-getbylabel-css-ve-xpath-ile-guclu-seciciler\/\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/playwright-locators-rehberi-getbyrole-getbytext-getbylabel-css-ve-xpath-ile-guclu-seciciler\/\",\"name\":\"Playwright Locators Rehberi: getByRole, getByText, getByLabel, CSS ve XPath ile G\u00fc\u00e7l\u00fc Se\u00e7iciler - Kodlar\u0131n Gizemli D\u00fcnyas\u0131\",\"isPartOf\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#website\"},\"datePublished\":\"2026-02-09T09:01:17+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/playwright-locators-rehberi-getbyrole-getbytext-getbylabel-css-ve-xpath-ile-guclu-seciciler\/#breadcrumb\"},\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/fatihsoysal.com\/blog\/playwright-locators-rehberi-getbyrole-getbytext-getbylabel-css-ve-xpath-ile-guclu-seciciler\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/playwright-locators-rehberi-getbyrole-getbytext-getbylabel-css-ve-xpath-ile-guclu-seciciler\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Anasayfa\",\"item\":\"https:\/\/fatihsoysal.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Playwright Locators Rehberi: getByRole, getByText, getByLabel, CSS ve XPath ile G\u00fc\u00e7l\u00fc Se\u00e7iciler\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#website\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/\",\"name\":\"Fatihsoysal.com\",\"description\":\"Blog - Yaz\u0131l\u0131m D\u00fcnyas\u0131 Tecr\u00fcbelerim\",\"publisher\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/fatihsoysal.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"tr\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\",\"name\":\"Fatih Soysal\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"tr\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png\",\"contentUrl\":\"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png\",\"width\":512,\"height\":512,\"caption\":\"Fatih Soysal\"},\"logo\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/\"},\"description\":\"Kullan\u0131m ve kodlama m\u00fckemmeliyetini odak alan uygulamalar olu\u015fturma deneyimine sahip, profesyonel olarak 15+ y\u0131l \u00fczeri deneyime sahip bir yaz\u0131l\u0131m m\u00fchendisi.\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/author\/fatihsoysal\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Playwright Locators Rehberi: getByRole, getByText, getByLabel, CSS ve XPath ile G\u00fc\u00e7l\u00fc Se\u00e7iciler - Kodlar\u0131n Gizemli D\u00fcnyas\u0131","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/fatihsoysal.com\/blog\/playwright-locators-rehberi-getbyrole-getbytext-getbylabel-css-ve-xpath-ile-guclu-seciciler\/","og_locale":"tr_TR","og_type":"article","og_title":"Playwright Locators Rehberi: getByRole, getByText, getByLabel, CSS ve XPath ile G\u00fc\u00e7l\u00fc Se\u00e7iciler","og_description":"Web otomasyonu ve u\u00e7tan uca test s\u00fcre\u00e7lerinde elementleri do\u011fru, stabil ve verimli bir \u015fekilde bulmak, testlerin ba\u015far\u0131s\u0131 i\u00e7in kritik \u00f6neme sahipti...","og_url":"https:\/\/fatihsoysal.com\/blog\/playwright-locators-rehberi-getbyrole-getbytext-getbylabel-css-ve-xpath-ile-guclu-seciciler\/","og_site_name":"Kodlar\u0131n Gizemli D\u00fcnyas\u0131","article_published_time":"2026-02-09T09:01:17+00:00","author":"Fatih Soysal","twitter_card":"summary_large_image","twitter_misc":{"Yazan:":"Fatih Soysal","Tahmini okuma s\u00fcresi":"16 dakika"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/fatihsoysal.com\/blog\/playwright-locators-rehberi-getbyrole-getbytext-getbylabel-css-ve-xpath-ile-guclu-seciciler\/#article","isPartOf":{"@id":"https:\/\/fatihsoysal.com\/blog\/playwright-locators-rehberi-getbyrole-getbytext-getbylabel-css-ve-xpath-ile-guclu-seciciler\/"},"author":{"name":"Fatih Soysal","@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"headline":"Playwright Locators Rehberi: getByRole, getByText, getByLabel, CSS ve XPath ile G\u00fc\u00e7l\u00fc Se\u00e7iciler","datePublished":"2026-02-09T09:01:17+00:00","mainEntityOfPage":{"@id":"https:\/\/fatihsoysal.com\/blog\/playwright-locators-rehberi-getbyrole-getbytext-getbylabel-css-ve-xpath-ile-guclu-seciciler\/"},"wordCount":2746,"commentCount":0,"publisher":{"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"articleSection":["CSS3 - HTML5"],"inLanguage":"tr","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/fatihsoysal.com\/blog\/playwright-locators-rehberi-getbyrole-getbytext-getbylabel-css-ve-xpath-ile-guclu-seciciler\/#respond"]}],"copyrightYear":"2026","copyrightHolder":{"@id":"https:\/\/fatihsoysal.com\/blog\/#organization"}},{"@type":"WebPage","@id":"https:\/\/fatihsoysal.com\/blog\/playwright-locators-rehberi-getbyrole-getbytext-getbylabel-css-ve-xpath-ile-guclu-seciciler\/","url":"https:\/\/fatihsoysal.com\/blog\/playwright-locators-rehberi-getbyrole-getbytext-getbylabel-css-ve-xpath-ile-guclu-seciciler\/","name":"Playwright Locators Rehberi: getByRole, getByText, getByLabel, CSS ve XPath ile G\u00fc\u00e7l\u00fc Se\u00e7iciler - Kodlar\u0131n Gizemli D\u00fcnyas\u0131","isPartOf":{"@id":"https:\/\/fatihsoysal.com\/blog\/#website"},"datePublished":"2026-02-09T09:01:17+00:00","breadcrumb":{"@id":"https:\/\/fatihsoysal.com\/blog\/playwright-locators-rehberi-getbyrole-getbytext-getbylabel-css-ve-xpath-ile-guclu-seciciler\/#breadcrumb"},"inLanguage":"tr","potentialAction":[{"@type":"ReadAction","target":["https:\/\/fatihsoysal.com\/blog\/playwright-locators-rehberi-getbyrole-getbytext-getbylabel-css-ve-xpath-ile-guclu-seciciler\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/fatihsoysal.com\/blog\/playwright-locators-rehberi-getbyrole-getbytext-getbylabel-css-ve-xpath-ile-guclu-seciciler\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Anasayfa","item":"https:\/\/fatihsoysal.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Playwright Locators Rehberi: getByRole, getByText, getByLabel, CSS ve XPath ile G\u00fc\u00e7l\u00fc Se\u00e7iciler"}]},{"@type":"WebSite","@id":"https:\/\/fatihsoysal.com\/blog\/#website","url":"https:\/\/fatihsoysal.com\/blog\/","name":"Fatihsoysal.com","description":"Blog - Yaz\u0131l\u0131m D\u00fcnyas\u0131 Tecr\u00fcbelerim","publisher":{"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/fatihsoysal.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"tr"},{"@type":["Person","Organization"],"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1","name":"Fatih Soysal","image":{"@type":"ImageObject","inLanguage":"tr","@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png","contentUrl":"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png","width":512,"height":512,"caption":"Fatih Soysal"},"logo":{"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/"},"description":"Kullan\u0131m ve kodlama m\u00fckemmeliyetini odak alan uygulamalar olu\u015fturma deneyimine sahip, profesyonel olarak 15+ y\u0131l \u00fczeri deneyime sahip bir yaz\u0131l\u0131m m\u00fchendisi.","url":"https:\/\/fatihsoysal.com\/blog\/author\/fatihsoysal\/"}]}},"yoast_meta":{"yoast_wpseo_title":"","yoast_wpseo_metadesc":"","yoast_wpseo_canonical":""},"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts\/38856","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/comments?post=38856"}],"version-history":[{"count":0,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts\/38856\/revisions"}],"wp:attachment":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/media?parent=38856"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/categories?post=38856"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/tags?post=38856"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}