آزمایش انتها به انتها برای برنامه های افزودنی Chrome

تست سرتاسری شامل ساخت و بارگذاری یک بسته الحاقی در مرورگر است. یک ابزار تست با مرورگر ارتباط برقرار می‌کند تا تعاملات را خودکار کند و همان جریان‌هایی را که کاربر طی می‌کند، آزمایش کند. کتابخانه‌ای که از تست سرتاسری پشتیبانی می‌کند، عموماً روش‌هایی برای کنترل مرورگر، شبیه‌سازی ورودی کاربر و مشاهده وضعیت فعلی هر صفحه باز ارائه می‌دهد.

برای آموزش به بخش «آزمایش افزونه‌های کروم با Puppeteer» و برای جزئیات بیشتر در مورد نوشتن تست‌های واحد برای افزونه‌های کروم به بخش «تست واحد» مراجعه کنید.

استفاده از کتابخانه‌های تست مرورگر

افزونه‌ها توسط طیف وسیعی از کتابخانه‌های تست پشتیبانی می‌شوند.

اجرای تست‌ها در کروم بدون سر (headless Chrome)

هنگام اجرای تست‌ها به عنوان بخشی از یک گردش کار خودکار، اغلب لازم است افزونه خود را روی دستگاهی که صفحه نمایش ندارد بارگذاری کنید. حالت جدید headless کروم به کروم اجازه می‌دهد تا در محیطی بدون نظارت مانند این اجرا شود. کروم را با استفاده از پرچم --headless=new اجرا کنید (headless در حال حاضر به طور پیش‌فرض روی "old" است که از بارگذاری افزونه‌ها پشتیبانی نمی‌کند). بسته به ابزار اتوماسیونی که انتخاب می‌کنید، ممکن است تنظیماتی وجود داشته باشد که پرچم را به طور خودکار برای شما اضافه کند.

تنظیم شناسه افزونه

اغلب مطلوب است که در تست‌ها یک شناسه افزونه ثابت داشته باشید. این امر بسیاری از کارهای رایج مانند فهرست کردن مبدا افزونه در سروری که باید با آن ارتباط برقرار کند یا باز کردن صفحات افزونه در تست‌ها را آسان‌تر می‌کند. برای انجام این کار، مراحل زیر را در بخش «نگه داشتن شناسه افزونه ثابت» دنبال کنید.

آزمایش صفحات افزونه

صفحات افزونه‌ها را می‌توان با استفاده از URL مربوطه، مثلاً chrome-extension://<id>/index.html ، مشاهده کرد. برای پیمایش به این URLها، از روش‌های ناوبری معمول موجود در ابزار اتوماسیون مورد نظر خود استفاده کنید.

آزمایش یک پنجره بازشو افزونه

با استفاده از برخی کتابخانه‌ها، ممکن است بتوانید با استفاده از API مربوط به action.openPopup() پنجره‌ی پاپ‌آپ را باز کنید و سپس به متن جدید ارجاع دهید. برای مثال، Puppeteer نحوه‌ی انجام این کار را در راهنمای افزونه‌های کروم خود توضیح داده است.

اگر این امکان در کتابخانه مورد نظر شما وجود ندارد، URL پنجره را در یک برگه جدید باز کنید. اگر پنجره شما از برگه فعال استفاده می‌کند، پیاده‌سازی یک override را در نظر بگیرید که در آن بتوان شناسه برگه را به طور صریح به پنجره شما ارسال کرد. برای مثال:

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 await chrome.tabs.get(parseInt(URL_PARAMS.get("tab")));
  }

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

  return tabs[0];
}

بررسی وضعیت افزونه

برای جلوگیری از شکست تست هنگام تغییر رفتار داخلی افزونه، معمولاً بهترین روش این است که از دسترسی به وضعیت داخلی در تست یکپارچه‌سازی خودداری کنید. در عوض، باید تست‌های خود را بر اساس آنچه برای کاربر قابل مشاهده است، انجام دهید. با این حال، گاهی اوقات دسترسی مستقیم به داده‌ها از افزونه می‌تواند مطلوب باشد. در این موارد، اجرای کد را در متن یک صفحه افزونه در نظر بگیرید.

در بخش عروسک‌گردان:

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');
});

در سلنیوم:

// 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);'
);

خاتمه دادن به کارمند خدمات تست

برای کسب اطلاعات بیشتر در مورد آزمایش خاتمه سرویس ورکر، به آزمایش خاتمه سرویس ورکر با Puppeteer مراجعه کنید. ما همچنین نمونه‌ای برای Puppeteer و Selenium داریم.

توجه داشته باشید که هنگام استفاده از برخی چارچوب‌های تست، ممکن است سرویس ورکرها مانند حالت عادی به طور خودکار خاتمه نیابند. این مورد در سلنیوم صدق می‌کند. سلنیوم به ChromeDriver متکی است که یک اشکال‌زدا را به همه سرویس ورکرها متصل می‌کند و از توقف آنها جلوگیری می‌کند.