SELENIUM Bài 5: Selenium Web Driver

 I. Giới thiệu về Selenium Web Driver

• Selenium Web Driver là tool chính của bộ tool selenium, giúp chúng ta chạy automation cho web app và hỗ trợ nhiều loại ngôn ngữ lập trình khác nhau, ở đây chúng ta chọn ngôn ngữ lập trình java vì nó rất phổ biến và có thể chạy trên bất kỳ hệ điều hành nào.
• Trước kia Selenium RC điều khiển browser bằng cách inject các cái java script vào trong browser vì vậy đã làm thay đổi môi trường test dẫn đến kết quả test thiếu chính xác, selenium web driver đã khắc phục được những nhược điểm này bằng cách sử dụng các API do chính cái browser cung cấp để điều khiển browser cái này sẽ không làm thay đổi môi trường của browser vì vậy kết quả sẽ tin cậy hơn.

Hình 1: Mô hình Selenium Web Driver

II. Cách cài đặt Selenium Web Driver

1. Các file cần download

Để download selenium web driver chúng ta nhấn vào ĐÂY

Ở đây chúng thấy có một số thứ đó:

a. Selenium Server 

Selenium Server dùng để chạy Selenium Grid chúng ta cứ download về sau này chúng ta dùng trong Selenium Grid, tại thời điểm mình viết bài viết này selenium lastest stable đang ở bản 3.141.159 và đang phát triển bản 4.0.0-beta-3. Chúng ta sẽ download bản lastest stable 3.141.159.

Hình 2: File Selenium Server download được

b. The Internet Explorer Driver Server

Để download cho đúng file IE Driver, chúng ta phải biết được IE của chúng ta là bản 32 bit, hay 64 bit, không phải máy chúng ta là window 64bit thì trình duyệt đó là 64bit đâu, chúng ta phải kiểm tra lại xem cài ở program file x86 hay program file để xác định được là IE 64bit hay 32 bit, nếu cài trong thư mục program file x86 thì đó là IE 32bit, còn nếu cài trong thư mục program file thì đó là IE 64bit thường thì cài bản 64bit hay bị lỗi nên mình thường cài bản 32bit.

Hình 3: Selenium Server và Driver cho IE

Hình 4: File IE Driver download được

c. Selenium Client & WebDriver Language Bindings

Đây là phần chính của Selenium Web Driver, nó support cho rất nhiều ngôn ngữ lập trình như Ruby, Java, Python, C# và Java Script, ở đây chúng ta sẽ download thư viện dành cho java và download bản stable là phần nút Download khoanh đỏ, không down bản Beta.

Hình 5: Selenium Client & WebDriver Language Bindings

Hình 6: File Selenium Client & WebDriver Language Bindings download được

d. Driver hỗ trợ bởi các Browser

Tiếp theo chúng ta kéo xuống phía dưới để download driver dành cho các loại brower. Ở đây chúng ta sẽ thực hành trên 3 loại browser chính đó là Chrome, FireFox và IE, Tuy nhiên IE chúng ta đã dowload ở trên rồi, vậy nên chúng ta sẽ download driver của 2 loại browser còn lại đó là  FireFox và Chrome.

Hình 7: Mục driver cho browser

Hình 8: Driver cho ba loại browser chính

• Driver của FireFox

Bước 1: Nhấn vào chữ documentation, trình duyệt sẽ chuyển sang trang hỗ trợ của FireFox

Bước 2: Quan sát các phiên bản của driver và phiên bản firefox được hỗ trợ, từ đó download bản phù hợp.

Hình 9: Các phiên bản firefox và driver hỗ trợ tương ứng

Bước 3: Nhấn vào chữ geckodriver releases kéo xuống phía dưới để download, phải để ý xem firefox của bạn là bản 32bit hay 64bit để download bản phù hợp, ở đây mình sẽ download geckodriver cho win64 bit

Hình 10: List danh sách các Geckodriver 

 

Hình 11: File GeckoDriver download được

• Driver của Chrome

Bước 1: Nhấn vào chữ documentation,  trình duyệt sẽ chuyển sang trang hỗ trợ của Chrome

Bước 2: Quan sát các phiên bản của driver và phiên bản firefox được hỗ trợ, từ đó download bản phù hợp. Tốt nhất là update lên bản Chrome mới nhất, phải để ý xem nó đang ở bản beta hay stable để download cho phù hợp

Bước 3: Nhấn vào chữ của phiên bản Latest stable release, ở thời điểm mình viết bài viết này nó đang là phiên bản ChromeDriver 90.0.4430.24.

Hình 12: Driver hỗ trợ của Chrome

Hình 13: File driver Chrome download được

2. Cài đặt các file đã tải về

Bước 1: Giải nén toàn bộ những file thư viện đã tải về, nhưng file nào sẵn là file có đuôi .jar rồi thì không cần giải nén nữa

Bước 2: Mở Elipse IDE để tạo project đầu tiên để test với Selenium Web Driver

Bước 3: Tạo một project mới, ở đây mình đặt tên là SeleniumFirstTest

Hình 14: Project test các thư viện của Selenium

Bước 4: Để sử dụng được các thư viện của Selenium, chúng ta phải import các thư viện của Selenium vào build patch của project bằng các nhấn chuột phải vào tên project, sau đó vào phần build patch, rồi vào config build path, chọn tab library, chon class patch, sau nó click vào external jar, chúng ta phải add tổng cộng 7 file thư viện sau:

Giải nén từ file selenium-java-3.141.59.zip ta sẽ có 2 file jar ở bên ngoài đó là: client-combined-3.141.59.jar và client-combined-3.141.59-sources.jar và và 5 file jar trong thư mục libs đó là byte-buddy-1.8.15.jar, commons-exec-1.3.jar, guava-25.0-jre.jar, okhttp-3.11.0.jar, okio-1.14.0.jar.

Hình 15: 2 file jar nhận được sau khi giải nén file selenium-java-3.141.5

Hình 16: 5 file jar còn lại trong thư mục libs sau khi giải nén file selenium-java-3.141.5

Hình 17: 7 file thư viện cần add vào class patch

Bước 5: Sau khi add xong 7 thư viện chúng ta nhấn Apply and Close.

Bước 6: Các file driver của browser thì chúng ta cũng giải nén ra bỏ vào một thư mục nào đó, để sau này khi code ta sẽ gọi nó dễ dàng hơn, tốt nhất là bỏ chung vào luôn thư mục selenium-java-3.141.59, file selenium-server-standalone-3.141.59.jar chưa dùng đến nhưng cũng bỏ chung vào đó luôn.

Hình 18: Thư mục thư viện và các driver của Selenium Web Driver

III. Ví dụ thực hành sử dụng web driver

Đề bài: Dùng selenium web driver để mở 1 trang web bất kỳ sử dụng 3 Driver đó là chromedriver, geckodriver và IEDriverServer

1. Ví dụ sử dụng Chrome Driver

Hình 19:  Dùng selenium web driver để mở 1 trang web bất kỳ sử dụng chromedriver 

Giải thích các dòng code: 

• Import thư viện của Selenium WebDriver: import org.openqa.selenium.WebDriver; 
• Import thư viện của ChromeDriver: import org.openqa.selenium.chrome.ChromeDriver; 

• Khai báo cho hệ thống biết Driver đang ở đâu bằng cách dùng hàm System.setProperty() và truyền vào 2 tham số dưới dạng String là Key của Chrome Driver: webdriver.chrome.driver và Value là đường dẫn đến file Chrome Driver: 
  System.setProperty("webdriver.chrome.driver", "D:\\Work\\Automation Test\\Tool\\Selenium\\selenium-java-3.141.59\\chromedriver.exe");

• Khởi tạo một Web Driver

- Mở 1 cửa sổ Chrome: WebDriver driver = new ChromeDriver();

- Mở to trình duyệt lên: driver.manage().window().maximize();

- Địa chỉ trang web muốn truy cập: driver.get("http://google.com/");

- Đóng tất cả các browser được mở bở driver này: driver.quit();

- Chỉ đóng browser hiện tại: driver.close();

Lưu ý: Bắt buộc phải đóng driver sau khi chạy xong bằng 2 phương thức đó là driver.close() hoac driver.quit(), nếu không driver vẫn chạy tiếp, khi check bằng task manager sẽ thấy gây nặng máy.

2. Ví dụ sử dụng Gecko Driver trên FireFox

Hình 20:  Dùng selenium web driver để mở 1 trang web bất kỳ sử dụng Gekco Driver 

Giải thích các dòng code:  Chúng ta làm tương tự trên Chrome tuy nhiên thay hai dòng đó là:

• Thay tên driver truyền vào và đường dẫn đến gecko driver thay vì chrome driver: System.setProperty("webdriver.gecko.driver","D:\\Work\\Automation Test\\Tool\\Selenium\\selenium-java-3.141.59\\geckodriver.exe");
• Khởi tạo new FirefoxDriver() thay vì ChromeDriver(): WebDriver driver = new FirefoxDriver();

3. Ví dụ sử dụng Gecko Driver trên FireFox

Hình 21:  Dùng selenium web driver để mở 1 trang web bất kỳ sử dụng IE Driver 

Giải thích các dòng code:  Chúng ta làm tương tự trên Chrome và FireFox tuy nhiên thay hai dòng đó là:

• Thay tên driver truyền vào và đường dẫn đến IE driver thay vì chrome driver: System.setProperty("webdriver.ie.driver","D:\\Work\\Automation Test\\Tool\\Selenium\\selenium-java-3.141.59\\IEDriverServer.exe");
• Khởi tạo new InternetExplorerDriver() thay vì ChromeDriver(): WebDriver driver = new InternetExplorerDriver();

Lưu ý: Để có thể chạy được driver trên IE thì chúng ta phải cài đặt những thông số cho IE như sau:

• Zoom level phải để là 100% 

Hình 22:  Cài đặt Zoom Level trên IE

• IE - Settings - Internet Options - Security, ở đây sẽ có 4 phần đó là Internet, Local Intranet, Trusted sites, Restricted sites, cả 4 phần này đều có mục Enable Protected Mode, chúng ta phải tích vào mục này cho cả 4 phần, hoặc phải bỏ tích mục này cho cả 4 phần, nói chung là phải bỏ cùng bỏ hoặc tích cùng tích. 

Hình 23:  Cài đặt Internet Option trên IE

IV. Các API của Selenium Web Driver

1. Browser Commands

• driver.get(URL): mở một trang web mới trong trình duyệt hiện tại.
• driver.getTitle(): lấy tiêu đề của trang hiện tại
• driver.getCurrentUrl(): lấy URL của trang hiện đang được tải trong trình duyệt
• driver.getPageSource(): lấy source của trang được tải cuối cùng
• driver.close(): đóng cửa sổ hiện tại của trình duyệt, nếu đó là cửa sổ cuối cùng, nó sẽ đóng trình duyệt.
• driver.quit(): thoát khỏi trình duyệt và tất cả các cửa sổ đã mở trong trình duyệt.
• driver.navigate().refresh(): refresh trình duyệt hiện tại

2. WebElement Commands

Selenium cung cấp cho chúng ta class WebElement để quản lý các element, để tìm các element ta sử dụng cú pháp: the findElement() and findElements(), đối với phương thức findElement() nó sẽ trả về một element tìm kiếm được, còn findElements() nó sẽ trả về tất cả các element tìm kiếm được dưới dạng một list của web element

a. Selenium còn cung cấp cho chúng ta một class by để truyền vào locator muốn tìm kiếm

• by ID
• by Name
• by Class Name
• by tag Name
• by CSS Selectors
• by XPath
• by Link Text
• by Partial Link Text

b. Các hành động trên Web Elements

• getAttribute(): Trả về giá trị của Attribute
• sendKeys(): Type text vào trong element
• click(): Click vào element
• clear(): Xóa nội dung có sẵn trong element
• getText(): Lấy text của element
• getTagName(): Trả về tên node name
• isDisplayed(): Kiểm tra xem element có hiển thị trên màn hình hay không, kết quả trả về True or false
• isEnabled(): Kiểm tra xem element có đang enable hay disable đi rồi
• isSelected(): Để kiểm tra xem cái checkbox hay value box có được chọn hay không.

b. Action Class

Thông thường  Web Element Class chỉ hỗ trợ một số action cơ bản như sendKey(), click()...

Tuy nhiên có 1 số action phức tạp thì nó lại không làm được ví dụ như double click, click chuột phải, chuột trái, kéo thả.... thì lúc này chúng ta phải sử dụng các action trong action class.  Dưới đây là một số action cơ bản: 

• build (): Tạo một hành động tổng hợp chứa tất cả các hành động cho đến hiện tại, sẵn sàng được thực hiện (và reset lại trạng thái của trình tạo nội bộ, vì vậy các câu lệnh gọi tiếp theo để build (): sẽ chứa các chuỗi mới). Nôm na là nó build của 1 chuỗi action thành 1 cái action
• click (): Nhấp chuột vào vị trí chuột hiện tại.
• click (WebElement onElement): Nhấp vào giữa phần tử đã cho
• clickAndHold (): Nhấp chuột (không nhả) tại vị trí chuột hiện tại.
• clickAndHold (WebElement onElement): Nhấp chuột (không nhả vào giữa phần tử đã cho.
• contextClick (): Thực hiện một cú nhấp theo ngữ cảnh tại vị trí chuột hiện tại.
• contextClick (WebElement onElement): Thực hiện một cú nhấp theo ngữ cảnh ở giữa phần tử đã cho.
• doubleClick (): Thực hiện nhấp đúp vào vị trí chuột hiện tại.
• doubleClick (WebElement onElement): Thực hiện nhấp đúp vào giữa phần tử đã cho.
• dragAndDrop (WebElement nguồn, WebElement đích): Một cách hữu hiệu để thực hiện nhấp và giữ tại vị trí của phần tử nguồn, di chuyển đến vị trí của phần tử đích, sau đó thả chuột.
• dragAndDropBy (WebElement nguồn, int xOffset, int yOffset): Một các hữu hiệu thực hiện nhấp và giữ tại vị trí của phần tử nguồn, di chuyển theo một khoảng lệch nhất định, sau đó thả chuột.
• keyDown (Keys theKey): Thực hiện thao tác nhấn phím bổ trợ.
• keyDown (WebElement element, Keys theKey): Thực hiện thao tác nhấn phím bổ trợ sau khi focus vào một phần tử.
• keyUp (Keys theKey): Thực hiện phát hành phím bổ trợ.
• keyUp (WebElement element, Keys theKey): Thực hiện phát hành phím bổ trợ sau khi focus vào một phần tử.
• moveByOffset (int xOffset, int yOffset): Di chuyển chuột khỏi vị trí hiện tại của nó (hoặc 0,0) theo độ lệch đã cho.
• moveToElement (WebElement toElement): Di chuyển chuột đến giữa phần tử.
• moveToElement (WebElement toElement, int xOffset, int yOffset): Di chuyển chuột đến một khoảng lệch từ góc trên bên trái của phần tử.
• Perform (): Thực hiện một action mà không nhất thiết phải dùng build để thực hiện 1 chuỗi action, dùng khi muốn thực hiện 1 action
• release (): Nhả nút chuột trái đã ấn xuống tại vị trí chuột hiện tại.
• release (WebElement onElement): Nhả nút chuột trái bị ấn xuống, ở giữa phần tử đã cho.
• sendKeys (java.lang.CharSequence ... keyToSend): Gửi các khóa đến phần tử hiện hoạt động.
• sendKeys (WebElement element, java.lang.CharSequence ... keyToSend): Tương đương với cách gọi: Actions.click () .sendKeys (keyToSend). Phương thức này khác với WebElement.sendKeys (CharSequence ...) - hãy xem sendKeys (CharSequence ...) để biết chi tiết như thế nào.

c. Ví dụ về Action Class

Đề bài: Vào trang https://demoqa.com/droppable thực hiện hành động kéo element Drag me vào element Drag here

Hình 24:  Cài đặt Internet Option trên IE

Giải thích các dòng code:

Những dòng khởi tạo browser thì mình sẽ không giải thích lại, các bạn có thể xem ở phần bên trên, mình chỉ giải thích các dòng code mới.

• Tạo ra một đối tượng action và truyền vào driver: Actions action = new Actions(driver);
• Sử dụng hàm dragAndDrop() truyền vào 2 tham số đó là locator của phần tử kéo và phần tử kéo đến, ở đây phần tử Drag me có id là draggable còn phần tử Drag here có id là droppable: action.dragAndDrop(driver.findElement(By.id("draggable")), driver.findElement(By.id("droppable")));
• Hàm  build() có tác dụng build toàn bộ các chuỗi action() thành 1 action, hàm perform() thực hiện action sau khi được build, ở đây nếu chỉ có một action thì chỉ cần dùng action().perfor() không cần dùng đến hàm build(): action.build().perform();

Lưu ý: Chỉ khi nào chúng ta gọi action.perform() thì action mới chạy, cho nên trong chuỗi các action của chúng ta không được dùng khi các element chưa tồn tại

Giới thiệu về HIENDV94

Mình là Hiển. Đây là blog ghi chép lại những thứ mình trải qua và học được hàng ngày, mình luôn luôn muốn học hỏi để trau dồi kinh nghiệm, hoàn thiện bản thân. Rất mong được làm quen mọi người. Hãy kết bạn với mình qua Facebook các bạn nhé.