如何为期望存在某些全局变量的javascript“插件”（iframe）编写单元测试答案

【问题标题】：How to write unit tests for for javascript 'plugin' (iframe) that expects certain global variables to be present如何为期望存在某些全局变量的javascript“插件”（iframe）编写单元测试
【发布时间】：2017-12-16 00:53:55
【问题描述】：

我正在处理Trello Power Up。它们的工作方式是加载您提供的 iFrame，其中包含一些包含您的自定义代码的 script 标签。您可以看到一个工作示例here。结果是，当您的代码运行时，存在与您交互的某些“全局”（甚至不确定这是否是正确的词）对象。例如：

const Promise = TrelloPowerUp.Promise;

TrelloPowerUp.initialize({
  'card-buttons': (t, options) => {
    return [{
      text: 'Awesome Button',
    }];
  }, 'show-settings': (t, options) =>{
    return t.popup({
      title: 'Settings',
      url: './settings.html',
      height: 184 // we can always resize later, but if we know the size in advance, its good to tell Trello
    });
  }
});

我开始为这个项目增加一点复杂性，我的习惯是使用 tdd/ 编写单元测试。我不知道这段代码是如何可测试的。

在我运行 mocha 测试之前，有没有办法提供一个模拟的“TrelloPowerUp”全局对象？我试过了：

TrelloPowerUp = {}
require('./client.js');

（client.js 脚本在导入后立即运行...）不出所料，这不起作用。

我想我可以从另一个确实有单元测试的文件中导入，以尽量减少不可测试的代码，例如：

从“./TrelloInitActions”导入 TrelloInitActions

const Promise = TrelloPowerUp.Promise;

TrelloPowerUp.initialize({
  'card-buttons': TrelloInitActions.initButtons
}, 'show-settings': TrelloInitActions.showSettings
});

提前感谢您的帮助！

【问题讨论】：

标签： javascript unit-testing iframe trello

【解决方案1】：

为了解决这个问题，我正在使用 react，如果你发现自己处于这种情况，请查看 https://www.npmjs.com/package/trello-react-scripts

【讨论】：