0

크롬 확장을 개발하는 동안 함수를 테스트하려고합니다. 내 테스트 프레임 워크에서 sinon (스파이, 조롱 및 스텁), mocha, chai 및 jsdom (크롬 확장 배경 및 팝업 스크립트를 실행하는 dom 만들기)을 사용하고 있습니다.테스트 목적으로 jsdom에 삽입 된 스크립트에서 javascript 함수를 감시하는 방법은 무엇입니까?

그러나 jsdom에 주입하는 스크립트 (background.js)의 함수를 감시 할 수없는 것처럼 보입니다.

background.js

function searchTabs() {...} 

searchTabs(); 

module.exports.searchTabs = searchTabs; 

background.test.js

var fs = require('fs'); 
var sinon = require('sinon'); 
var chrome = require('sinon-chrome'); 
var assert = require('chai').assert; 
var jsdom = require('jsdom'); 

var bg = require('background.js'); 

var window; 
var spy; 

describe('background page', function() { 

    beforeEach(function() { 
     jsdom.env({ 
      html: '<html></html>', 
      src: [ 
       fs.readFileSync('background.js', 'utf-8'), // Inject script into jsdom 
      ], 
      created: ..., 
      done: ..., 
     }); 
    }); 

    afterEach(function() { 
     chrome.reset(); 
     window.close(); 
    }); 

    it('should call searchTabs', function() { 
     spy = sinon.spy(bg.searchTabs); 

     sinon.assert.calledOnce(spy); // This is not called :(
    }); 
}); 

나는 문제 중 하나가 잘못된 수입과 관련이있다 생각 :

내가 뭘하는지입니다/export 또는 jsdom에 삽입 된 background.js 스크립트가 스파이에 의해 래핑되지 않았 음을 나타냅니다. 누군가가이 문제에 대해 밝힐 수 있다면 정말 고마워요! 당신은 NodeJS 컨텍스트

bg = require('background.js'); 

과의 배경을 필요로하고

+0

다음과 같은 내용이 의심 될 수 있습니다. https://stackoverflow.com/questions/5605961/what-is-the-difference-between-jsdom-env-and-jsdom-jsdom – beaumontwebdev

+0

질문 [편집] on-topic : 문제가 중복되는 [mcve]를 포함 시키십시오. Chrome 확장 프로그램 또는 Firefox WebExtensions의 경우 * manifest.json * 및 백그라운드, 콘텐츠 및/또는 팝업 스크립트/HTML 중 일부와 웹 페이지 HTML/스크립트를 포함시켜야합니다. 디버깅 도움을 요청하는 질문 ("내 코드가 원하는 방식으로 작동하지 않는 이유는 무엇입니까?")에는 (1) 원하는 동작, (2) 특정 문제 또는 오류, (3) 질문 자체에 * 재현하는 데 필요한 가장 짧은 코드가 포함되어야합니다. * [여기에 대해 ?] (/ help/on-topic) 및 [ask]. – Makyen

답변

1

는 테스트에 당신은 그에게 스파이를 적용합니다.

그러나 JSDOM은 fs.readFileSync을 통해 파일의 복사본을 가져 와서 NodeJS 컨텍스트와 구분 된 샌드 박스에서 실행하므로 가짜를 적용하지 않습니다. 그래서 늘라는 당신에게 예상되는 결과를 얻을 수있어 기능 후에 스파이 을 적용 - 당신이 background.js로드 (또는 필요) 할 때 제공되는 예에서 판단 게다가

이는 searchTabs 기능이 이미 실행됩니다.

당신이 대신 할 수있는 것은 실제 실행과 기능을 분리하고 JSDOM 샌드 박스 내부에서 가짜를 적용하는 것입니다. 즉,이를 볼 수 있었다 :

background.js

window.searchTabs =() => { 
    // I'm searching for tabs 
} 

run.js

window.searchTabs(); 

test.js

const fs = require('fs'); 
const chrome = require('sinon-chrome'); 
const {JSDOM} = require('jsdom'); 

const html = '<!DOCTYPE html><html><head></head><body></body></html>'; 

const dom = new JSDOM(html, { 
    runScripts: 'outside-only', 
    beforeParse(window) { 
    window.chrome = chrome; 
    } 
}); 

dom.window.eval(fs.readFileSync('background.js')); 

const spy = sinon.spy(dom.window, 'searchTabs'); 

dom.window.eval(fs.readFileSync('run.js')); 

sinon.assert.calledOnce(spy); 

manifest.json을 기반으로 JSDOM에서 팝업 또는 배경을로드하는 쉬운 방법을 찾고 있다면 webextensions-jsdom도 재미있을 것입니다.