Sunday 6 August 2017

Viết chương trình tự động đăng nhập facebook bằng Selenium


Hi mọi người, chắc tiêu đề đã nói lên tất cả những điều mình định viết trong bài này :).

Trước khi đi vào việc viết code bằng selenium, chúng ta sẽ dành một vài phần để phân tích về giao diện, các thành phần và cách xác định các thuộc tính của từng thành phần.

1. Phân tích giao diện đăng nhập facebook

Trong trang đăng nhập của facebook, dễ dàng nhận ra là sẽ có 3 thành phần quan trọng:
- 2 textbox dành cho tên người dùng và mật khẩu
- 1 button đăng nhập
Ảnh đăng nhập facebook

2. Sử dụng tính năng Inspect element để xác định các thuộc tính của các textbox

Để có thể điền thông tin tên người dùng(user name) và mật khẩu(password) vào các textbox, chúng ta phải tìm được cách định vị được các textbox đó trong trang web. Bởi vì trong một trang web có thể có rất nhiều các phần tử khác nhau, vậy làm cách nào để ta tìm được chính xác textbox cho tên và mật khẩu trong vô vàn phần tử của trang web? Câu trả lời thật đơn giản, đó làm tìm ra một thuộc tính đặc trưng của textbox tên người sử dụng và mật khẩu. Để làm được điều đó chúng ta sử dụng tính năng "Inspect element" của các trình duyệt, ở đây mình sẽ sử dụng trình duyệt Chrome. Các bước thực hiện:
Bước 1: Đăng nhập vào facebook
Bước 2: Trong trang web facebook, click phải chuột, sẽ hiển thị ra một menu, click chọn "Inspect element" hoặc tổ hợp phím tắt Ctr + Shift + J.
Menu inspect element

Bước 3: Sau khi làm xong bước 2, bạn sẽ thấy một cửa sổ nhỏ bật lên(mình đánh dấu cửa số đó là * nhé, để tiện ), Click vào icon  và sau đó di chuyển đến textbox tên người dùng và textbox mật khẩu.  Sau khi nhấn vào textbox, cửa sổ (*) sẽ hiện thị đoạn code html tương ứng cho textbox
- Textbox tên người sử dụng:


- Textbox mật khẩu:
<input class="inputtext" data-testid="royal_pass" id="pass" name="pass" tabindex="2" type="password" />


Dựa vào đoạn code html của các textbox trên, ta có thể thấy là chúng ta có thể dựa vào thuộc tính id="email" để tìm textbox tên người sử dụng, còn id="password" để tìm textbox mật khẩu.

3.Viết chương trình tự động đăng nhập facebook

3.1 Giới thiệu về selenium

Giờ mới là lúc câu chuyện thực sự bắt đầu :D Giới thiệu vắt tắt một chút về selenium để cho những ai chưa biết dễ dàng lĩnh hội :D
Trang chủ: http://www.seleniumhq.org 
Selenium là một framework dùng để tự động hóa các công việc trên trang web, nghĩa là nếu bình thường chúng ta phải dùng tay click button, nhập thông tin cũng bằng tay :D thì băng việc sử dụng framework này đúng cách(nhớ là đúng cách nhé) chúng ta sẽ viết được những chương trình mà tự động làm việc đó cho chúng ta :).
Selenium thường được sử dụng nhiều trong việc test các phần mềm :)

3.2 Chương trình

Bạn tạo ra một project java, sau đó add thư viện selenium vào, và viết đoạn code như sau:
package test;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.firefox.FirefoxDriver;

public class AutoFacebookLogin {
 public static void main(String[] args) {
  WebDriver webDriver = new FirefoxDriver();
  webDriver.get("http://www.facebook.com");
  
  WebElement emailTxt = webDriver.findElement(By.id("email"));
  WebElement passTxt = webDriver.findElement(By.id("pass"));
  
  if(emailTxt!= null && passTxt != null){
   emailTxt.sendKeys("email");
   passTxt.sendKeys("password");
   
   emailTxt.submit();
  }
 }
}
Giải thích:
- Dòng 10: Tạo ra WebDriver. Có rất nhiều loại web driver như ChromeDriver, InternetExplorerDriver, FirefoxDriver,... Trong ví dụ chúng ta sử dụng FirefoxDrive. Đối với các Driver khác, đôi khi chúng ta phải tải thêm một file thực thi dành riêng cho từng loại driver, rồi sau đó gán đường dẫn của file thực thi(Chrome: https://sites.google.com/a/chromium.org/chromedriver/downloads)  đó cho các biến "webdriver.chrome.driver" (Trường hợp Chrome) hoặc "webdriver.ie.driver"(Trường hợp IE). Ví dụ trong trường hợp tạo ChromeDriver:
- Dòng 11: Mở trang facebook
- Dòng 13,14: Tìm kiếm textbox email password bằng id tương ứng của chúng
- Dòng 16: Kiểm tra xem quá trình tìm kiếm các textbox có thành công hay không trước khi làm tiếp những bước tiếp theo
- Dòng 17,18: Nhập email password vào các textbox tương ứng.
- Dòng 20: Tiến hành submit form, tương ứng với việc ta nhấn vào nút Đăng nhập

Source code:
Đang cập nhật

Cảm ơn các bạn vì đã đọc bài của mình

No comments:

Post a Comment