Chrome Geliştiricileri aracında veya Firefox'un Firebug'ında bir XPath ifadesi nasıl doğrulanır?

179

XPath'ımı nasıl doğrulayabilirim?

Öğeleri incelemek ve XPath'imi oluşturmak için Chrome Geliştiricileri aracını kullanıyorum. Chrome eklentisi XPath Checker'ı kullanarak doğrularım, ancak bana her zaman sonuç vermez. XPath'ımı doğrulamanın daha iyi bir yolu nedir?

Ayrıca hatayı incelemek için Firebug ve ayrıca doğrulamak için FirePath kullanarak denedim. Ancak Firepath XPath'i de doğrular.

Son seçeneğim XPath'imi onaylamak için Selenium WebDriver'ı kullanmak olacaktır.

google-chrome  firefox  selenium  xpath  selenium-webdriver 
— user3448242
kaynak

Yanıtlar:

367

Krom

Bu, üç farklı yaklaşımla gerçekleştirilebilir ( daha fazla bilgi için buradaki blog makaleme bakın):

  • ElementsPanelde aşağıdaki gibi arama yapın
  • Yürütme $x()ve $$()de Consolepanelde, hem Lawrence'ın gösterilen cevap
  • Üçüncü taraf uzantıları (çoğu durumda gerçekten gerekli değildir, aşırı yüklenme olabilir)

ElementsPanelde XPath'i şu şekilde arayabilirsiniz :

  1. F12Chrome Geliştirici Aracı'nı açmak için basın
  2. "Öğeler" panelinde Ctrl+F
  3. Arama kutusuna XPath veya CSS Seçici yazın, öğeler bulunursa sarı renkle vurgulanır.

resim açıklamasını buraya girin

Firefox (sürüm 75'ten beri)

FF 75, xpath ifadelerini değerlendirmeden ham xpath sorgusu kullanmak mümkün olduğundan, daha fazla bilgi için belgelere bakın .

Firefox (önceki sürüm 75)

  1. Firefox Menüsündeki (veya menü çubuğunu görüntülüyorsanız veya Mac OS X üzerindeyseniz Araçlar menüsünden) Web Geliştirici alt menüsünden "Web Konsolu" nu seçin
    veya Ctrl+ Shift+ K( OS X'te Command+ Option+ K) klavye kısayoluna basın.

  2. Alttaki komut satırında aşağıdakileri kullanın:

    • $(): Eşleşen ilk öğeyi döndürür. Varsa, sayfadaki işleve eşdeğerdir document.querySelector()veya $sayfadaki işlevi çağırır .

    • $$(): Eşleşen bir DOM düğümü dizisi döndürür. Bu şunun gibidir document.querySelectorAll(), ancak a yerine bir dizi döndürür NodeList.

    • $x(): Bir XPath ifadesini değerlendirir ve eşleşen bir düğüm dizisi döndürür.

Firefox (önceki sürüm 49)

  1. Firebug'u yükle
  2. yükleme Firepath
  3. F12Firebug'ı açmak için basın
  4. Geçin FirePathpanelinden
  5. Açılır menüde XPathor CSS'yi seçin
  6. Bulmak için yazın

resim açıklamasını buraya girin

— Yi Zeng
kaynak
2
XPath ve tarayıcılarda sadece bir uyarı var, çünkü bu çok fazla karışıklığa neden oluyor: stackoverflow.com/questions/18241029/…
— Jens Erat
@JensErat: Gerçekten iyi bir nokta. Bu soruyu daha önce de belirtildiği gibi bu yorumu okuyan diğer kullanıcılar için, Selenium etkilenmez çünkü tarayıcıları yönlendirir ve geliştirici araçlarla aynı JavaScript değerlendirme teknolojisini kullanır.
— Yi Zeng
1
@ user1177636: Bu GIF'leri oluşturmak için hangi yazılımı kullandınız?
— Mart'ta JacekM
XQuery için yerel bir ayrıştırıcıya da ihtiyacınız varsa BaseX'i buldum: basex.org/products
— tuxErrante
4
Cevabın Firefox için güncellenmesi gerekiyor. Ne yazık ki Firebug eski ve Geliştirici Araçları ile birleştirildi. Şu anda xpath ifadesini Console'da test edebilirsiniz, örn.$("//div")
— derloopkat
53

Chrome'da DevTools'u CTRL+IWindows (veya CMD+IMac) ve Firefox ile birlikte açabilir F12, ardından Consolesekmeyi seçebilir ve yazarak XPath'i kontrol edebilirsiniz $x("your_xpath_here").
Bu, eşleşen bir dizi değer döndürür. Boşsa, sayfada eşleşme olmadığını bilirsiniz.

Firefox v66 (Nisan 2019):

Firefox v66 konsol xpath

Chrome v69 (Nisan 2019):

Chrome v69 konsol xpath

— Bosnjak
kaynak
1
Bu yöntem ideal değildir, ancak bu konsolda yazdığınız xpath ifadesi Selenium'daki bir JavascriptExecutor tarafından yürütülebilir. Bazen bunu belki de Firefox yerel etkinlikleri devre dışı bırakıldığında geçici bir çözüm olarak kullanabilirsiniz?
— djangofan
1
@djangofan, ne demek istiyorsun? Bu mantıkla, doğru olsa da, bu cevapların her ikisi de mantığınız için gereksizdir.
— Arran
1
@bosnjak bunu konsolda $x("//input[@name='q']")VM251:1 Uncaught TypeError: $x is not a function at <anonymous>:1:1
— denerken
@YasserKhalil hangi tarayıcıyı kullanıyorsunuz, hangi sürüm? Bunu hangi sitede yapıyorsun?
— bosnjak
16

Chrome veya Opera kullanarak

herhangi bir eklenti olmadan, tek bir XPath sözdizimi karakteri yazmadan

  1. gerekli öğeyi sağ tıklayın ve ardından "inceleyin"
  2. vurgulanan öğe etiketine sağ tıklayın, kopyala> Xpath'i Kopyala'yı seçin.

;)

resim açıklamasını buraya girin

— Müh. Samer T
kaynak
2
Chrome için bu, gördüğüm en iyi çözüm. Paylaşım için teşekkürler. Firefox'u kullanmak istemediğimde Chrome'da onaylamayı kolaylaştırır.
— Automation
Bunu büyük yarar için kullandım. Ancak en büyük sorun, bazen bağlam menüsünün devre dışı bırakılması veya üzerine yazılmasıdır. O zaman diğer yaklaşımlara güvenmek zorundasınız.
— ouflak
1
Bu soruya gerçekten cevap vermiyor. Mevcut bir xpath'i doğrulamıyor, bir tane oluşturuyor. Chrome'un ürettiği, çok daha iyi bir çözüm olduğunda genellikle çirkin ve çok kırılgandır.
— Major Major
6

İşte FirePath ile karşılaştırıldığında birçok gelişmiş özelliğe sahip ChroPath uzantısı - Lütfen aşağıdaki adımları izleyin:

  1. Devtools panelini açın.
  2. Web sayfasında herhangi bir yeri sağ tıklayın.
  3. İncele'yi tıklayın.
  4. Öğeler sekmesinin sağ tarafında ChroPath sekmesini tıklayın.

Burada XPath / CSS'yi alacaksınız ve onu düzenleyebilir ve değerlendirebilirsiniz.

Eklentiyi indir

— SanjayKumar I ChroPath Oluşturan
kaynak
1
ChroPath uzantısı hala 2020'de çalışıyor. Teşekkürler. Büyük yardım.
— Bubbles
1

Xpath'inizi kontrol etmenin başka bir seçeneği de selenyum IDE kullanmaktır .

  1. Firefox Selenium IDE'yi yükleyin
  2. Uygulamanızı FireFox'ta açın ve IDE'yi açın
  3. IDE'de yeni bir satıra xpath'inizi hedefe yapıştırın ve Bul'u tıklayın. İlgili öğe uygulamanızda vurgulanır

Selenyum IDE

— AJC
kaynak
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.