如何监视脚本中的JavaScript函数，并将其注入jsdom以用于测试目的？

我试图在开发Chrome扩展时测试函数。对于我的测试框架，我使用sinon（窥探，模拟和存根），mocha，chai和jsdom（创建一个执行我的Chrome扩展背景和弹出脚本的dom）。如何监视脚本中的JavaScript函数，并将其注入jsdom以用于测试目的？

但是，我似乎无法窥探脚本中的函数（background.js），我将其注入到jsdom中。

这是我在做什么：

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

请[编辑]问题成为话题：包括一个[重复问题*]的[mcve]。对于Chrome扩展程序或Firefox Web扩展程序，几乎总是需要包含* manifest.json *和一些背景，内容和/或弹出脚本/ HTML以及常用的网页HTML /脚本。寻求调试的问题帮助（“为什么我的代码不按我想要的方式工作？“）必须包括：（1）期望的行为，（2）特定的问题或错误，以及（3）在问题本身中重现*所需的最短代码*。另请参阅：[我可以在此处询问哪些主题？]（/ help/on-topic）和[问]。 – Makyen

你需要在上下文中的NodeJS

bg = require('background.js');

和背景，然后在您的测试应用间谍了这一点。

然而，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也许会很有趣。

来源

2018-03-05 21:47:40 stoically

如何监视脚本中的JavaScript函数，并将其注入jsdom以用于测试目的？

回答

相关问题