End-to-end testen voor Chrome-extensies

Bij end-to-end testen wordt een extensiepakket gebouwd en in een browser geladen. Een testtool communiceert met de browser om interacties te automatiseren en dezelfde stromen te testen die een gebruiker zou doorlopen. Een bibliotheek die end-to-end-testen ondersteunt, biedt doorgaans manieren om de browser te besturen, gebruikersinvoer te simuleren en de huidige status van geopende pagina's te observeren.

Zie Chrome-extensies testen met Puppeteer voor een tutorial en Unit-testen voor details over het schrijven van unit-tests voor Chrome-extensies.

Browsertestbibliotheken gebruiken

Extensies worden ondersteund door een reeks testbibliotheken.

Tests uitvoeren in headless Chrome

Wanneer u tests uitvoert als onderdeel van een geautomatiseerde workflow, is het vaak nodig om uw extensie te laden op een machine zonder scherm. Dankzij de nieuwe headless- modus van Chrome kan Chrome in een onbeheerde omgeving als deze worden uitgevoerd. Start Chrome met de vlag --headless=new (headless is momenteel standaard ingesteld op 'oud', wat geen ondersteuning biedt voor laadextensies). Afhankelijk van de automatiseringstool die u kiest, kan er een instelling zijn die de vlag automatisch voor u toevoegt.

Een extensie-ID instellen

Bij tests is het vaak wenselijk om een ​​vaste extensie-ID te hebben. Dit maakt veel algemene taken eenvoudiger, zoals het toestaan ​​van de oorsprong van de extensie op een server waarmee deze moet communiceren, of het openen van extensiepagina's binnen tests. Om dit te doen, volgt u de stappen onder Een consistente extensie-ID behouden .

Extensiepagina's testen

Extensiepagina's zijn toegankelijk via de bijbehorende URL, bijvoorbeeld chrome-extension://<id>/index.html . Gebruik de normale navigatiemethoden die beschikbaar zijn in uw automatiseringstool naar keuze om naar deze URL's te navigeren.

Een extensiepop-up testen

Het openen van een extensiepop-up in de context van een andere pagina is momenteel niet mogelijk. Open in plaats daarvan de URL van de pop-up in een nieuw tabblad. Als uw pop-up het actieve tabblad gebruikt, kunt u overwegen een overschrijving te implementeren waarbij een tabblad-ID expliciet aan uw pop-up kan worden doorgegeven. Bijvoorbeeld:

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];
}

Extensiestatus inspecteren

Om testfouten te voorkomen wanneer u het interne gedrag van uw extensie wijzigt, is het over het algemeen het beste om toegang tot de interne status tijdens een integratietest te vermijden. In plaats daarvan moet u uw tests baseren op wat zichtbaar is voor de gebruiker. Soms kan het echter wenselijk zijn om rechtstreeks toegang te krijgen tot gegevens vanuit de extensie. Overweeg in deze gevallen om code uit te voeren in de context van een extensiepagina.

In poppenspeler:

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

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

Beëindiging van de servicemedewerker testen

Voor meer informatie over het testen van het beëindigen van servicemedewerkers, zie het testen van het beëindigen van servicemedewerkers met Puppeteer . We hebben ook een monster voor Puppeteer en Selenium.

Houd er rekening mee dat bij gebruik van sommige testframeworks servicemedewerkers mogelijk niet automatisch worden beëindigd, zoals bij normaal gebruik. Dit is het geval bij Selenium. Het is afhankelijk van ChromeDriver, dat een debugger aan alle servicemedewerkers koppelt, zodat ze niet kunnen worden gestopt.