Question

我具有从Google Analytics（分析）跟踪分析的功能。因此，在我的函数中，我需要查看代码是否存在。

Analytics.js

const gaCode = process.env.REACT_APP_GA_TRACKING_CODE;
const gaCodeExists = gaCode && gaCode.Length > 0;

function trackEvent(category = "Event", name) {
    if(gaCodeExists) {
        GoogleAnalytics.event({
            category,
            action: name,
        });
    }

    return;
}

export default {
    gaCodeExists,
    trackEvent
}

起初我是这样做的（我敢肯定我做得不好）。

describe('Testing analytics', () => {
    beforeEach(() => {
        Analytics.trackEvent(null, 'Tracking');
    });

    it('should not call google analytics', () => {
        if (!gaCodeExists) {
            const mockGoogleAnalytics = jest.fn(() => GoogleAnalytics.event);
            expect(mockGoogleAnalytics.mock.calls.length).toBe(0);
        }
    });
})

在阅读了一些博客文章并查看了stackover flow questions之后。我将其更改为这样，我认为我在模仿gaCodeExists变量，如下所示。

import constants from '../index';
import { isUsingGoogleAnalytics } from '../index';

describe('Analytics Testing', () => {
    it('Should test trackEvent', () => {
        constants.isUsingGoogleAnalytics = true;
        expect(constants.isUsingGoogleAnalytics).toBe(true);
    });
});

现在，我被困在trackEvent函数上如何进行测试。如何将模拟gaCodeExists变量应用于该变量？测试用例将是gaCodeExists是否为expect(mockFunction).toHaveBeenCalled(1)。

P.S：我是测试新手。

Answer 1

您的gaCodeExists在加载js文件时将值分配给变量。 trackEvent函数并非纯函数，因为它依赖于其范围之外的值。建议您使函数纯净，以便以正确的方式对其进行测试。由于这是GA实现，因此您只需将gaCodeExists转换为函数并在测试中对其进行模拟。

将您的gaCodeExists更改为方法

const gaCodeExists = () => {
  if(process && process.env && process.env.REACT_APP_GA_TRACKING_CODE) {
    const gaCode = process.env.REACT_APP_GA_TRACKING_CODE;
    return gaCode && gaCode.Length > 0;
  }
  return false;
}

将trackEvent函数更改为

function trackEvent(category = "Event", name) => {
  if(gaCodeExists()) { // note this line
    GoogleAnalytics.event({
      category,
      action: name,
    });
  }
  return;
}

现在您可以通过模拟gaCodeExists函数进行测试

import * as analytics from "../index";

describe('Testing analytics', () => {
  beforeEach(() => {
    const gaMock = jest.spyOn(analytics, "gaCodeExists");
  });

  it('should not call google analytics', () => {
    gaMock.mockImplementation(() => false);
    // check what happens when it doesn't call GA
  });

  it('should call google analytics', () => {
    gaMock.mockImplementation(() => true);
    // check what happens when it calls GA
  });

})

我尚未测试此代码。因此，请仔细检查其是否正在按预期进行。

Answer 2

const gaCode = process.env.REACT_APP_GA_TRACKING_CODE;
const gaCodeExists = gaCode && gaCode.Length > 0;

function trackEvent(category = "Event", name, gaCodeExists) {
    if(gaCodeExists) {
        GoogleAnalytics.event({
            category,
            action: name,
        })
    }
}

export default {
    gaCodeExists,
    trackEvent
}

首先像这样更改您的Google Analytics（分析）代码，您的测试文件应类似于

import { UsingGoogleAnalytics } from '../index'  // i don't know what this file is
import { gaCodeExistsis, trackEvent } from './Analytics'

describe('Analytics Testing', () => {

    beforeEach(() => {
       expect(gaCodeExists).toHaveBeenCalledWith(true)
       expect(trackEvent).toEqual(jasmine.any(Function))
    })

    it('track event was called without params', () => { 
        expect(trackEvent()).toBe(1); // replace 1 with desire output without params
    })

    it('track event was called with params', () => { 
        expect(trackEvent("somecategory", "somename", gaCodeExistsis)).toBe(1); // replace 1 with desire output with params
    })
});

使用条件语句对功能进行单元测试

2 个答案: