Pengujian menyeluruh untuk Ekstensi Chrome

Pengujian end-to-end melibatkan paket ekstensi yang dibuat dan dimuat ke dalam browser. Alat pengujian berkomunikasi dengan browser untuk mengotomatiskan interaksi dan menguji alur yang sama dengan yang akan dilalui pengguna. Library yang mendukung pengujian menyeluruh umumnya akan memberikan cara untuk mengontrol browser, menyimulasikan input pengguna, dan mengamati status halaman yang terbuka saat ini.

Lihat Menguji Ekstensi Chrome dengan Puppeteer untuk tutorial dan Pengujian unit untuk mengetahui detail tentang cara menulis pengujian unit untuk ekstensi Chrome.

Menggunakan library pengujian browser

Ekstensi didukung oleh berbagai library pengujian.

Koleksi	Panduan
Dalang / Penulis Drama	Lihat Ekstensi Chrome (Puppeteer / Playwright).
Selenium	Gunakan objek ChromeOptions untuk memuat ekstensi. Informasi selengkapnya tersedia di sini.
WebDriverIO	Lihat Pengujian Ekstensi Web.

Menjalankan pengujian di Chrome headless

Saat menjalankan pengujian sebagai bagian dari alur kerja otomatis, Anda sering kali perlu memuat ekstensi di komputer yang tidak memiliki layar. Mode headless baru Chrome memungkinkan Chrome dijalankan di lingkungan tanpa pengawasan seperti ini. Mulai Chrome menggunakan flag --headless=new (headless saat ini ditetapkan secara default ke "lama", yang tidak mendukung pemuatan ekstensi). Bergantung pada alat otomatisasi yang Anda pilih, mungkin ada setelan yang menambahkan tanda secara otomatis.

Menetapkan ID ekstensi

Sering kali Anda ingin memiliki ID ekstensi tetap dalam pengujian. Hal ini mempermudah banyak tugas umum seperti mengizinkan asal ekstensi di server yang perlu dikomunikasikan, atau membuka halaman ekstensi dalam pengujian. Untuk melakukannya, ikuti langkah-langkah di bagian Mempertahankan ID ekstensi yang konsisten.

Menguji halaman ekstensi

Halaman ekstensi dapat diakses menggunakan URL yang sesuai, misalnya chrome-extension://<id>/index.html. Gunakan metode navigasi normal yang tersedia di alat otomatisasi pilihan Anda untuk membuka URL ini.

Menguji pop-up ekstensi

Membuka pop-up ekstensi dalam konteks halaman lain saat ini tidak dapat dilakukan. Sebagai gantinya, buka URL pop-up di tab baru. Jika pop-up Anda menggunakan tab aktif, pertimbangkan untuk menerapkan penggantian tempat ID tab dapat diteruskan secara eksplisit ke pop-up Anda. Contoh:

const URL_PARAMS  = new URLSearchParams(window.location.search);

async function getActiveTab() {
  // Open popup.html?tab=5 to use tab ID 5, etc.
  if (URL_PARAMS.has("tab")) {
    return parseInt(URL_PARAMS.get("tab"));
  }

  const tabs = await chrome.tabs.query({
    active: true,
    currentWindow: true
  });

  return tabs[0];
}

Memeriksa status ekstensi

Untuk menghindari kegagalan pengujian saat Anda mengubah perilaku internal ekstensi, umumnya praktik terbaiknya adalah menghindari akses ke status internal dalam pengujian integrasi. Sebagai gantinya, Anda harus mendasarkan pengujian pada apa yang terlihat oleh pengguna. Namun, terkadang Anda mungkin ingin mengakses data secara langsung dari ekstensi. Dalam kasus ini, pertimbangkan untuk mengeksekusi kode dalam konteks halaman ekstensi.

Di Puppeteer:

const workerTarget = await browser.waitForTarget(
  target => target.type() === 'service_worker'
);
const worker = await workerTarget.worker();

const value = await worker.evaluate(() => {
  chrome.storage.local.get('foo');
});

Di Selenium:

// Selenium doesn't allow us to access the service worker, so we need to open an extension page where we can execute the code
await driver.get('chrome-extension://<id>/popup.html');
await driver.executeAsyncScript(
  'const callback = arguments[arguments.length - 1];' +
  'chrome.storage.local.get(\'foo\').then(callback);'
);

Menguji penghentian pekerja layanan

Untuk mempelajari pengujian penghentian pekerja layanan, lihat menguji penghentian pekerja layanan dengan Puppeteer. Kami juga memiliki contoh untuk Puppeteer dan Selenium.

Perhatikan, saat menggunakan beberapa framework pengujian, pekerja layanan mungkin tidak berhenti secara otomatis seperti dalam penggunaan normal. Hal ini berlaku di Selenium. Alat ini bergantung pada ChromeDriver yang memasang debugger ke semua pekerja layanan sehingga mencegahnya dihentikan.