Bagaimana Melakukan Pengujian dengan Selenium

Selenium adalah framework kerja untuk mengotomatisasi browser web. Dengan Selenium, Anda dapat menguji setiap aspek situs web Anda dengan sangat mudah. Yang harus Anda lakukan adalah mengatur Selenium, menulis skrip pengujian web dalam bahasa pemrograman favorit Anda, dan menjalankan pengujian. Itu dia. Selenium akan menguji situs web Anda secara otomatis dan memberi tahu Anda jika ada error yang mungkin dimiliki situs web Anda. Pengujian web selenium sangat ideal untuk situs web menengah hingga besar.

Pada artikel ini, saya akan menunjukkan kepada Anda cara menulis pustaka pengujian web Python Selenium sederhana dan menguji situs web sederhana dengan Selenium. Jadi, mari kita mulai.

Prasyarat:

Untuk mencoba perintah dan contoh artikel ini, Anda harus memiliki:

  1. Distribusi Linux (sebaiknya Ubuntu) diinstal pada komputer Anda
  2. Python 3 diinstal di komputer Anda
  3. PIP 3 diinstal di komputer Anda
  4. Python virtualenv paket terinstal di komputer Anda
  5. Peramban web Mozilla Firefox atau Google Chrome terpasang di komputer Anda
  6. Harus tahu cara menginstal Firefox Gecko Driver atau Chrome Web Driver

Untuk memenuhi persyaratan 4, 5, dan 6, baca artikel saya Introduction to Selenium in Python 3. Anda dapat menemukan banyak artikel tentang topik lain di LinuxHint.com. Pastikan untuk memeriksanya jika Anda memerlukan bantuan.

Menyiapkan Direktori Proyek:

Untuk menjaga semuanya tetap teratur, buat direktori proyek baru selenium-test/ sebagai berikut:

$ mkdir -pv selenium-test/{www/styles,test/drivers}

Navigasikan ke selenium-test / direktori proyek sebagai berikut:

$ cd selenium-test/

Buat lingkungan virtual Python di direktori proyek sebagai berikut:

$ virtualenv.venv

Aktifkan lingkungan virtual sebagai berikut:

$ source.venv/bin/activate

Instal pustaka Selenium Python menggunakan PIP3 sebagai berikut:

$ pip3 install selenium

Download dan instal semua driver web yang diperlukan di test/drivers/direktori proyek. Saya telah menjelaskan proses mengdownload dan menginstal driver web di artikel sayaIntroduction to Selenium in Python 3.

Mempersiapkan Situs Demo:

Sebelum melangkah lebih jauh, mari buat situs web sederhana yang dapat kita uji dengan Selenium.

Pertama, buat file baru index.html dalam www/ direktori dan ketik baris kode berikut di dalamnya.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="styles/main.css">
  <title>Home</title>
</head>
<body>
  <div id="main-site">
    <nav>
      <ul id="main-nav">
        <li><a href="index.html">Home</a></li>
        <li><a href="products.html">Products</a></li>
        <li><a href="contact.html">Contact</a></li>
      </ul>
      <ul id="user-nav">
        <li><a href="register.html">Register</a></li>
        <li><a href="login.html">Log In</a></li>
      </ul>
    </nav>
    <div id="main-content">
      <h1>Recent Posts</h1>
      <article>
        <h2>Lorem, ipsum dolor.</h2>
        <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit.
 Ipsam recusandae provident dignissimos explicabo illum ea commodi?
 Dolorem, quae a magni, nam totam aut possimus voluptate dignissimos
 velit, excepturi delectus voluptatibus!</p>
      </article>

      <article>
        <h2>Lorem ipsum dolor sit amet.</h2>
        <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit.
 Tempore totam aliquid earum quam sint in? Lorem ipsum dolor sit amet
 consectetur adipisicing elit. Incidunt maiores perspiciatis tenetur,
 sequi cum porro?</p>
      </article>

      <article>
        <h2>Lorem, ipsum dolor sit amet consectetur adipisicing elit.</h2>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit.
 Delectus expedita eveniet iure, ad repellat, voluptatem cupiditate
 minus culpa eligendi maiores porro minima nihil provident, possimus
 molestiae. Ducimus voluptatum obcaecati, officiis atque asperiores
 laborum dolor rerum aspernatur facere temporibus doloremque eligendi.</p>
      </article>
    </div>
    <footer>© 2020 linuxhint.com</footer>
  </div>
</body>
</html>

Setelah selesai, simpan index.html mengajukan.

Membuat main.css file di www/styles/ direktori dan ketik baris kode berikut di dalamnya.

body {

background-color: rgb(67, 69, 73);

color: rgb(255, 242, 242);

font-family: Arial, Helvetica, sans-serif;

}

#main-site {

display: block;

width: 720px;

margin: auto;

}

/* navigation bar style */

nav {

display: flex;

flex-direction: row;

margin-bottom: 1.5em;

}

nav ul {

margin: 0;

padding: 0;

list-style-type: none;

}

#main-nav {

text-align: left;

flex: 2;

}

#user-nav {

text-align: right;

flex: 1;

}

nav ul li {

display: inline-block;

margin: 0.1em;

}

/* reset first and last link margin */

#main-nav > li:nth-child(1) {

margin-left: 0;

}

#user-nav > li:nth-child(2) {

margin-right: 0;

}

nav li a {

text-decoration: none;

color: rgb(248, 168, 63);

border-bottom: 2px solid transparent;

font-size: 1em;

}

nav li a:hover {

border-bottom: 2px solid rgb(130, 177, 21);

}

/* footer style */

footer {

margin-top: 1.5em;

text-align: center;

font-size:.8em;

color: rgb(167, 167, 167);

}

/* main content style */

#main-content h1 {

font-size:.9em;

color: rgb(192, 192, 192);

margi n-bottom: 0;

}

#main-content > article:nth-child(2) > h2 {

margin-top: 0;

}

article h2 {

font-size: 1.4em;

margin-bottom:.1em;

}

article p {

font-size: 1.1em;

margin-top: 0;

text-align: justify;

}

/* product page style */

.product {

display: flex;

flex-direction: row;

margin: 1em 0;

}

.product img {

width: 150;

min-width: 150px;

height: 150px;

min-height: 150px;

background-color: grey;

flex: 1;

}

.product-details {

flex: 2;

margin-left: 1em;

}

.product-details > h2 {

margin-top: 0;

margin-bottom:.1em;

font-size: 1.4em;

}

.product-details p {

margin-top: 0;

font-size: 1.1em;

text-align: justify;

}

/* Register styles */

form {

width: 400px;

margin: auto;

}

form.form-control {

display: flex;

flex-direction: row;

}

form.form-control label {

text-align: right;

padding-right: 1em;

}

form.form-control label {

flex: 1;

}

form.form-control input {

flex: 3;

}

form.form-control input[type="submit"] {

margin-top:.5em;

padding-left: 2px;

padding-right: 2px;

}

/* dialog style */

span.msg {

padding:.1em;

text-align: center;

display: block;

margin: 1em;

}

span.msg.success {

background-color: rgb(140, 247, 130);

color: rgb(53, 116, 53)

}

span.msg.fail {

background-color: rgb(247, 144, 130);

color: rgb(116, 53, 53)

}

Setelah selesai, simpan main.css mengajukan.

Membuat products.html file di www/ direktori dan ketik baris kode berikut di dalamnya.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="styles/main.css">
  <title>Products</title>
</head>
<body>
  <div id="main-site">
    <nav>
      <ul id="main-nav">
        <li><a href="index.html">Home</a></li>
        <li><a href="products.html">Products</a></li>
        <li><a href="contact.html">Contact</a></li>
      </ul>
      <ul id="user-nav">
        <li><a href="register.html">Register</a></li>
        <li><a href="login.html">Log In</a></li>
      </ul>
    </nav>
    <div id="main-content">
      <h1>All Products</h1>
      <div id="product-list">
        <div class="product">
          <img src="images/demo-product.jpg" alt="Photo not available" />
          <div class="product-details">
            <h2>Lorem consectetur adipisicing elit</h2>
            <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit.
 Porro cum quod suscipit. Eaque modi tempora assumenda in expedita eius
 voluptate, doloribus fugit accusantium suscipit perspiciatis.
 Pariatur aperiam minima placeat vel!</p>
          </div>
        </div>

        <div class="product">
          <img src="images/demo-product.jpg" alt="Photo not available" />
          <div class="product-details">
            <h2>Ipsum voluptatibus sit amet.</h2>
            <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit.
 Velit ea ullam quidem debitis illo! Cum beatae odit voluptates officia
 maxime obcaecati quidem eum numquam, consectetur cumque expedita natus
 quisquam? Rerum!</p>
          </div>
        </div>

        <div class="product">
          <img src="images/demo-product.jpg" alt="Photo not available" />
          <div class="product-details">
            <h2>Sit amet consectetur.</h2>
            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit.
 Iure, aperiam tempore enim nihil ex sapiente doloribus magnam delectus
 deleniti reprehenderit, sed error nisi minus temporibus, illum repudiandae.
 Quod, consequuntur at!</p>
          </div>
        </div>
      </div>
    </div>
    <footer>© 2020 linuxhint.com</footer>
  </div>
</body>
</html>

Setelah selesai, simpan products.html mengajukan.

Buat file baru contact.html dalam www/ direktori dan ketik baris kode berikut di dalamnya.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="styles/main.css">
  <title>Contact Us</title>
</head>
<body>
  <div id="main-site">
    <nav>
      <ul id="main-nav">
        <li><a href="index.html">Home</a></li>
        <li><a href="products.html">Products</a></li>
        <li><a href="contact.html">Contact</a></li>
      </ul>
      <ul id="user-nav">
        <li><a href="register.html">Register</a></li>
        <li><a href="login.html">Log In</a></li>
      </ul>
    </nav>
    <div id="main-content">
      <h1>Contact Information</h1>
      <p><b>Name:</b> DemoTech Inc</p>
      <p><b>Country:</b> USA</p>
      <p><b>Phone:</b> +1 000 000 0000</p>
      <p><b>Address:</b> Lorem ipsum dolor, sit amet consectetur
adipisicing elit. Impedit, laudantium!</p>
    </div>
    <footer>© 2020 linuxhint.com</footer>
  </div>
</body>
</html>

Setelah selesai, simpan contact.html mengajukan.

Buat file baru register.html dalam www/ direktori dan ketik baris kode berikut di dalamnya.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="styles/main.css">
  <title>Register</title>
</head>
<body>
  <div id="main-site">
    <nav>
      <ul id="main-nav">
        <li><a href="index.html">Home</a></li>
        <li><a href="products.html">Products</a></li>
        <li><a href="contact.html">Contact</a></li>
      </ul>
      <ul id="user-nav">
        <li><a href="register.html">Register</a></li>
        <li><a href="login.html">Log In</a></li>
      </ul>
    </nav>
    <div id="main-content">
      <form action="success.html">
        <div class="form-control">
          <label for="username">Username</label>
          <input type="text" id="username" name="username">
        </div>
        <div class="form-control">
          <label for="email">E-mail</label>
          <input type="email" id="email" name="email">
        </div>
        <div class="form-control">
          <label for="password">Password</label>
          <input type="password" id="password" name="password">
        </div>
        <
div class="form-control">
          <label> </label>
          <input type="submit" value="Register" />
        </div>
      </form>
    </div>
    <footer>© 2020 linuxhint.com</footer>
  </div>
</body>
</html>

Setelah selesai, simpan register.html mengajukan.

Buat file baru login.html dalam www/ direktori dan ketik baris kode berikut di dalamnya.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="styles/main.css">
  <title>Log In</title>
</head>
<body>
  <div id="main-site">
    <nav>
      <ul id="main-nav">
        <li><a href="index.html">Home</a></li>
        <li><a href="products.html">Products</a></li>
        <li><a href="contact.html">Contact</a></li>
      </ul>
      <ul id="user-nav">
        <li><a href="register.html">Register</a></li>
        <li><a href="login.html">Log In</a></li>
      </ul>
    </nav>
    <div id="main-content">
      <form action="failed.html">
        <div class="form-control">
          <label for="username">Username</label>
          <input type="text" id="username" name="username">
        </div>
        <div class="form-control">
          <label for="password">Password</label>
          <input type="password" id="password" name="password">
        </div>
        <div class="form-control">
          <label> </label>
          <input type="submit" value="Log In" />
        </div>
      </form>
    </div>
    <footer>© 2020 linuxhint.com</footer>
  </div>
</body>
</html>

Setelah selesai, simpan login.html mengajukan.

Buat file baru failed.html dalam www/ direktori dan ketik baris kode berikut di dalamnya.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="styles/main.css">
  <title>Request Failed</title>
</head>
<body>
  <div id="main-site">
    <nav>
      <ul id="main-nav">
        <li><a href="index.html">Home</a></li>
        <li><a href="products.html">Products</a></li>
        <li><a href="contact.html">Contact</a></li>
      </ul>
      <ul id="user-nav">
        <li><a href="register.html">Register</a></li>
        <li><a href="login.html">Log In</a></li>
      </ul>
    </nav>
    <div id="main-content">
      <span class="msg fail">Unable to process your request.</span>
    </div>
    <footer>© 2020 linuxhint.com</footer>
  </div>
</body>
</html>

Setelah selesai, simpan failed.html mengajukan.

Buat file baru success.html dalam www/ direktori dan ketik baris kode berikut di dalamnya.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="styles/main.css">
  <title>Success</title>
</head>
<body>
  <div id="main-site">
    <nav>
      <ul id="main-nav">
        <li><a href="index.html">Home</a></li>
        <li><a href="products.html">Products</a></li>
        <li><a href="contact.html">Contact</a></li>
      </ul>
      <ul id="user-nav">
        <li><a href="register.html">Register</a></li>
        <li><a href="login.html">Log In</a></li>
      </ul>
    </nav>
    <div id="main-content">
      <span class="msg success">Your request is successful.</span>
    </div>
    <footer>© 2020 linuxhint.com</footer>
  </div>
</body>
</html>

Setelah selesai, simpan success.html mengajukan.

Akhirnya, Anda www/ direktori harus memiliki file-file berikut, seperti yang ditandai pada tangkapan layar di bawah.

Untuk menguji situs web dengan Selenium, kita harus mengakses situs web dari server web lokal. Untungnya, ini sangat mudah dilakukan dengan Python.

Buat file baru start.sh di direktori proyek dan ketik baris berikut di dalamnya.

#!/bin/bash
python3 -m http.server --directory www/ 8080

Setelah selesai, simpan start.sh mengajukan.

Tambahkan izin yang dapat dieksekusi ke file start.sh dengan perintah berikut:

$ chmod +x start.sh

Mulai server web dengan perintah berikut:

$./start.sh

Server web harus dimulai pada port 8080.

Sekarang, Anda seharusnya dapat mengakses situs web dari browser web.

Kunjungi http://localhost:8080 dari browser web favorit Anda. Halaman beranda situs web harus dimuat di browser, seperti yang Anda lihat pada tangkapan layar di bawah.

Itu products.html halaman situs web.

Itu contact.html halaman situs web.

Itu register.html halaman situs web.

Itu login.html halaman situs web.

Kami juga memiliki success.html halaman.

Dan failed.html halaman.

Formulir pendaftaran (register.html) situs web diatur untuk selalu sukses (success.html), dan formulir masuk (login.html) situs web diatur agar selalu gagal (failed.html). Ini untuk mendemonstrasikan cara menangani error dalam pengujian web dengan Selenium.

Menulis Pustaka Pengujian Web Python Sederhana:

Untuk membuat pengujian web dengan Selenium lebih mudah, saya telah menulis perpustakaan pengujian web Selenium sederhana WebTestdengan Python. Pustaka ini memeriksa apakah pengujian tertentu berhasil atau tidak dan mencetak pesan status yang diformat dengan baik untuk semua pengujian.

Buat skrip Python baru test.py dalam test/ direktori proyek Anda dan ketik baris kode berikut di dalamnya.

class WebTest(object):
  def __init__(self):
    self.errors=0
    self.passed=0
    self.tests = []
  def add(self, test):
    self.tests.append(test)
  def check(self, check, title):
    try:
      assert check[0] == check[1]
      print('[✓] %s' % title)
      self.passed += 1
    except AssertionError:
      print("[✕] %s" % title)
      self.errors += 1
 
  def run(self):
    print("Tests:")
    for test in self.tests:
      self.check([test["expect"], test["targetElement"]], test["name"])
 
  def result(self):
    print(self)
  def __str__(self):
    return "nTest complete.nTotal %d tests. %d passed and %d errors.n" %
   (self.totalTests(), self.passed, self.errors)
  def totalTests(self):
    return self.errors + self.passed

Setelah selesai, simpan test.py skrip python.

Baris 1 mendefinisikan a WebTest kelas.

Baris 2-5 menginisialisasi errors, passed, dan tests variabel untuk WebTest obyek.

Itu error variabel akan menampung jumlah total tes yang gagal.

Itu passed variabel akan menampung jumlah total tes yang lulus.

Itu tests list akan menampung semua tes.

Baris 33-34 mendefinisikan totalTests()metode. Metode ini mengembalikan jumlah total tes yang dilakukan perpustakaan. Jumlah total tes hanyalah penjumlahan dari semua tes yang lulus dan gagal.

Baris 29-30 mendefinisikan __str__()metode. Metode ini mendefinisikan apa yang harus dikembalikan ketika objek WebTest diubah menjadi string. Itu hanya mengembalikan ringkasan tes.

Baris 26-27 mendefinisikan result()metode. Metode ini menggunakan__str__() metode untuk mengonversi objek menjadi string dan mencetaknya di konsol.

Baris 8-9 mendefinisikan add()metode. Metode ini menambahkan kasus uji baru ketests daftar WebTest obyek.

Baris 11-18 mendefinisikan check()metode. Metode ini memeriksa apakah tes memiliki nilai yang diharapkan dan mencetak status tes tergantung pada apakah tes lulus atau gagal.

Baris 21-24 mendefinisikan run()metode. Metode ini memanggilcheck() metode untuk setiap kasus uji.

Saya akan menjelaskan lebih lanjut tentang perpustakaan pengujian web ini ketika kami akan menggunakannya untuk menguji situs web kami di bagian selanjutnya dari artikel ini.

Memeriksa Judul Situs Web:

Di bagian ini, saya akan menunjukkan kepada Anda bagaimana melakukan tes yang paling sederhana, memeriksa judul halaman web.

Situs web demo kami memiliki 5 halaman: home.html, products.html, contact.html, login.html, register.html

Yang ingin saya lakukan adalah memeriksa apakah masing-masing halaman ini memiliki judul yang tepat.

Buat skrip Python baru ex01_check_title.py dan ketik baris kode berikut di dalamnya.

from selenium import webdriver
from selenium.webdriver.common.keys import Keys
from time import sleep
from test import WebTest
test = WebTest()
options = webdriver.ChromeOptions()
options.headless = True
options.add_argument('--window-size=1280,720')
browser = webdriver.Chrome(executable_path="./drivers/chromedriver", options=options)
baseUrl = "http://localhost:8000"
pages = {
  "home": baseUrl,
  "products": baseUrl + "/products.html",
  "contact": baseUrl + "/contact.html",
  "login": baseUrl + "/login.html",
  "register": baseUrl + "/register.html"
}
browser.get(pages["home"])
test.add({
  "name": "homepage title",
  "expect": "Home",
  "targetElement": browser.title
})
browser.get(pages["products"])
test.add({
  "name": "products page title",
  "expect": "Products 2",
  "targetElement": browser.title
})
browser.get(pages["contact"])
test.add({
  "name": "contact page title",
  "expect": "Contact Us",
  "targetElement": browser.title
})
browser.get(pages["login"])
test.add({
  "name": "login page title",
  "expect": "Log In",
  "targetElement": browser.title
})
browser.get(pages["register"])
test.add({
  "name": "register page title",
  "expect": "Create an account",
  "targetElement": browser.title
})
test.run()
test.result()

Setelah selesai, simpan ex01_check_title.py skrip python.

Baris 1-3 mengimpor semua pustaka Python yang diperlukan.

Jalur 4 mengimpor buatan kami sendiri WebTest Pustaka pengujian web selenium.

Baris 6 membuat a WebTest() objek dan menyimpannya di test variabel.

Baris 8 membuat dan a ChromeOptions() obyek.

Baris 9 mengaktifkan cara tanpa kepala.

Baris 10 mengatur ukuran jendela browser.

Baris 8 membuat Chrome browser objek menggunakan chromedriver biner dari test/drivers/ direktori proyek.

Baris 14 mendefinisikan URL situs web dasar.

Baris 15 hingga 21 membuat pages kamus yang memiliki semua URL halaman web yang ingin kita periksa judulnya.

Baris 23 memuat halaman beranda di browser.

Baris 24-28 menambahkan tes baru menggunakan add() metode dari WebTest obyek.

Tes memiliki name, expect, dan targetElement Properti.

Itu name properti akan muncul dalam status pengujian.

Judul yang kami harapkan untuk halaman beranda diberikan di expect Properti.

Judul halaman web (browser.title), yang kita periksa untuk nilai yang diharapkan, diberikan dalam targetElement Properti.

Jadi, baris 23-28 digunakan untuk memuat halaman beranda di browser dan memeriksa apakah judul halaman beranda sudah benar.

Kode untuk menguji judul halaman web untuk halaman lain dari situs web adalah sama. Anda cukup menyalin dan menempelkan kode yang sama dan memodifikasinya sesuai kebutuhan.

Baris 30-35 digunakan untuk memuat halaman produk di browser dan memeriksa apakah judul halaman produk sudah benar.

Baris 37-42 digunakan untuk memuat halaman kontak di browser dan memeriksa apakah judul halaman kontak sudah benar.

Baris 44-49 digunakan untuk memuat halaman login di browser dan memeriksa apakah judul halaman login sudah benar.

Baris 51-56 digunakan untuk memuat halaman register di browser dan memeriksa apakah judul halaman register sudah benar.

Jalur 58 menggunakan run() metode WebTest objek untuk menjalankan tes.

Baris 59 menggunakan result() metode WebTest objek untuk mencetak ringkasan pengujian di konsol.

Untuk menjalankan tes, navigasikan ke test/ direktori proyek sebagai berikut:

$ cd test/

Jalankan skrip Python ex01_check_title.py sebagai berikut:

$ python3 ex01_check_title.py

Seperti yang Anda lihat, semua halaman web diperiksa untuk judul yang benar. Tes yang berhasil memiliki tanda centang, dan tes yang gagal memiliki tanda silang. Ringkasan tes akhir juga dicetak di konsol.

Kami mendapat 2 error dalam tes. Mari kita perbaiki.

Error pertama ada di products page title. Kami mengharapkan judul yang salah. Ubah judul yang diharapkan dari halaman produk diex01_check_title.py berkas sebagai berikut.

Error kedua ada di halaman register. Kami mengharapkan gelar untukCreate an account. Tetapi kami memiliki sesuatu yang lain di halaman daftar.

Untuk memperbaiki error kedua, ubah judul register.html file di www/ direktori proyek sebagai berikut.

Sekarang, jalankan skrip pengujian ex01_check_title.pylagi, dan semua tes harus berhasil, seperti yang Anda lihat pada tangkapan layar di bawah. Jadi, perpustakaan pengujian web Selenium kami berfungsi seperti yang diharapkan.

$ python3 ex01_check_title.py

Memeriksa Navigasi Halaman Web:

Di bagian ini, saya akan menunjukkan kepada Anda cara memeriksa apakah tautan navigasi halaman web berfungsi dengan benar menggunakan pustaka Selenium Python.

Buat skrip Python baru ex02_check_navigation.py dalam test/ direktori proyek Anda dan ketik baris kode berikut di dalamnya.

from selenium import webdriver
from selenium.webdriver.common.keys import Keys
from selenium.webdriver.common.by import By
from selenium.webdriver.common.action_chains import ActionChains
from selenium.webdriver.support import expected_conditions
from selenium.webdriver.support.ui import WebDriverWait
from test import WebTest
from time import sleep

test = WebTest()

options = webdriver.ChromeOptions()
options.add_argument('--window-size=1000,600')

browser = webdriver.Chrome(executable_path="./drivers/chromedriver",
options=options)

baseUrl = "http://localhost:8080"
browser.get(baseUrl)

sleep(2)

homeLink = WebDriverWait(browser, 10).until(expected_conditions.visibility
_of_element_located((By.XPATH, "//nav/ul[@id='main-nav']/li[1]/a")))
ActionChains(browser).click(homeLink).perform()
test.add({
  "name": "navigation to homepage",
  "expect": baseUrl + "/index.html",
  "targetElement": browser.current_url
})

sleep(2)

productsLink = WebDriverWait(browser, 10).until(expected_conditions.visibility
_of_element_located((By.XPATH, "//nav/ul[@id='main-nav']/li[2]/a")))
ActionChains(browser).click(productsLink).perform()
test.add({
  "name": "navigation to products page",
  "expect": baseUrl + "/products.html",
  "targetElement": browser.current_url
})

sleep(2)


contactLink = WebDriverWait(browser, 10).until(expected_conditions.visibility
_of_element_located((By.XPATH, "//nav/ul[@id='main-nav']/li[3]/a")))
ActionChains(browser).click(contactLink).perform()
test.add({
  "name": "navigation to contact page",
  "expect": baseUrl + "/contact.html",
  "targetElement": browser.current_url
})

sleep(2)



registerLink = WebDriverWait(browser, 10).until(expected_conditions.visibility
_of_element_located((By.XPATH, "//nav/ul[@id='user-nav']/li[1]/a")))
ActionChains(browser).click(registerLink).perform()
test.add({
  "name": "navigation to register page",
  "expect": baseUrl + "/register.html",
  "targetElement": browser.current_url
})

sleep(2)



loginLink = WebDriverWait(browser, 10).until(expected_conditions.visibility
_of_element_located((By.XPATH, "//nav/ul[@id='user-nav']/li[2]/a")))
ActionChains(browser).click(loginLink).perform()
test.add({
  "name": "navigation to login page",
  "expect": baseUrl + "/login.html",
  "targetElement": browser.current_url
})

sleep(2)

browser.close()

test.run()
test.result()

Setelah selesai, simpan ex02_check_navigation.py skrip python.

Baris 1-8 mengimpor semua perpustakaan yang diperlukan.

Baris 10 membuat WebTest() objek dan menyimpannya di test variabel.

Baris 12 membuat dan a ChromeOptions() obyek.

Baris 13 mengatur ukuran jendela browser.

Baris 15 membuat Chrome browser objek menggunakan chromedriver biner dari test/drivers/ direktori proyek.

Baris 17 mendefinisikan URL situs web dasar.

Baris 18 memuat situs web di browser.

Baris 20 menggunakan sleep()berfungsi untuk menunda eksekusi instruksi selanjutnya selama 2 detik. Sehingga Anda dapat mengamati bagaimana Selenium mengotomatiskan seluruh proses; jika tidak, hal-hal akan terjadi sangat cepat. Inilah sebabnya saya menggunakansleep() berfungsi berkali-kali dalam contoh ini.

Baris 22-28 digunakan untuk menemukan tautan navigasi halaman beranda, memindahkan kursor mouse ke tautan itu, mengklik tautan itu, dan memastikan bahwa browser menavigasi ke halaman web yang benar.

Baris 30 menunda instruksi berikutnya selama 2 detik.

Baris 22 menemukan tautan navigasi pertama, yang merupakan tautan beranda menggunakan pemilih XPath //nav/ul[@id=’main-nav’]/li[1]/a.

Jalankan skrip Python ex02_check_navigation.py sebagai berikut:

$ python3 ex01_check_title.py

Selenium harus memulai instance browser web, memuat situs web, dan menguji semua tautan navigasi satu per satu.

Setelah tes selesai, itu harus mencetak hasil tes. Seperti yang Anda lihat, semua tautan navigasi bekerja dengan sempurna.

Memeriksa Informasi Hak Cipta:

Di bagian ini, saya akan menunjukkan cara memeriksa informasi hak cipta situs web.

Informasi hak cipta ada di tag footer halaman web. Struktur HTML dari informasi hak cipta ditunjukkan pada tangkapan layar di bawah.

Untuk memeriksa apakah informasi hak cipta sudah benar, buat skrip Python baru ex03_check_copyright.py dalam test/ direktori proyek dan ketik baris kode berikut di dalamnya.

from selenium import webdriver
from selenium.webdriver.common.keys import Keys
from selenium.webdriver.common.by import By
from time import sleep
from test import WebTest
test = WebTest()
options = webdriver.ChromeOptions()
options.headless = True
options.add_argument('--window-size=1280,720')
browser = webdriver.Chrome(executable_path="./drivers/chromedriver", options=options)
baseUrl = "http://localhost:8080"
browser.get(baseUrl)
test.add({
  "name": "check copyright",
  "expect": "© 2020 linuxhint.com",
  "targetElement": browser.find_element(By.TAG_NAME, 'footer').text
})
test.run()
test.result()

Setelah selesai, simpan ex03_check_copyright.py skrip python.

Baris 1-5 mengimpor semua pustaka Python yang diperlukan.

Baris 7 membuat WebTest() objek dan menyimpannya di test variabel.

Baris 9 membuat dan a ChromeOptions() obyek.

Baris 10 mengaktifkan cara tanpa kepala.

Baris 11 mengatur ukuran jendela browser.

Baris 13 membuat Chrome browser objek menggunakan chromedriver biner dari test/drivers/ direktori proyek.

Baris 15 mendefinisikan URL situs web dasar, dan baris 16 memuat URL di browser.

Baris 18-22 menambahkan tes baru menggunakan add() metode dari WebTest obyek.

Nilai yang diharapkan adalah informasi hak cipta situs web. Informasi hak cipta tersedia difootermenandai. Isi darifooter tag adalah targetElement.

Baris 21 mengekstrak informasi hak cipta dari footer tandai menggunakan browser.find_element() metode.

Baris 24 menggunakan run() metode WebTest objek untuk menjalankan tes.

Baris 25 menggunakan result() metode WebTest objek untuk mencetak ringkasan pengujian di konsol.

Jalankan skrip Python ex03_check_copyright.py sebagai berikut:

$ python3 ex03_check_copyright.py

Seperti yang Anda lihat, informasi hak cipta sudah benar. Tes berlalu.

Memeriksa Formulir Pendaftaran:

Di bagian ini, saya akan menunjukkan cara mengisi formulir dan mengirimkannya menggunakan Selenium. Untuk tes ini, saya akan menggunakan formulir pendaftaran situs web dummy kami.

Struktur HTML formulir pendaftaran ditunjukkan pada tangkapan layar di bawah ini.

Buat skrip Python baru ex04_registration_check.py dan ketik baris kode berikut di dalamnya.

from selenium import webdriver
from selenium.webdriver.common.keys import Keys
from selenium.webdriver.common.by import By
from selenium.webdriver.support import expected_conditions
from selenium.webdriver.support.ui import WebDriverWait
from test import WebTest
from time import sleep

test = WebTest()

options = webdriver.ChromeOptions()
options.add_argument('--window-size=1000,600')

browser = webdriver.Chrome(executable_path="./drivers/chromedriver", options=options)

registerFormUrl = "http://localhost:8080/register.html"

browser.get(registerFormUrl)

usernameInput = WebDriverWait(browser, 10).until(
  expected_conditions.visibility_of_element_located((By.XPATH, "//form//input[@name='username']"))
)
emailInput = WebDriverWait(browser, 10).until(
  expected_conditions.visibility_of_element_located((By.XPATH, "//form//input[@name='email']"))
)
passwordInput = WebDriverWait(browser, 10).until(
  expected_conditions.visibility_of_element_located((By.XPATH, "//form//input[@name='password']"))
)
submitButton = WebDriverWait(browser, 10).until(
  expected_conditions.visibility_of_element_located((By.XPATH, "//form//input[@type='submit']"))
)

usernameInput.send_keys('my dummy name')
sleep(1)
emailInput.send_keys('[email protected]')
sleep(1)
passwordInput.send_keys('my super secret pass')
sleep(1)

submitButton.send_keys(Keys.ENTER)


submitStatus = WebDriverWait(browser, 10).until(
  expected_conditions.visibility_of_element_located((By.CSS_SELECTOR, "#main-content span.msg"))
)

test.add({
  "name": "registration test",
  "expect": "Your request is successful.",
  "targetElement": submitStatus.text
})

sleep(2)

browser.close()

test.run()
test.result()

Setelah selesai, simpan ex04_register_check.py skrip python.

Baris 1-7 mengimpor semua pustaka Python yang diperlukan.

Jalur 9 mengimpor buatan kami sendiri WebTest Pustaka pengujian web selenium.

Baris 11 membuat dan a ChromeOptions() obyek.

Baris 12 mengatur ukuran jendela browser.

Baris 14 membuat Chrome browser objek menggunakan chromedriver biner dari test/drivers/ direktori proyek.

Baris 16 mendefinisikan URL halaman pendaftaran situs web, dan baris 18 memuat halaman pendaftaran di browser.

Baris 20-22 menemukan nama user dari elemen input dari halaman web dan menyimpan referensi ke elemen input form ke variabel usernameInput.

Baris 23-25 ​​menemukan elemen input formulir email dari halaman web dan menyimpan elemen yang dirujuk ke variabel emailInput.

Baris 26-28 menemukan elemen input formulir password dari halaman web dan menyimpan referensi elemen ke variabel passwordInput.

Baris 29-31 menemukan tombol kirim formulir dari halaman web dan menyimpan referensinya dalam variabel submitButton.

Baris 33 mengirimkan nama user dummy ke nama user dari elemen input.

Baris 34 menunda eksekusi instruksi berikutnya selama 1 detik menggunakan sleep() fungsi.

Baris 35 mengirimkan email dummy ke elemen input formulir email.

Baris 36 menunda eksekusi instruksi berikutnya selama 1 detik menggunakan sleep() fungsi.

Baris 37 mengirimkan password tiruan ke elemen input formulir password.

Baris 38 menunda eksekusi instruksi berikutnya selama 1 detik menggunakan sleep() fungsi.

Baris 40 menekan tombol <Enter>tombol pada tombol kirim formulir. Tindakan ini mengirimkan formulir.

Setelah formulir dikirimkan, baris 43-45 memeriksa pesan status pengiriman formulir.

Baris 47-51 menambahkan kasus uji ke WebTest obyek.

Jika pengiriman formulir berhasil, pesan statusnya adalah Your request is successful.

Baris 53 menunda eksekusi selama 2 detik.

Baris 55 menutup browser.

Jalur 57 menggunakan run() metode WebTest objek untuk menjalankan tes.

Jalur 58 menggunakan result() metode WebTest objek untuk mencetak ringkasan pengujian di konsol.

Jalankan skrip Python ex04_register_check.py sebagai berikut:

$ python3 ex04_register_check.py

Instance browser harus membuka dan memuat halaman pendaftaran situs web. Kemudian, itu harus secara otomatis mengisi formulir dan klik padaRegister tombol.

Pada pengiriman formulir yang berhasil, pesan berikut akan ditampilkan.

Setelah skrip pengujian selesai, ringkasan pengujian harus dicetak di konsol. Seperti yang Anda lihat, tes formulir pendaftaran berhasil.

Memeriksa Formulir Masuk:

Di bagian ini, saya akan menunjukkan cara menguji formulir login situs web demo kami. Prosesnya sama dengan mengirimkan formulir pendaftaran, yang telah Anda lihat di bagian awal artikel ini.

Struktur HTML formulir login ditunjukkan pada tangkapan layar di bawah ini.

Buat skrip Python baru ex05_login_check.py dan ketik baris kode berikut di dalamnya.

from selenium import webdriver
from selenium.webdriver.common.keys import Keys
from selenium.webdriver.common.by import By
from selenium.webdriver.support import expected_conditions
from selenium.webdriver.support.ui import WebDriverWait
from test import WebTest
from time import sleep
test = WebTest()
options = webdriver.ChromeOptions()
options.add_argument('--window-size=1000,600')
browser = webdriver.Chrome(executable_path="./drivers/chromedriver", options=options)
loginFormUrl = "http://localhost:8080/login.html"
browser.get(loginFormUrl)
usernameInput = WebDriverWait(browser, 10).until(
  expected_conditions.visibility_of_element_located((By.XPATH, "//form//input[@name='username']"))
)
passwordInput = WebDriverWait(browser, 10).until(
  expected_conditions.visibility_of_element_located((By.XPATH, "//form//input[@name='password']"))
)
submitButton = WebDriverWait(browser, 10).until(
  expected_conditions.visibility_of_element_located((By.XPATH, "//form//input[@type='submit']"))
)
usernameInput.send_keys('my dummy name')
sleep(1)
passwordInput.send_keys('my super secret pass')
sleep(1)
submitButton.send_keys(Keys.ENTER)
submitStatus = WebDriverWait(browser, 10).until(
  expected_conditions.visibility_of_element_located((By.CSS_SELECTOR, "#main-content span.msg"))
)
test.add({
  "name": "login test",
  "expect": "Your request is successful.",
  "targetElement": submitStatus.text
})
sleep(2)
browser.close()
test.run()
test.result()

Setelah selesai, simpan ex05_login_check.py skrip python.

Baris 1-7 mengimpor semua pustaka Python yang diperlukan.

Jalur 9 mengimpor buatan kami sendiri WebTest Pustaka pengujian web selenium.

Baris 11 membuat dan a ChromeOptions() obyek.

Baris 12 mengatur ukuran jendela browser.

Baris 14 membuat Chrome browser objek menggunakan chromedriver biner dari test/drivers/ direktori proyek.

Baris 16 mendefinisikan URL halaman login situs web, dan baris 18 memuat halaman login di browser.

Baris 20-22 menemukan nama user dari elemen input dari halaman web dan menyimpan referensi ke elemen input form ke variabel usernameInput.

Baris 23-25 ​​menemukan elemen input formulir password dari halaman web dan menyimpan referensi elemen ke variabel passwordInput.

Baris 26-28 menemukan tombol kirim formulir dari halaman web dan menyimpan referensinya dalam variabel submitButton.

Baris 30 mengirimkan nama user login palsu ke nama user dari elemen input.

Baris 31 menunda eksekusi instruksi berikutnya selama 1 detik menggunakan sleep() fungsi.

Baris 32 mengirimkan password login palsu ke elemen input formulir password.

Baris 33 menunda eksekusi instruksi berikutnya selama 1 detik menggunakan sleep() fungsi.

Baris 35 menekan tombol <Enter>tombol pada tombol kirim formulir login. Tindakan ini mengirimkan formulir login.

Setelah formulir login dikirimkan, baris 38-40 memeriksa pesan status pengiriman formulir.

Baris 42-46 menambahkan kasus uji ke WebTest obyek.

Jika pengiriman formulir berhasil, pesan statusnya adalah Your request is successful.

Baris 48 menunda eksekusi selama 2 detik.

Baris 50 menutup browser.

Baris 52 menggunakan run() metode WebTest objek untuk menjalankan tes.

Jalur 53 menggunakan result() metode WebTest objek untuk mencetak ringkasan pengujian di konsol.

Jalankan skrip Python ex05_login_check.py sebagai berikut:

$ python3 ex05_login_check.py

Instance browser harus membuka dan memuat halaman login situs web. Kemudian, itu harus secara otomatis mengisi formulir dan klik padaLog In tombol.

Pengiriman formulir gagal, seperti yang Anda lihat pada tangkapan layar di bawah.

Setelah skrip pengujian selesai, ringkasan pengujian harus dicetak di konsol. Seperti yang Anda lihat, tes pengiriman formulir login gagal seperti yang diharapkan.

Kesimpulan:

Pada artikel ini, saya telah menunjukkan kepada Anda cara menulis pustaka pengujian web Python sederhana untuk pengujian web Selenium. Saya juga telah menunjukkan kepada Anda cara menguji situs web menggunakan perpustakaan Selenium Python. Sekarang, Anda seharusnya dapat melakukan pengujian web dasar menggunakan pustaka Selenium Python.

Related Posts