Konumlandırıcılar Selenium
Krishna Rungta
⚡ Akıllı Özet
Konumlandırıcılar Selenium Bu komutlar, otomasyon motoruna metin kutuları, düğmeler ve onay kutuları gibi GUI öğelerini tanımlaması için talimat verir. Bu referans, güvenilir web otomasyon komut dosyaları için pratik örnekler, sözdizimi kuralları ve seçim stratejileriyle birlikte ID, Name, Link Text, DOM ve XPath konum belirleyici türlerini açıklamaktadır.
Konum belirleyiciler (Locator'lar) nedir? Selenium?
Konum belirleyici, yönlendirme yapan bir komuttur. Selenium IDE veya Selenium WebDriver'ı, bir işlem gerçekleştirilmesi gereken metin kutusu, düğme, bağlantı veya onay kutusu gibi doğru GUI öğesine yönlendirin. Doğru GUI öğesini belirlemek, güvenilir bir otomasyon komut dosyası oluşturmanın ön koşuludur. Ancak, doğru belirleme göründüğünden daha zordur. Bazen, yanlış öğeyle veya hiçbir öğeyle etkileşime girebilirsiniz. Bunu ele almak için, Selenium Kullanıcı arayüzü öğelerinin hassas bir şekilde hedeflenmesini sağlayan çeşitli konum belirleme stratejileri sunar.
"Open" komutu gibi bazı komutlar konum belirleyici gerektirmezken, çoğu komut için konum belirleyiciye ihtiyaç duyulur. Selenium Komutlar, öğe konumlandırıcılarına bağlıdır. Konum belirleyici seçimi büyük ölçüde Test Edilecek Uygulamanıza (AUT) bağlıdır. Bu eğitimde Facebook ve diğer uygulamalar arasında geçiş yapacağız. Mercury Turlar demo sitesi (newtours.demoaut), her uygulamanın hangi konum belirleyicileri desteklediğine bağlıdır. Benzer şekilde, kendi sitenizde de durum böyledir. test yapmak Projenizde bir öğe konumlandırıcı seçeceksiniz. Selenium WebDriver, uygulamanızın yapısına göre belirlenir.
Kimliğe göre bulma
Bu, öğeleri bulmanın en yaygın yöntemidir çünkü kimlikler (ID'ler) bir sayfadaki her öğe için benzersiz olacak şekilde tasarlanmıştır. Bir kimlik (ID) özniteliği mevcut olduğunda, hızlı, istikrarlı ve okunabilir test komut dosyaları için ilk tercihiniz olmalıdır.
Target Biçim: id=öğenin kimliği
Bu örnekte, Facebook'un demo sayfasını kullanacağız çünkü Mercury Tours uygulaması ana form alanları için ID özniteliklerini kullanmaz.
) 1 Adım Bu demo sayfasını kullanın https://demo.guru99.com/test/facebook.html Test için. Tarayıcınızın yerleşik Geliştirici Araçlarını kullanarak "E-posta veya Telefon" metin kutusunu inceleyin (Chrome, Edge veya Windows'ta F12 tuşuna basın). Firefox) ve kimlik numarasını not edin. Bu durumda kimlik numarası "e-posta"dır.
) 2 Adım Başlatmak Selenium IDE'ye girin ve "id=email" girin Target kutu. Bul düğmesine tıklayın ve "E-posta veya Telefon" metin kutusunun yeşil bir kenarlıkla sarı renkte vurgulandığını fark edin; bu, şunu gösterir: Selenium IDE, öğeyi doğru şekilde buldu.
İsme Göre Konum Bulma
Öğeleri isme göre bulmak, kimliğe göre bulmaya benzer, tek farkı burada kullandığımız yöntemdir. “isim=” Bunun yerine önek kullanın. Bu yaklaşım, öğelerin kimlik (ID) özelliği bulunmadığında ancak tanımlanmış bir ad (name) özniteliğine sahip olduğunda kullanışlıdır.
Target Biçim: name=öğenin adı
Aşağıdaki gösterim için şunları kullanacağız: Mercury Turlar, çünkü sitedeki tüm önemli form öğeleri bir isim özniteliği taşır.
) 1 Adım Şu yöne rotayı ayarla https://demo.guru99.com/test/newtours/ Tarayıcınızın Geliştirici Araçlarını kullanarak "Kullanıcı Adı" metin kutusunu inceleyin. "name" özelliğini not edin.
Burada öğenin adı "userName"dir.
) 2 Adım In Selenium IDE'ye “ad=kullanıcıAdı” girin. Target kutusuna tıklayın ve Bul butonuna tıklayın. Selenium IDE, kullanıcı adı metin kutusunu vurgulayarak bulmalıdır.
Filtreleri Kullanarak Öğeyi Ada Göre Bulma
Birden fazla öğenin aynı ad özelliğini paylaştığı durumlarda filtreler kullanışlıdır. Filtreler, aynı adı paylaşan öğeleri birbirinden ayırt etmek için kullanılan ek özelliklerdir. Filtreler olmadan, Selenium Varsayılan olarak yalnızca ilk eşleşen öğeyi seçer.
Target Biçim: name=elementin_filtresinin_adı=filtrenin_değeri
Şimdi bir örnek üzerinden ilerleyelim.
) 1 Adım Oturum aç Mercury turlar.
Giriş yap Mercury Kullanıcı adı ve şifre olarak "tutorial" kullanan turlar. Aşağıda gösterildiği gibi Uçuş Bulucu sayfası görünmelidir.
) 2 Adım VALUE özniteliklerini incelemek için Geliştirici Araçlarını kullanın.
Gidiş-Dönüş ve Tek Yön radyo düğmelerinin aynı "tripType" adını paylaştığına dikkat edin. Ancak, farklı VALUE özniteliklerine sahipler, bu nedenle her değeri bir filtre olarak kullanabiliriz.
) 3 Adım Düzenleyicideki ilk satıra tıklayın.
- Öncelikle Tek Yönlü radyo düğmesine erişeceğiz. İlk satıra tıklayın. Selenium IDE editörü.
- Komut kutusuna "click" komutunu girin.
- içinde Target Kutucuğa “name=tripType value=oneway” yazın. “value=oneway” kısmı filtre görevi görür.
) 4 Adım Bul düğmesini tıklayın.
Dikkat edin Selenium IDE, tek yönlü radyo düğmesini yeşil renkle vurgulayarak, öğeye VALUE özniteliği aracılığıyla başarıyla erişildiğini onaylar.
) 5 Adım Tek Yönlü radyo düğmesini seçin.
Tıklama komutunu çalıştırmak için klavyenizdeki "X" tuşuna basın. Tek Yönlü radyo düğmesi artık seçili durumda.
Aynı işlemi Gidiş-Dönüş radyo düğmesinde de gerçekleştirebilirsiniz, bu sefer hedef olarak “name=tripType value=roundtrip” ifadesini kullanın.
Bağlantı Metnine Göre Konumlandırma
Bu konum belirleme stratejisi yalnızca köprü metinleri için geçerlidir. Hedefin başına "link=" önekini ve ardından görünür köprü metnini ekleyerek bağlantıya erişiyoruz. Bu yöntem oldukça okunabilir ve gezinme testleri için iyi sonuç verir.
Target Biçim: bağlantı=bağlantı_metni
Aşağıdaki örnekte, web sitesinde bulunan "KAYDOL" bağlantısına erişeceğiz. Mercury Turlar ana sayfası.
) 1 Adım
- Öncelikle oturumunuzun kapalı olduğundan emin olun. Mercury turlar.
- gidin Mercury Turlar ana sayfası.
) 2 Adım
- Geliştirici Araçlarını kullanarak “KAYDOL” bağlantısını inceleyin. Bağlantı metni, açılış ve kapanış bağlantı etiketleri arasında görünür.
- Bu durumda, bağlantı metni "KAYIT OL" şeklindedir. Bağlantı metnini kopyalayın.
) 3 Adım Bağlantı metnini kopyalayıp aşağıdaki alana yapıştırın. Selenium IDE Target kutu. Önüne “link=" ekleyin.
) 4 Adım Bul düğmesini tıklayın. Selenium IDE, KAYIT OL bağlantısını doğru şekilde vurgulayacaktır.
) 5 Adım Daha detaylı doğrulama yapmak için Komut kutusuna “clickAndWait” yazıp çalıştırın. Selenium IDE, KAYIT OL bağlantısına başarıyla tıklayacak ve sizi aşağıda gösterilen Kayıt sayfasına yönlendirecektir.
DOM'a (Belge Nesne Modeli) Göre Konumlandırma
MKS Belge Nesne Modeli (DOM)Basitçe ifade etmek gerekirse, HTML öğelerinin düğümlerden oluşan bir ağaç şeklinde nasıl yapılandırıldığını açıklar. Selenium IDE, sayfa öğelerine erişmek için bu ağaç yapısında gezinebilir. Bu yöntem kullanıldığında, Target Kutu her zaman “dom=document…” ile başlar. “dom=” öneki genellikle atlanır çünkü Selenium IDE, "document" ile başlayan herhangi bir değeri otomatik olarak bir DOM yolu olarak yorumlar.
DOM üzerinden bir öğeyi bulmanın dört temel yolu vardır. Selenium:
- getElementById
- getElementsByName
- dom:name (yalnızca adlandırılmış formdaki öğeler için geçerlidir)
- dom:dizin
DOM'a göre bulma – getElementById
Öncelikle DOM'un getElementById yöntemini inceleyelim. SeleniumBu yöntem, kimlik (ID) özniteliğiyle eşleşen tek bir öğe döndürür.
Sözdizimi
document.getElementById("id of the element")
- Öğenin kimliği (id) = erişilecek öğenin ID özniteliğinin değeri. Bu değer her zaman tırnak işaretleri içinde olmalıdır.
) 1 Adım Bu demo sayfasını kullanın https://demo.guru99.com/test/facebook.htmlOraya gidin ve Geliştirici Araçları'nı kullanarak "Oturumumu açık tut" onay kutusunu inceleyin. Kimliğini not edin.
Kullanmamız gereken kimlik numarası "persist_box" olmalıdır.
) 2 Adım Açılış Selenium IDE ve Target "persist_box" kutusuna document.getElementById("persist_box") yazın ve ardından Bul'a tıklayın. Selenium IDE, "Oturumumu açık tut" onay kutusunu bulacaktır. Onay kutusunun içini vurgulayamasa da, aşağıda gösterildiği gibi öğeyi parlak yeşil bir kenarlıkla çevreleyecektir.
DOM'a göre bulma – getElementsByName
`getElementById` metodu, aynı anda yalnızca bir öğeye, yani belirtilen kimliğe sahip öğeye erişir. `getElementsByName` metodu ise farklı davranır. Belirtilen adı paylaşan öğelerin bir dizisini döndürür. Tek tek öğelere, 0'dan başlayan sayısal bir indeks kullanılarak erişilir.
 |
getElementById Bu yöntem yalnızca tek bir öğe döndürür. Bu öğe, getElementById() yönteminin parantez içindeki belirtilen kimliğini taşır. |
 |
getElementsByName Bu fonksiyon, adları özdeş olan öğelerden oluşan bir koleksiyon döndürür. Her öğe, bir dizi gibi 0'dan başlayarak bir sayı ile indekslenir. Belirli bir öğeyi seçmek için, aşağıdaki söz diziminde köşeli parantezlerin içine dizinini yerleştirirsiniz. |
Sözdizimi
document.getElementsByName("name")[index]
- name = öğenin 'name' özelliği tarafından tanımlanan adı
- index = getElementsByName dizisindeki hangi öğenin kullanılacağını belirten bir tamsayı.
) 1 Adım gidin Mercury Turlar ana sayfasına gidin ve kullanıcı adı ve şifre olarak “tutorial” kullanarak giriş yapın. Tarayıcı Uçuş Bulucu ekranını yükleyecektir.
) 2 Adım Sayfanın altındaki üç radyo düğmesini (Ekonomi sınıfı, İşletme sınıfı ve Birinci sınıf) incelemek için Geliştirici Araçlarını kullanın. Hepsinin aynı adı, "servClass"ı paylaştığını fark edeceksiniz.
) 3 Adım Öncelikle, "Ekonomi sınıfı" radyo düğmesine erişelim. Üç radyo düğmesinden bu öğe ilk sırada yer aldığından, indeksi 0'dır. Selenium IDE'de document.getElementsByName(“servClass”)[0] yazın ve Bul düğmesine tıklayın. Selenium IDE, Ekonomi sınıfı radyo düğmesini doğru şekilde tanımlayacaktır.
) 4 Adım İndeks numarasını 1 olarak değiştirin, böylece sizin Target document.getElementsByName(“servClass”)[1] haline gelir. Bul düğmesine tıklayın ve Selenium IDE, aşağıda gösterildiği gibi "İş sınıfı" radyo düğmesini vurgulayacaktır.
DOM'a göre konumlandırma – dom:name
Daha önce de belirtildiği gibi, bu yöntem yalnızca erişmeye çalıştığınız öğe adlandırılmış bir formun içinde yer alıyorsa geçerlidir. Bulucu yolu formdan başlar, ardından adıyla hedef öğeye doğru ilerler.
Sözdizimi
document.forms["name of the form"].elements["name of the element"]
- Formun adı = erişmek istediğiniz öğeyi içeren form etiketinin name özniteliğinin değeri
- elementin adı = erişmek istediğiniz elementin name özelliğinin değeri
) 1 Adım Şu yöne rotayı ayarla Mercury Turlar ana sayfası https://demo.guru99.com/test/newtours/ Geliştirici Araçlarını kullanarak Kullanıcı Adı metin kutusunu inceleyin. Bunun "home" adlı bir formun içinde yer aldığını fark edeceksiniz.
) 2 Adım In Selenium IDE'de document.forms[“home”].elements[“userName”] yazın ve Bul düğmesine tıklayın. Selenium IDE, öğeye başarıyla erişecektir.
DOM'a göre konumlandırma – dom:index
Bu yöntem, öğe adlandırılmış bir formun içinde olmasa bile geçerlidir çünkü adını değil, formun indeksini kullanır. Bu, adlandırmanın mümkün olmadığı eski sayfalar veya otomatik olarak oluşturulan formlar için kullanışlıdır.
Sözdizimi
document.forms[index of the form].elements[index of the element]
- Formun indeksi = formun tüm sayfaya göre indeks numarası (0'dan başlayarak)
- Elemanın indeksi = Elemanın, onu içeren formdaki indeks numarası (0'dan başlayarak).
Telefon metnine erişeceğiz. Mercury Tur Kayıt sayfası. Bu sayfadaki formun ne adı ne de kimlik (ID) özelliği bulunmadığından iyi bir örnek teşkil ediyor.
) 1 Adım gidin Mercury Tur Kayıt sayfasına gidin ve Telefon metin kutusunu inceleyin. Çevreleyen formun ne kimlik ne de isim özniteliklerine sahip olmadığını fark edin.
) 2 Adım document.forms[0].elements[3]'ü girin Selenium IDE Target kutusuna tıklayın ve Bul butonuna tıklayın. Selenium IDE, Telefon metin kutusuna doğru şekilde erişecektir.
) 3 Adım Alternatif olarak, aynı sonucu elde etmek için öğenin dizini yerine adını kullanabilirsiniz. Örneğin, document.forms[0].elements[“phone”] ifadesini girin. Target Telefon metin kutusu yine de vurgulanmış olarak kalacaktır.
XPath ile konum belirleme
XPath, XML (Genişletilebilir İşaretleme Dili) düğümlerinde gezinmek için kullanılan sorgu dilidir. HTML, XML'in bir uygulaması olarak kabul edilebileceğinden, XPath Ayrıca HTML öğelerini de bulabilir. En güçlü konum belirleme stratejilerinden biridir. Selenium.
- avantajı: Sınıf, isim veya kimlik öznitelikleri olmayanlar da dahil olmak üzere neredeyse her öğeye erişebilir.
- Dezavantajı: Çok sayıda kuralı ve sözdizimi varyasyonu nedeniyle en karmaşık konum belirleme stratejisidir.
Modern tarayıcıların Geliştirici Araçları, XPath ifadelerini otomatik olarak oluşturabilir. Chrome, Edge veya FirefoxÖğeler panelinde bir öğeye sağ tıklayın ve Kopyala > XPath Kopyala'yı seçin. Aşağıdaki örnekte, daha önce ele alınan yöntemlerle bulunamayan bir resme erişeceğiz.
) 1 Adım gidin Mercury Turlar ana sayfasına gidin ve aşağıdaki resimde gösterildiği gibi, sarı "Bağlantılar" kutusunun sağındaki turuncu dikdörtgeni incelemek için Geliştirici Araçları'nı kullanın.
) 2 Adım Öğenin HTML koduna sağ tıklayın ve ardından "XPath'i Kopyala" seçeneğini seçin.
) 3 Adım In Selenium IDETek bir eğik çizgi "/" yazın. Target Ardından kutuyu açın ve önceki adımda kopyaladığınız XPath'i yapıştırın. İçindeki giriş Target kutu artık iki eğik çizgi “//” ile başlamalı.
) 4 Adım Bul düğmesini tıklayın. Selenium IDE, aşağıda gösterildiği gibi turuncu kutuyu vurgulayacaktır.
Doğru konum belirleyiciyi seçmenin önemi
Doğru konum belirleme stratejisini seçmek, en etkili kararlardan biridir. Selenium Otomasyon, komut dosyası kararlılığını, yürütme hızını ve uzun vadeli bakım maliyetini doğrudan etkilediği için önemlidir. Yanlış seçilmiş bir konum belirleyici, kararsız testlere, yanlış hatalara ve uygulamanın kullanıcı arayüzü her değiştiğinde sık sık yeniden çalışmaya neden olabilir. Deneyimli otomasyon mühendisleri tarafından önerilen tercih sırası önce Kimlik (ID), sonra Ad, ardından CSS Seçici, Bağlantı Metni ve son olarak XPath'tir.
Kimlik tabanlı konum belirleyiciler en hızlı olanlardır çünkü tarayıcının arama işlemi benzersiz tanımlayıcılar için optimize edilmiştir. İsim tabanlı konum belirleyiciler, isimler benzersiz olduğunda neredeyse aynı derecede verimlidir. CSS Seçiciler ve XPath esneklik sağlar ancak geliştiriciler DOM'u yeniden düzenlediğinde daha yavaş ve daha kırılgan olma eğilimindedir. Bağlantı Metni, gezinme bağlantıları için mükemmeldir ancak sınırlı yeniden kullanım sunar.
İstikrarlı otomasyon, geliştiricilerle iş birliğine de bağlıdır. Test uzmanları kod incelemeleri sırasında tutarlı ve anlamlı kimlik veya veri-* öznitelikleri talep ettiğinde, konum belirleyicinin dayanıklılığı önemli ölçüde artar. Otomatik olarak oluşturulan kimliklere (örneğin çerçeveler tarafından üretilenler gibi) güvenmekten kaçının, çünkü bunlar derlemeler arasında değişebilir. Okunabilir, amaca yönelik konum belirleyicilere öncelik vererek, ekipler test paketlerinin sürdürülebilirliğini sağlayabilir ve uygulama geliştikçe teknik borcu azaltabilir.
Güvenilir Konum Belirleyiciler Yazmak İçin En İyi Uygulamalar
Güvenilir konum belirleyiciler, sürdürülebilir bir sistemin temelidir. Selenium Test paketi. Aşağıdaki uygulamalar, komut dosyası hatalarını azaltmaya, okunabilirliği artırmaya ve testleri kullanıcı arayüzü değişikliklerine karşı dayanıklı hale getirmeye yardımcı olur.
- Benzersiz kimlikleri tercih edin: Öncelikle her zaman bir ID özniteliği olup olmadığını kontrol edin. ID'ler bir sayfa içinde benzersiz olmak üzere tasarlanmıştır ve en yüksek performansı sağlayan seçenektir.
- Anlamsal Ad ve veri-* özniteliklerini kullanın: Geliştiricileri, data-testid veya data-qa gibi istikrarlı test öznitelikleri eklemeye teşvik edin. Bu öznitelikler, CSS sınıfları değişse bile tutarlı kalır.
- Mutlak XPath kullanımından kaçının: /html/body/div[2]/div[3]/span gibi mutlak yollar kolayca bozulur. //input[@name='userName'] gibi özniteliklere sahip göreceli XPath ifadeleri kullanın.
- Hassasiyet için nitelikleri birleştirin: Tek bir özellik benzersiz değilse, doğru öğeyi hedeflemek için birden fazla özelliği birleştirin (örneğin, //button[@type='submit' ve @name='login']).
- Metni akıllıca kullanın: Görünür metne bağlı konum belirleyiciler, dil yerelleştirmelerinde sorun çıkarabilir. Metin tabanlı konum belirleyicileri yalnızca içerik istikrarlı ve tek dilli olduğunda kullanın.
- Konum belirleyicileri merkezileştirin: Konum belirleyicileri bir Sayfa Nesne Modeli (POM) sınıfında saklayın, böylece güncellemeler birçok test betiğine dağılmak yerine tek bir yerden yapılabilir.
- Geliştirici Araçlarında Doğrulayın: Bir komut dosyasına konum belirleyici eklemeden önce, tam olarak bir öğe döndürdüğünü doğrulamak için XPath için $x(“//xpath”) veya CSS için document.querySelector kullanarak tarayıcı konsolunda test edin.
- Mümkün olduğunca indeks tabanlı konum belirleyicilerden kaçının: [3] gibi dizin konumları, öğe sırasına bağlıdır. Küçük düzen değişiklikleri bile dizini kaydırabilir ve betiği bozabilir.
Otomasyon mühendisleri, bu uygulamaları tutarlı bir şekilde kullanarak, ekipler arasında ölçeklenebilen ve minimum bakım gereksinimiyle sık kullanıcı arayüzü güncellemelerine dayanabilen test paketleri oluştururlar.
