How to access and print data using Xpath through Selenium WebDriver - selenium

Question

I want to print some data using selenium, here is HTML:
<div class="details-row section box-margin-LRmd is-disabled">
<div class="inline-flex-group-v2">
<div class="item gutter-sm box-fixed col-encounter-type">
<label class="field-label">Encounter type</label>
<div data-element="encounter-details-encounter-type">
Office Visit
<!----> </div>
</div>
<div class="item gutter-sm box-fixed col-extra-padding">
<label class="field-label">Note type</label>
<div data-element="encounter-details-encounter-type">Case Review</div>
</div>
<div class="item gutter-sm box-fixed col-date">
<label class="field-label">Date</label>
<div data-element="encounter-details-date" class="clearfix">
05/01/2018
</div>
</div>
<div class="item gutter-sm box-fixed col-age visible-lg">
<label class="field-label">Age at encounter</label>
<div data-element="encounter-details-age">60 yrs</div>
</div>
<div class="item gutter-sm box-fixed col-extra-padding visible-xl">
<label class="field-label">Seen by</label>
<div data-element="encounter-details-seen-by">Kristina Abernathy</div>
</div>
<div class="item gutter-sm box-fixed col-extra-padding visible-xl">
<label class="field-label">Facility</label>
<div data-element="encounter-details-facility">FOCUS Pittsburgh Free Health Center</div>
</div>
<div class="item gutter-sm visible-xl">
<label class="field-label">Status</label>
<div>
<span data-element="encounter-details-signed-by">Electronically signed by Kristina Abernathy at 05/01/2018 07:21 pm</span>
</div>
</div>
<!----> </div>
<div class="inline-flex-group-v2 hidden-xl box-padding-Tmd-v2 lower">
<div class="item gutter-lg box-fixed col-age hidden-lg">
<label class="field-label">Age at encounter</label>
<div data-element="encounter-details-age">60 yrs</div>
</div>
<div class="item gutter-lg box-fixed col-seen-by">
<label class="field-label">Seen by</label>
<div data-element="encounter-details-seen-by">Kristina Abernathy</div>
</div>
<div class="item gutter-lg box-fixed">
<label class="field-label">Facility</label>
<div data-element="encounter-details-facility">Health Center</div>
</div>
<div class="item gutter-sm">
<label class="field-label">Status</label>
<div>
<span data-element="encounter-details-signed-by">Electronically signed by Kristina Abernathy at 05/01/2018 07:21 pm</span>
</div>
</div>
<!----> </div>
</div>
I want to print encounter type, note type, date, age and seen by. So I use code :
System.out.println("Encounter details");
System.out.println("ENCOUNTER TYPE: " + driver.findElement(By.xpath("//div[#data-element='encounter-details-encounter-type']")).getText());
System.out.println("NOTE TYPE: " + driver.findElement(By.xpath("//div[#data-element='encounter-details-encounter-type']")).getText());
System.out.println("DATE: " + driver.findElement(By.xpath("//div[#data-element='encounter-details-date']")).getText());
System.out.println("AGE OF ENCOUNTER: " + driver.findElement(By.xpath("//div[#data-element='encounter-details-age']")).getText());
System.out.println("SEEN BY: " + driver.findElement(By.xpath("//div[#data-element='encounter-details-seen-by']")).getText());
And I got:
Encounter details
ENCOUNTER TYPE: Office Visit
NOTE TYPE: Office Visit
DATE: 05/01/2018
AGE OF ENCOUNTER: 60 yrs
SEEN BY:
So encounter type and note type have same attribute "data-element='encounter-details-encounter-type'", that's why I got same result for "encounter details" and "encounter type", but what I want to get is
ENCOUNTER TYPE: Office Visit
NOTE TYPE: Case Review
DATE: 05/01/2018
AGE OF ENCOUNTER: 60 yrs
SEEN BY: Kristina Abernathy
So how should I get correct note type and why can't I get "SEEN BY" content? Thanks!

Answer 1

From your html I can see that the Encounter Type and Note Type field is using the same element for reference. That's why you are getting same result for the different headings. While you are selecting the locators for identifying an element it is better to use unique values for that element otherwise these kind of issues will occur. Please check with the below code for Note Type,
System.out.println("NOTE TYPE: " + driver.findElement(By.xpath("//div[label='Note type']//*[#data-element='encounter-details-encounter-type']")).getText());
I have checked the SEEN BY field, it is working fine.
But if you want to take the first SEEN BY record, then use the below code,
System.out.println("SEEN BY: " + driver.findElement(By.xpath("//div[contains(#class,'extra-padding visible-xl')]//*[#data-element='encounter-details-seen-by']")).getText());
For the second SEEN BY,
System.out.println("SEEN BY: " + driver.findElement(By.xpath("//div[contains(#class,'fixed col-seen-by')]//*[#data-element='encounter-details-seen-by']")).getText());

Answer 2

As per your requirement, you can use cssSelector for Note Type.
Code you can try out:
System.out.println("NOTE TYPE: " + driver.findElement(By.cssSelector("div[class$='col-extra-padding'] div")).getText());
If you still wanna go with Xpath, then you can try this code
Xpath :
//label[text()='Note type']/following-sibling::div
Code :
System.out.println("NOTE TYPE: " + driver.findElement(By.xpath("//label[text()='Note type']/following-sibling::div")).getText());
There are two Seen By:
For first one you can write cssSelector as :
div[class*='col-extra-padding']>div[data-element$='-seen-by']
Code
System.out.println("First Seen By: " + driver.findElement(By.cssSelector("div[class*='col-extra-padding']>div[data-element$='-seen-by']")).getText());
Xpath would be:
//div[contains(#class,'col-extra-padding')]/child::div[#data-element='encounter-details-seen-by']
Code:
System.out.println("First Seen By: " + driver.findElement(By.xpath("//div[contains(#class,'col-extra-padding')]/child::div[#data-element='encounter-details-seen-by']")).getText());
For Second Seen By you can write cssSelector as :
cssSelector :
div[class*='box-padding-Tmd'] div[class$='col-seen-by'] div
Code
System.out.println("Second Seen By: " + driver.findElement(By.cssSelector("div[class*='box-padding-Tmd'] div[class$='col-seen-by'] div")).getText());
Xpath :
//div[contains(#class,'box-padding-Tmd')]/child::div[contains(#class,'col-seen-by')]/child::div
Code
System.out.println("Second Seen By: " + driver.findElement(By.xpath("//div[contains(#class,'box-padding-Tmd')]/child::div[contains(#class,'col-seen-by')]/child::div ")).getText());

Answer 3

To retrieve the Encounter Details you can create two Lists one for the Headings and the other for the Values and print them as follows :
List<WebElement> items = driver.findElements(By.xpath("//div[#class='inline-flex-group-v2']//div[contains(#class,'item') and contains(#class,'gutter-sm') and contains(#class,'box-fixed')]/label"));
List<WebElement> value = driver.findElements(By.xpath("//div[#class='inline-flex-group-v2']//div[contains(#class,'item') and contains(#class,'gutter-sm') and contains(#class,'box-fixed')]//div[starts-with(#data-element,'encounter-details-')]"));
for(int i=0; i<items.size(); i++)
System.out.println(items.get(i).getText() + " value is : " + value.get(i).getText());

Answer 4

Add parent node in locator to narrow down the search scope of encounter type and note type.
The reason why you get empty on SEEN BY, I guess it's not visible on page or there are more than one elements be found by your locator and the first element has no text content. If it's not visible, you can use getAttribute("innerText") to get text content of element.
System.out.println("Encounter details");
System.out.println("ENCOUNTER TYPE: " + driver
.findElement(By.cssSelector("div.col-encounter-type div[data-element='encounter-details-encounter-type']"))
.getText());
System.out.println("NOTE TYPE: " + driver
.findElement(By.cssSelector("div.col-extra-padding div[data-element='encounter-details-encounter-type']"))
.getText());
System.out.println("DATE: " + driver
.findElement(By.cssSelector("div[data-element='encounter-details-date']"))
.getText());
System.out.println("AGE OF ENCOUNTER: " + driver
.findElement(By.cssSelector("div[data-element='encounter-details-age']"))
.getText());
System.out.println("SEEN BY: " + driver
.findElement(By.cssSelector("div[data-element='encounter-details-seen-by']"))
.getAttribute("innerText"));