テスト目的でjsdomに注入されたスクリプトでjavascript関数を偵察するには？

私はクロムエクステンションを開発中に関数をテストしようとしています。私のテストフレームワークでは、sinon（スパイ、モック、スタブ）、mocha、chai、jsdom（chrome拡張のバックグラウンドとポップアップスクリプトを実行する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スクリプトがスパイにラップされていないことを確認します。私は誰かがこの問題についていくつかの光を当てることができれば本当に感謝します！

出典

2017-09-18 michaeldeng

私は次のことが明らかになったと思われる：https://stackoverflow.com/questions/5605961/what-is-the-difference-between-jsdom-env-and-jsdom-jsdom – beaumontwebdev

質問を編集[編集] on-topic：問題を再現する[mcve]を含める*。 Chrome拡張機能やFirefox WebExtensionsの場合は、* manifest.json *とバックグラウンド、コンテンツ、ポップアップスクリプト/ HTML、およびウェブページのHTML /スクリプトを含める必要があります。デバッグの助けを求める質問（「なぜ私のコードは私が望むように動作していないのですか？"）は、（1）望ましい行動、（2）特定の問題またはエラー、（3）質問そのものに*を再現するために必要な最短コード*を含んでいなければなりません。？]（/ help/on-topic）、[ask] – Makyen

あなたは

bg = require('background.js');

NodeJSコンテキストで背景を必要としていると、あなたのテストでは、あなたはそれにスパイを適用します。

しかし、JSDOMはファイルのコピーをfs.readFileSyncで取得し、それをNodeJSコンテキストとは別のサンドボックスで実行します。そこで、偽のファイルを適用しないでください。あなたがロード（または必要）するとき、あなたの提供例から判断すると、searchTabs機能がすでに実行されたことに加え

background.jsは - そう後の関数は文句を言わないあなたに期待される結果を得ると呼ばれるしまったスパイを適用します。

代わりに、実際の実行と関数を分離して、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も面白いかもしれません。

出典

2018-03-05 21:47:40 stoically

テスト目的でjsdomに注入されたスクリプトでjavascript関数を偵察するには？

答えて

関連する問題