Pracuje nad kilkoma rozszerzeniami chromowane wymyśliłem sinon-chromeprojekt, który pozwala uruchomić za pomocą testów jednostkowych mocha, nodejsi phantomjs.
Zasadniczo tworzy sinon makiety całego chrome.*interfejsu API, w którym można umieścić dowolne predefiniowane odpowiedzi json.
Następnie ładujesz swoje skrypty za pomocą węzła jako strony vm.runInNewContextw tle i phantomjswyskakującego okienka renderowania / strony opcji.
Na koniec zapewniasz, że wywołano chrome api z potrzebnymi argumentami.
Weźmy przykład:
Załóżmy, że mamy proste rozszerzenie Chrome, które wyświetla liczbę otwartych kart na plakietce przycisku.
strona w tle:
chrome.tabs.query({}, function(tabs) {
chrome.browserAction.setBadgeText({text: String(tabs.length)});
});
Aby to przetestować, potrzebujemy:
- mock,
chrome.tabs.queryaby zwrócić predefiniowaną odpowiedź, np. dwie karty.
- wstrzyknąć nasz udawany
chrome.*interfejs API do jakiegoś środowiska
- uruchomić nasz kod rozszerzenia w tym środowisku
- potwierdź, że znaczek przycisku jest równy „2”
Fragment kodu jest następujący:
const vm = require('vm');
const fs = require('fs');
const chrome = require('sinon-chrome');
// 1. mock `chrome.tabs.query` to return predefined response
chrome.tabs.query.yields([
{id: 1, title: 'Tab 1'},
{id: 2, title: 'Tab 2'}
]);
// 2. inject our mocked chrome.* api into some environment
const context = {
chrome: chrome
};
// 3. run our extension code in this environment
const code = fs.readFileSync('src/background.js');
vm.runInNewContext(code, context);
// 4. assert that button badge equals to '2'
sinon.assert.calledOnce(chrome.browserAction.setBadgeText);
sinon.assert.calledWithMatch(chrome.browserAction.setBadgeText, {
text: "2"
});
Teraz możemy zawinąć go w describe..itfunkcje mokki i uruchomić z terminala:
$ mocha
background page
✓ should display opened tabs count in button badge
1 passing (98ms)
Pełen przykład można znaleźć tutaj .
Dodatkowo sinon-chrome pozwala na wywołanie dowolnego zdarzenia chrome z predefiniowaną odpowiedzią, np
chrome.tab.onCreated.trigger({url: 'http://google.com'});