ReferenceError: ga is not defined [Ionic 2.2 Unit Testing With Karma]

Question

我正在向我管理的 Ionic 2.2.0 应用程序添加单元测试，但我的组件在测试时遇到 Google Analytics 代码时崩溃。我使用Ionic's official unit testing example 作为基础，my current progress can be seen on our public repo。

我的项目使用 Google Analytics，它被添加到 HTML 中并在运行时下载（因为我们有不同的开发密钥和生产密钥）。

初始化 Analytics 的代码在我的main.ts 中，它设置了一个全局变量ga，随后可在整个应用程序中使用。

我正在开始测试应用的第一页，它使用 Analytics。当我运行测试时，我遇到了以下错误

组件创建失败

ReferenceError: ga 未定义

在新的MyBusesComponent (webpack:///src/pages/my-buses/my-buses.component.ts:33:6

在新的 Wrapper_MyBusesComponent (/DynamicTestModule/MyBusesComponent/wrapper.ngfactory.js:7:18)

在 CompiledTemplate.proxyViewClass.View_MyBusesComponent_Host0.createInternal (/DynamicTestModule/MyBusesComponent/host.ngfactory.js:15:32)

........

这是因为 main.ts 似乎没有被加载或执行，我认为 TestBed 是故意这样做的。我没有有实际的 Google Analytics 对象当然更好，但是组件确实需要一个名为 ga 的函数。

因此，我的问题如下：如何在我的测试配置中创建 Google Analytics 的 ga 变量，以便在测试时将其传递给我的组件？

我尝试从我的mocks 文件中导出一个函数并将其添加到我的规范文件中的imports 或providers 数组中，但无济于事。

感谢任何建议！请随时在我上面链接的仓库中检查我的代码，并询问您需要的任何后续行动。谢谢！

Answer 1

您声明了 var ga，但这只是为了让 TypeScript 高兴。在运行时，ga 从一些外部脚本变成全局的。但是这个脚本没有包含在测试中。

您可以做的只是将 (mock) 函数添加到 window 以进行测试。您可能可以在您的 karma-test-shim.js 中执行此操作。

window.ga = function() {}

或者，如果您想测试组件是否使用正确的参数调用函数，您可以在使用该函数的每个测试中单独添加该函数。例如

beforeEach(() => {
  (<any>window).ga = jasmine.createSpy('ga');
});

afterEach(() => {
  (<any>window).ga = undefined;
})

然后在你的测试中

it('..', () => {
  const fixture = TestBed.creatComponent(MyBusesComponent);

  expect(window.ga.calls.allArgs()).toEqual([
    ['set', 'page', '/my-buses.html'],
    ['send', 'pageview']
  ]);
})

由于您在构造函数中多次调用ga，Spy.calls 将获取所有每个调用的参数并将它们放入单独的数组中。