ในบทความนี้ เราจะเรียนรู้วิธีใช้ XPath ค้นหา Element ที่มีข้อความประกอบด้วย (Non-breaking Space) หรือช่องว่างนำหน้า/ท้ายหน้า
ปัญหา
เมื่อ Element มีช่องว่างนำหน้าหรือท้ายหน้าใน HTML เช่น <strong> JAVA BASICS </strong> การใช้ XPath ธรรมดา //strong[text()='JAVA BASICS'] จะไม่เจอ Element เพราะ text() คืนค่ารวมช่องว่าง
วิธีแก้: ใช้ normalize-space()
ฟังก์ชัน normalize-space() จะ:
- ลบช่องว่างนำหน้าและท้ายหน้า (trim)
- แทนที่ช่องว่างซ้ำซ้อน (tab, newline, multiple spaces) ด้วยช่องว่างเดี่ยว
Syntax
//tagname[normalize-space(@attribute/function) = 'value']ตัวอย่าง
HTML: <strong> JAVA BASICS </strong> (มีช่องว่างนำหน้า/ท้าย)
XPath ไม่ทำงาน:
//strong[text()='JAVA BASICS']ผล: ไม่เจอ Element (length = 0)
XPath ทำงาน:
//strong[normalize-space(text())='JAVA BASICS']ผล: เจอ Element (length = 1) และ Highlight ข้อความบนหน้าเว็บ
การใช้งานใน Selenium WebDriver (Java)
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
public class XPathNormalizeSpace {
public static void main(String[] args) {
WebDriver driver = new ChromeDriver();
driver.get("https://example.com");
// ใช้ normalize-space ใน XPath
WebElement element = driver.findElement(
By.xpath("//strong[normalize-space(text())='JAVA BASICS']")
);
System.out.println("Found: " + element.getText());
driver.quit();
}
}กรณีอื่นๆ ที่ normalize-space ช่วยได้
- Attribute value ที่มีช่องว่าง:
//input[normalize-space(@value)='Submit'] - ข้อความมี newline/tab:
//div[normalize-space(.)='Hello World'] - รวมหลายเงื่อนไข:
//div[normalize-space(text())='Login' and @class='btn']
Best Practice: ใช้ normalize-space() เป็นปกติเมื่อค้นหาข้อความ เพราะ HTML มักมี whitespace ที่มองไม่เห็น
