[Selenium Java] Bài 4: Cài đặt môi trường Selenium với Java

✅ Cài đặt môi trường Maven trên Windows

🔆 Cách tải và cài biến môi trường Maven trên windows

Để tải Apache Maven trên máy tính chạy hệ điều hành windows, điều đầu tiên chúng ta cần làm là tải file maven zip từ trang chủ và giải nén ra. Sau đó chúng ta cần cài biến môi trường cho Maven để có thể sử dụng trên máy.

Điều kiện cần

Để cài đặt và sử dụng Maven, trước tiên chúng ta cần đảm bảo máy tính đã cài sẵn JDK và đã cấu hình biến môi trường JAVA_HOME.

🔆 Tải Apache Maven

Apache Maven được tải miễn phí, các bạn có thể vào trang chủ của Apache Maven để tải xuống file zip. Chọn cái Binary zip archive



Tại thời điểm này phiên bản 3.8.6 đang là phiên bản mới nhất của Maven. Sau khi tải xong, các bạn tiến hành giải nén và đặt nó trong thư mục bất kỳ, nhưng hãy đặt trong thư mục ít đụng tới vì nếu lở các bạn xoá thì Maven sẽ không hoạt động được nữa. Sau khi giải nén thư mục sẽ trông giống như thế này.



Bây giờ chúng ta move nó sang ổ đĩa C:\ cho an toàn vì cũng ít đụng đến. An suggest thôi nhé.

🔆 Cài đặt biến môi trường cho Maven

Bước cuối cùng để chúng ta có thể sử dụng Maven là cài biến môi trường cho nó bằng cách.

Vào thanh tìm kiếm của windows gõ View advanced system settings hoặc Variable nó sẽ ra như bên dưới:

Trong System Properties dialog, chọn vào Advanced và chọn Environment Variables…



Trong Environment variables dialog, vào phần System variables chọn New
Trong này chúng ta sẽ tạo biến môi trường MAVEN_HOME và trỏ đến thư mục mà chúng ta đã lưu trước đó. Y như JDK chúng ta từng làm.



Nó sẽ như thế này



Tiếp theo chúng ta sẽ trỏ cái biến MAVEN_HOME này vào biến Path của hệ thống



Sau khi nhấn Edit thì sẽ hiện form tiếp tục nhấn New



Chúng ta nhập giá trị như sau:  %MAVEN_HOME%\bin



Nghĩa là chúng ta chỉ định từ biến MAVEN_HOME trỏ đến thư mục bin của nó

Tiếp theo nhấn Ok Ok Ok là xong.

🔆 Kiểm tra phiên bản Maven đã cài đặt

Để kiểm tra quá trình cài đặt đã thành công hay chưa chúng ta cần mở CMD lên và chạy những lệnh sau:

mvn -version

Nó sẽ hiển thị Maven version chúng ta vừa cài và cùng phiên bản JDK đã cài trước đó. Vậy là xong !!

Nếu các bạn check nó chưa ra thì ghi lệnh này thử nó có ra đường dẫn đúng chưa:  echo %MAVEN_HOME%

Khi nó ra đường dẫn rồi mà chưa hiểu biến môi trường thì chúng ta cần restart máy lại 😁

✅ Tạo Maven project trên IntelliJ IDEA

Bước 1: Mở IntelliJ và chọn File > New > Project

Bước 2: Chọn tab New Project và nhập thông tin như mẫu




🔆 Các bạn chú ý:

• Số 4 chọn Maven
• Số 6, 7 nhập gì cũng được. Không biết nhập gì thì nhập theo mẫu. Những thông tin này sẽ nằm trong file pom.xml sau khi create project.

✅ Cài đặt thư viện Selenium vào Maven project trên IntelliJ IDEA

Để cài đặt thư viện Selenium vào Maven project thì các bạn sẽ cài nó vào file pom.xml

Thư viện sẽ được lấy tại đây:  https://mvnrepository.com/

Chúng ta cần cái gì thì search cái đó rồi copy bỏ vào file pom.xml và build lại maven project là xong.

🔆 Ví dụ cài Selenium









Khi dán vào pom.xml nhớ để trong cặp thẻ <dependencies> </dependencies>

Dán thư viện vào xong nhớ reload project lại bằng cách nhấn vào biểu tượng Reload hoặc right click > maven > reload project

🔆 Kiểm tra Selenium đã cài đặt vào maven project

Các bạn tạo 1 class bất kỳ ở package test (không tạo bên package main) và nhập từ khoá WebDriver. Nếu nó gợi ý hiển thị lên như hình là đã cài đặt được Selenium thành công.

✅ Chạy code auto với Selenium

Sau khi thêm thư viện Selenium vào file pom.xml các bạn nhớ nhấn build lại Maven nhé.

File pom.xml hiện tại như này:

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>

    <groupId>anhtester.com</groupId>
    <artifactId>SeleniumMaven</artifactId>
    <version>1.0-SNAPSHOT</version>

    <properties>
        <maven.compiler.source>17</maven.compiler.source>
        <maven.compiler.target>17</maven.compiler.target>
        <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
    </properties>

    <dependencies>

        <!-- https://mvnrepository.com/artifact/org.seleniumhq.selenium/selenium-java -->
        <dependency>
            <groupId>org.seleniumhq.selenium</groupId>
            <artifactId>selenium-java</artifactId>
            <version>4.16.1</version>
        </dependency>


    </dependencies>

</project>

Các bạn tạo 1 class ví dụ TestSelenium và dán đoạn code này vào:

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;

import java.time.Duration;

public class TestSelenium {

    public static void main(String[] args) {

        //Khởi tạo browser với Chrome
        WebDriver driver;
        driver = new ChromeDriver();
        driver.manage().window().maximize();
        driver.manage().timeouts().implicitlyWait(Duration.ofSeconds(10));

        //Mở trang anhtester.com
        driver.get("https://anhtester.com/");

        //Click nút Login
        driver.findElement(By.xpath("//a[@id='btn-login']")).click();

        //Tắt browser
        driver.quit();
    }

}

Yeah ok. Còn về code auto test thì các buổi hôm sau An chỉ cho mọi người từng bước nhé 😋

✅ Cài đặt thư viện Selenium Webdriver vào Eclipse

1. Cài đặt Chrome Browser

Đầu tiên, chúng ta cài đặt Chrome browser ở trang chủ
Có khi máy các bạn đã có sẵn ấy chứ. Một lưu ý cực kì quan trọng là sau bước này, các bạn phải tiến hành check version của Chrome để tải chromedriver cho đúng, nếu không sẽ phát sinh lỗi khi run script. Gõ vào chrome://settings/help để tiến hành kiểm tra Chrome version.

2. Download Chrome Driver

Tiếp theo là tải về Chrome Driver (chromedriver.exe), click vào đây

Hoặc https://googlechromelabs.github.io/chrome-for-testing/

Các bạn phải tải về đúng với version của Chrome mà mình đang dùng nhé

Sau khi tải về, các bạn giải nén ra, sẽ ra một  tập tin tên là chromedriver.exe (trên Window), còn trên máy MAC là chromedriver

Nhớ lưu ý đường dẫn của nó, ví dụ mình đang bỏ ở ổ đĩa C và trong thư mục tên là Webdriver thì đường dẫn là C:\Webdriver\chromedriver.exe

3. Tải về Selenium Webdriver

Trước hết, chúng ta hãy tải Selenium Webdriver về máy với link An đã chuẩn bị
🔆 Link tải về từ tài nguyên: Tài nguyên cài đặt
(Hiện tại chúng ta dùng bản 3.141.59 là bản v3 ổn nhất của Selenium WebDriver, tuy nhiên sau này nên dùng v4)

Đây là 1 file có đuôi là *.jar, hãy nhớ đường dẫn của nó để xíu dán cho đúng vào code

4. Cài đặt Eclipse và tạo project auto test mới

Eclipse thì các bạn tải ở đây:https://www.eclipse.org/downloads/

🔆 Từ bản mới 2022 về sau Eclipse yêu cầu dùng JDK 17 trở lên nên các bạn chú ý nhé.

Các bạn tải về rồi nhấn cài đặt như các app khác thôi nhé.

Sau đó chúng ta mở Eclipse lên, tạo một project mới 

Đặt tên cho Project đó, nhớ chọn JDK đúng với Version Java của mình 

Sau khi tạo Project Java xong, tới một bước quan trọng là bỏ library của Selenium Webdriver vào Project, để nó có thể chạy được các command của Webdriver

Ấn chuột phải vào Project, sau đó chọn Properties

Chọn Java Build Path => Libraries => click chọn Classpath  => Add External Jar => Chọn tới cái file Selenium có đuôi jar đã download bên trên



Nếu ra kết quả, xuất hiện một Referenced Library giống hình, là ta đã thành công
 


Hoàn tất quá trình Add thư viện Selenium vào Eclipse.

✅ Chạy code Auto

Nào bắt đầu thôi, trước tiên hãy tạo một class mới, bằng cách click chuột phải vào src, sau đó chọn New = > Class

Cấu trúc thư mục hiển thị trên phần Explorer của Eclipse (IDE) giống như trong Window vậy, đồng cấp tức là chung thư mục, ở đây src là cha, thì nếu ta tạo 1 Class tên là FirstDemo, SecondDemo thì 2 class này nằm trong thư mục src. Ở đây src được gọi là source folder. Cấu trúc và cách phân lớp nó mình sẽ nói sau, tạm thời ta cứ tạo một Class tên là FirstDemo nằm trong src để chạy thử trước nhé

Lúc tạo Class các bạn tạo luôn 1 package tên là test - như hình, package chính là thư mục chứa file Class FirstDemo của chúng ta

Sau khi tạo xong class, IDE sẽ auto generate cho chúng ta một đoạn script có dạng như sau

package test;

public class FirstDemo {

	public static void main(String[] args) {
		// TODO Auto-generated method stub

	}

}

Tiếp đến , Selenium WebDriver sẽ cần biết đâu là tệp thực thi mà bạn có, bởi vì, như đã nói ở bài trước, chúng ta cần chromedriver.exe để chạy Chrome browser, tương tự với geckodriver.exe cho Firefox browser.

Chúng ta thực hiện việc này bằng cách sử dụng lệnh: System.setProperty()

Đây là keyword cần phải nhớ "webdriver.chrome.driver"

Trong khi c:\\chromedriver.exe là đường dẫn chứa file chromedriver.exe mà chúng ta đã tải về ở bài trước 

Cú pháp sẽ là:

System.setProperty("webdriver.chrome.driver", "c:\\chromedriver.exe");

Sau đó lại khởi tạo biến instance cho driver là "driver"  (các bạn đặt tên tùy ý)

WebDriver driver = new ChromeDriver();

Lúc này hãy xem script của chúng ta, có vấn đề, IDE sẽ báo lỗi vì nó không hiểu WebDriver là gì, làm sao mà tạo được instance từ nó được. 

Để giải quyết vấn đề này, chúng ta có một số cách như sau:
1. Nhấn Ctrl + Shift + O để IDE import thư viện vào
2. Click chuột trái vào chỗ mình đánh dấu trên hình, chọn import WebDriver, sau đó vẫn còn lại lỗi tương tự thì ta lặp lại thao tác để import nốt ChromeDriver là xong. Cách này hơi lằng nhằng vì phải ấn chuột mấy lần, vẫn dùng Ctrl + Shift + O cho nhanh. Tuy nhiên nó vẫn có ưu điểm của nó, đến phần cài đặt TestNG mình sẽ giải thích

Sau khi import, đây là đoạn script:

package test;

import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;

public class FirstDemo {

	public static void main(String[] args) {
		// TODO Auto-generated method stub
		
	    System.setProperty("webdriver.chrome.driver", "c:\\chromedriver.exe");
	 
	    WebDriver driver = new ChromeDriver();


	}

}

Sau khi đã hoàn tất hết, chúng ta dùng phương thức get(); để đi đến site https://anhtester.com

driver.navigate().to("https://anhtester.com");

(Hoặc dùng lệnh khác tương tự, ở buổi sau mình sẽ hướng dẫn cụ thể hơn các lệnh cơ bản trong Selenium Webdriver)

Phương thức get(); nhận tham số là một chuỗi URL nhé. Mình sẽ hướng dẫn các bạn đọc Document của Selenium để biết cách dùng các phương thức (hàm) của nó. Để sau này có thể tự đọc các Framework khác.

Mở một trang web chỉ gói gọn trong 1 dòng đó thôi. Tại đây các bạn có thể nhấn Ctrl + F11 để run thử, nếu browser được mở lên và đi đến https://anhtester.com, có nghĩa là bạn đã làm đúng.

Mình sử dụng một loạt các phương thức khác, để thực thi kịch bản ghi ở trên:

        //1 - Maximize browser của mình
        driver.manage().window().maximize();

        //2 - Đi đến 1 url
        
        driver.navigate().to("https://anhtester.com");

        //3 - Lấy Title và in ra console
        
        System.out.println(driver.getTitle());

        // Thoát hẳn Browser

        driver.quit();

Như vậy chúng ta đã có một class hoàn chỉnh sau khi ghép đầy đủ các đoạn script trên với nhau, ấn Ctrl + F11 hoặc click vào nút Run trên IDE để chạy Selenium nào.



Quan sát và chờ kết quả, Browser sẽ thực thi các bước y hệt như những gì chúng ta nói trên, bên phải Console đã in ra Title của page Anh Tester, chúng ta đã thành công 😋

💥 Các bạn nên chuyển dần sang IntelliJ IDEA để dùng cho tiện và đẹp hơn nhé.

An build mấy cái website này hỗ trợ các bạn chạy auto test trên này: