Playing around with Segment Analytics testing using Jest in TypeScript

Question

Playing around with Segment Analytics testing using Jest in TypeScript

I've been struggling to write a unit test that verifies if the .track method of Analytics is being called. Despite my efforts, the test keeps failing, even though invoking the function through http does trigger the call. I'm unsure if I've incorrectly mocked it, or if there is another underlying issue?

index.ts:

import { Request } from "../types"
import { getSecret } from "../src/secrets"
import Analytics from "analytics-node"

const logger = (req: Request) => {
    const analytics = new Analytics(<string>process.env.WRITE_KEY);
    return analytics.track({
        userId: req.userId
    });
}

export default logger

index.test.ts:

jest.mock('analytics-node');
import { Request } from "../types"
import logger from "./index"
import Analytics from "analytics-node"

const mockAnalytics = new Analytics(process.env.WRITE_KEY = 'test');

describe('Logger tests', () => {
    it(`Should call analytics.track`, () => {
        const request: Request = {
            userId: 23
        }
        return logger(request).then(() => {
            expect(mockAnalytics.track).toHaveBeenCalled()
        });
    });
});

javascript typescript unit-testing jestjs tdd

Answer 1

Answer №1

Utilizing the concept of Automatic mock involves invoking jest.mock('analytics-node').

By calling jest.mock('analytics-node'), you are provided with a convenient "automatic mock" that can be utilized to monitor calls to the class constructor and its methods. This action replaces the ES6 class with a mock constructor and substitutes all methods with mock functions that consistently yield undefined. The method calls can be accessed via
theAutomaticMock.mock.instances[index].methodName.mock.calls
.

Example:

index.ts:

import Analytics from 'analytics-node';

export interface Request {
  userId: string | number;
}

const logger = (req: Request) => {
  const analytics = new Analytics(<string>process.env.WRITE_KEY);
  return analytics.track({
    userId: req.userId,
    anonymousId: 1,
    event: '',
  });
};

export default logger;

index.test.ts:

import logger, { Request } from './';
import Analytics from 'analytics-node';

jest.mock('analytics-node');
const mockAnalytics = Analytics as jest.MockedClass<typeof Analytics>;

describe('Logger tests', () => {
  afterAll(() => {
    jest.resetAllMocks();
  });
  it(`Should call analytics.track`, () => {
    const WRITE_KEY = process.env.WRITE_KEY;
    process.env.WRITE_KEY = 'test key';
    const request: Request = {
      userId: 23,
    };
    logger(request);
    expect(mockAnalytics).toBeCalledWith('test key');
    expect(mockAnalytics.mock.instances[0].track).toHaveBeenCalled();
    process.env.WRITE_KEY = WRITE_KEY;
  });
});

Result of unit test:

 PASS  examples/87654321/index.test.ts
  Logger tests
    ✓ Should call analytics.track (4 ms)

----------|---------|----------|---------|---------|-------------------
File      | % Stmts | % Branch | % Funcs | % Lines | Uncovered Line #s 
----------|---------|----------|---------|---------|-------------------
All files |     100 |      100 |     100 |     100 |                   
 index.ts |     100 |      100 |     100 |     100 |                   
----------|---------|----------|---------|---------|-------------------
Test Suites: 1 passed, 1 total
Tests:       1 passed, 1 total
Snapshots:   0 total
Time:        5.954 s

Answer 2

Utilizing the concept of Automatic mock involves invoking jest.mock('analytics-node').

By calling jest.mock('analytics-node'), you are provided with a convenient "automatic mock" that can be utilized to monitor calls to the class constructor and its methods. This action replaces the ES6 class with a mock constructor and substitutes all methods with mock functions that consistently yield undefined. The method calls can be accessed via
theAutomaticMock.mock.instances[index].methodName.mock.calls
.

Example:

index.ts:

import Analytics from 'analytics-node';

export interface Request {
  userId: string | number;
}

const logger = (req: Request) => {
  const analytics = new Analytics(<string>process.env.WRITE_KEY);
  return analytics.track({
    userId: req.userId,
    anonymousId: 1,
    event: '',
  });
};

export default logger;

index.test.ts:

import logger, { Request } from './';
import Analytics from 'analytics-node';

jest.mock('analytics-node');
const mockAnalytics = Analytics as jest.MockedClass<typeof Analytics>;

describe('Logger tests', () => {
  afterAll(() => {
    jest.resetAllMocks();
  });
  it(`Should call analytics.track`, () => {
    const WRITE_KEY = process.env.WRITE_KEY;
    process.env.WRITE_KEY = 'test key';
    const request: Request = {
      userId: 23,
    };
    logger(request);
    expect(mockAnalytics).toBeCalledWith('test key');
    expect(mockAnalytics.mock.instances[0].track).toHaveBeenCalled();
    process.env.WRITE_KEY = WRITE_KEY;
  });
});

Result of unit test:

 PASS  examples/87654321/index.test.ts
  Logger tests
    ✓ Should call analytics.track (4 ms)

----------|---------|----------|---------|---------|-------------------
File      | % Stmts | % Branch | % Funcs | % Lines | Uncovered Line #s 
----------|---------|----------|---------|---------|-------------------
All files |     100 |      100 |     100 |     100 |                   
 index.ts |     100 |      100 |     100 |     100 |                   
----------|---------|----------|---------|---------|-------------------
Test Suites: 1 passed, 1 total
Tests:       1 passed, 1 total
Snapshots:   0 total
Time:        5.954 s

Answer 3

Answer №2

When you include the

"@segment/analytics-next": "1.49.2"

let analyticsService: AnalyticsBrowser | null | undefined;

export const loadAnalyticsService = (props?: LoadAnalyticsProps): typeof analyticsService => {
    if ((analyticsService && analyticsService.instance?.initialized) || !props) {
        return analyticsService;
    }
    const { segmentAnalyticsKey, anonymousId, userId } = props;

    if (!segmentAnalyticsKey) {
        return null;
    }

    analyticsService = AnalyticsBrowser.load({ writeKey: segmentAnalyticsKey });
    analyticsService.setAnonymousId(anonymousId);
    analyticsService.identify(userId);

    return analyticsService;
};

Mocking the functions

const setAnonymousIdTest = jest.fn();
const identifyTest = jest.fn();

jest.mock("@segment/analytics-next", () => {
    const originalModule = jest.requireActual("@segment/analytics-next");

    return {
        __esModule: true,
        ...originalModule,
        AnalyticsBrowser: {
            load: () => {
                return {
                    setAnonymousId: setAnonymousIdTest,
                    identify: identifyTest,
                    instance: {
                        initialized: true
                    }
                };
            }
        }
    };
});

Answer 4

When you include the

"@segment/analytics-next": "1.49.2"

let analyticsService: AnalyticsBrowser | null | undefined;

export const loadAnalyticsService = (props?: LoadAnalyticsProps): typeof analyticsService => {
    if ((analyticsService && analyticsService.instance?.initialized) || !props) {
        return analyticsService;
    }
    const { segmentAnalyticsKey, anonymousId, userId } = props;

    if (!segmentAnalyticsKey) {
        return null;
    }

    analyticsService = AnalyticsBrowser.load({ writeKey: segmentAnalyticsKey });
    analyticsService.setAnonymousId(anonymousId);
    analyticsService.identify(userId);

    return analyticsService;
};

Mocking the functions

const setAnonymousIdTest = jest.fn();
const identifyTest = jest.fn();

jest.mock("@segment/analytics-next", () => {
    const originalModule = jest.requireActual("@segment/analytics-next");

    return {
        __esModule: true,
        ...originalModule,
        AnalyticsBrowser: {
            load: () => {
                return {
                    setAnonymousId: setAnonymousIdTest,
                    identify: identifyTest,
                    instance: {
                        initialized: true
                    }
                };
            }
        }
    };
});

Playing around with Segment Analytics testing using Jest in TypeScript

Answer №1

Answer №2

Similar questions

Tips for managing nested objects within React state and keeping them updated

Is there a way to incorporate an 'ended' feature into the .animate() function?

Arrange the JSONB data type with sequelize literal in your order

Module lazily loaded fails to load in Internet Explorer 11

Having issues with the $addToSet method in my MongoDB API implementation

Ways to invoke a prop function from the setup method in Vue 3

Combining multiple meteor servers into a single database collection (local)

Is React failing to insert a span element in the client-side code?

Exploring the power of V-for with checkboxes in VueJS

What is the process for generating an alert box with protractor?

Using Jquery to add new HTML content and assign an ID to a variable

Encountering an issue while attempting to extract an ACF field in WordPress using JavaScript

What is the best approach to passing multiple variables to a JavaScript function in HTML/PHP?

Module 'xlsx' cannot be located

When would you recommend setting localStorage in an Angular application?

Tips for showing HTML content in an Angular UI grid

Is it true that TypeScript prohibits the presence of circular references under the condition of having generic parameters

Issue: Attempting to access the `userName` property on an undefined object (`tem`), resulting in a TypeError while using flalist

Issue with Angular 18 component not being displayed or identified

Endless Google Locations Instances