여러 크롬 확장에서 작업 내가 해낸 sinon-chrome사용하여 단위 테스트를 실행할 수 있습니다 프로젝트 mocha, nodejs및 phantomjs.
기본적으로 chrome.*사전 정의 된 json 응답을 넣을 수있는 모든 API 의 sinon mock을 만듭니다 .
다음으로, vm.runInNewContext백그라운드 페이지 및 phantomjs렌더 팝업 / 옵션 페이지에 노드를 사용하여 스크립트를로드합니다 .
마지막으로 크롬 API가 필요한 인수로 호출되었다고 주장합니다.
예를 들어 보겠습니다
. 버튼 배지에 열린 탭 수를 표시하는 간단한 크롬 확장 프로그램이 있다고 가정합니다.
배경 페이지 :
chrome.tabs.query({}, function(tabs) {
chrome.browserAction.setBadgeText({text: String(tabs.length)});
});
그것을 테스트하려면 다음이 필요합니다.
- 조롱
chrome.tabs.query두 개의 탭 예, 미리 정의 된 응답을 반환 할 수 있습니다.
- 조롱 된
chrome.*API를 환경에 주입
- 이 환경에서 확장 코드를 실행하십시오.
- 버튼 배지가 '2'와 같다고 주장
코드 스 니펫은 다음과 같습니다.
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"
});
이제 우리는 그것을 mocha의 describe..it함수 로 감싸서 터미널에서 실행할 수 있습니다.
$ mocha
background page
✓ should display opened tabs count in button badge
1 passing (98ms)
여기에서 전체 예제를 찾을 수 있습니다 .
또한 sinon-chrome을 사용하면 사전 정의 된 응답 (예 :
chrome.tab.onCreated.trigger({url: 'http://google.com'});