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并在运行时下载（因为我们有不同的开发与生产密钥）。

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

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

应该创建组件FAILED

ReferenceError：ga未定义

at new MyBusesComponent（webpack：///src/pages/my-buses/my-buses.component.ts:33：6＆lt; - karma-test-shim.js：138419：9）

at new Wrapper_MyBusesComponent（/DynamicTestModule/MyBusesComponent/wrapper.ngfactory.js:7:18）

at CompiledTemplate.proxyViewClass.View_MyBusesComponent_Host0.createInternal（/DynamicTestModule/MyBusesComponent/host.ngfactory.js:15:32）

........

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

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

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

我感谢任何建议！请随时查看我在上面链接的回购中的代码，并询问您需要的任何后续操作。谢谢！

Answer 1

您声明了var ga，但这只是为了让TypeScript感到满意。在运行时，ga从一些外部脚本变为全局。但是这个脚本不包含在测试中。

你可以做的只是将（模拟）函数添加到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将获取所有每个调用的参数并将它们放在单独的数组中。

ReferenceError：未定义ga [Ionic 2.2使用Karma进行单元测试]

1 个答案: