element တွေကို CSS selector များဖြင့်ရှာဖွေခြင်းသည် XPath ထက်ပိုမိုမြန်ဆန်။ ပိုမိုဖတ်လို့လွယ်သောနည်းလမ်းတစ်ခုဖြစ်သည်။
ဤသင်ခန်းစာသည် CSS selectors ကို အသုံးပြု၍ Selenium တွင်ဝဘ် element များကိုမည်သို့ရှာဖွေရမည်ကိုဥပမာပေးသည်။
ကျွန်ုပ်တို့တွင်အောက်ပါ attribute တွေပါတဲ့ tag ရှိတယ်လို့မြင်ယောင်ကြည့်ပါ။ [id, class, name, value]
attribute က element တွေကိုရှာရန်ယေဘူယျနည်းလမ်းမှာ -
css = element_name[='']
ဥပမာ -
WebElement firstName = driver.findElement(By.cssSelector('input[name='first_name']'));
CSS တွင်ကျွန်ုပ်တို့သည် _ _ _ _ ကိုသုံးနိုင်သည် ရွေးရန်သင်္ကေတ #
element တစ်ခုရဲ့ attribute:
ဥပမာ -
id
တူညီတဲ့နိယာမကို Element များ | | + + အားဖြင့်နေရာချထားရန်အသုံးပြုနိုင်သည် ဂုဏ်ရည်။
driver.findElement(By.cssSelector('input#firstname')); //or driver.findElement(By.cssSelector('#firstname'));
ကိုအသုံးပြုသည် သင်္ကြန်။
class
မှတ်စု:အသုံးပြုသည့်အခါအပိုဂရုစိုက်ပါ ။ HTML element တွင် class attribute တူညီသော web element များများစွာရှိနိုင်သည်။တခါတရံမှန်ကန်သောဒြပ်စင်ကိုနေရာချထားရန်ရွေးချယ်ရေးစံများနှင့်ပိုမိုတိကျစွာဖော်ပြရန်လိုအပ်သည်။
.
Ajax ခေါ်ဆိုမှုပေါ် မူတည်၍ display ၏တန်ဖိုးသည်“ none” သို့မဟုတ်“ block” ဖြစ်နိုင်သည်။ ဒီအခြေအနေမှာ၊ element ကို class နဲ့ style နှစ်မျိုးလုံးကိုရှာဖို့လိုတယ်။
ဥပမာ -
driver.findElement(By.cssSelector('input.myForm')); //or driver.findElement(By.cssSelector('.myForm'));
WebDriver တွင်၊ attribute တွင်သင်ရွေးချယ်လိုသောတန်ဖိုးများပါ ၀ င်သော element များကိုသင်မည်သို့ရှာရမည်နည်း။ ဤ CSS selector ဥပမာသည်တိကျသော attribute တန်ဖိုးဖြင့်မည်သို့ရွေးချယ်ရမည်ကိုပြသည်
သင့်တွင်တူညီသော attribute နှင့် attribute တန်ဖိုးတူသော element များစွာရှိသည်ဆိုပါစို့၊ အချို့ element များတွင်မူတန်ဖိုးနှင့်တွဲဖက်ထားသောအခြား variable များရှိသည်။ ဥပမာ -
အထက်ပါအတိုအထွာတွင်ကျွန်ုပ်တို့သည်ရနိုင်သောနေ့ကိုရွေးလိုကြသည် (ဆိုလိုသည်မှာနောက်ဆုံးနှစ်ခုဖြစ်သော _ + _ | element)
တွေ့မြင်ရသည့်အတိုင်း divs လေးခုလုံးတွင်ပြက္ခဒိန်ရက် - ပါ ၀ င်သော်လည်းပထမနှစ်ခုတွင်“ မရရှိနိုင်” သောအရာများပါ ၀ င်သည်။
ပထမနှစ်ခု divs များကိုမရွေးခြင်းအတွက် CSS selector သည်
driver.findElement(By.cssSelector('div[class='ajax_enabled'] [style='display:block']'));
image tag တည်နေရာကိုရှာရန်၊
div
list element များကဲ့သို့တူညီသော parent element တစ်ခုတွင် child element မျိုးစုံရှိသည့်အခါများရှိသည်
driver.findElement(By.cssSelector('div[class*=calendar-day-]:not([class*='unavailable'])'));'
မြင်နိုင်သည်အတိုင်း, တစ် ဦး ချင်းစီစာရင်း element တွေကိုသူတို့နှင့်ဆက်စပ်မဆိုအိုင်ဒီရှိသည်မဟုတ်ကြဘူး။ စာသား 'လိမ္မော်ရောင်' ဖြင့်စာသားကိုရှာရန်ကျွန်ုပ်တို့သည် _ _ _ _ ကိုအသုံးပြုရမည်။
ဥပမာ -
ထိုနည်းတူစွာပင်နောက်ဆုံးကလေး element ကိုရွေးရန် Banana ကိုသုံးသည်။
driver.findElement(By.cssSelector('div#logo img'));
ကျွန်ုပ်တို့သည်ဒြပ်ထုဖြစ်ပေါ်သောအိုင်ဒီများနှင့်ဒြပ်စင်များကိုနေရာချထားရန် string matchers ကိုသုံးနိုင်သည်။
ဤဥပမာတွင် div element သုံးမျိုးလုံးသည် 'random' ဟူသောစကားလုံးပါ ၀ င်သည်။
- Apple
- Orange
- Banana
ပထမဆုံးရွေးချယ်ရန် nth-of-type
element ကိုငါတို့သုံးလိမ့်မယ် driver.findElement(By.cssSelector('ul#fruit li:nth-of-type(2)'));
ဆိုလိုသည်မှာ 'နှင့်စတင်သည်'
driver.findElement(By.cssSelector('ul#fruit li:last-child'));
ဒုတိယရွေးချယ်ရန်
element ကိုငါတို့သုံးလိမ့်မယ် div
ဆိုလိုသည်မှာ 'နှင့်အဆုံးသတ်သည်' ကိုဆိုလိုသည်
^=
နောက်ဆုံးရွေးရန် _ _ _ _ _ + _ | ကိုအသုံးပြုမည် ဆိုလိုတာက 'Sub-string'
driver.findElement(By.cssSelector('div[id^='123']'));
div
ကိုလည်းကျွန်ုပ်တို့သုံးနိုင်သည်
$=
နောက်ထပ်ဖတ်ရန်: