1

I try to mock moment() to avoid that a snapshot-test fails based on time of day.. My <Header /> has a function that uses moment() to show different greetings (Hello, Good morning, good evening, etc)

My test function:

jest.mock('moment', () => moment().month(11).date(24)); //Should give "happy xmas"
it("Match snapshop", () => {
    act(() => {
        container = shallow(<Header />);
    });
    expect(container).toMatchSnapshot();
});

But when I run the test I get:

ReferenceError: moment_1 is not defined

If I remove jest.mock(....) the test runs, but results depends on time of day..

Lin Du
  • 88,126
  • 95
  • 281
  • 483
EirikO
  • 617
  • 8
  • 19
  • 1
    Possible duplicate of [How do I set a mock date in Jest?](https://stackoverflow.com/questions/29719631/how-do-i-set-a-mock-date-in-jest) – skyboyer Jun 03 '19 at 10:54
  • 2
    I do believe you better don't mock `moment` since you will have to re-implement in mock all its methods your code use(in consistent way). It's a lot to do. Instead you may mock global `Date`/`Date.now` to return stale value. – skyboyer Jun 03 '19 at 10:54
  • Solved with the solution from @skyboyer: jest.spyOn(global.Date, "now").mockImplementationOnce(() => new Date("2019-12-24T11:01:58.135Z").valueOf() ); – EirikO Jun 03 '19 at 11:15

1 Answers1

1

As @skyboyer said. You should mock JS native Date rather than moment module. Here is a completed demo:

index.tsx:

import React from 'react';
import moment from 'moment';

export class Header extends React.Component {
  public render() {
    const date = moment()
      .month(11)
      .date(24);

    return <div>{date.toString()}</div>;
  }
}

index.spec.tsx:

import React from 'react';
import { shallow, ShallowWrapper } from 'enzyme';
import { Header } from './';

describe('Header', () => {
  it('match snapshot', () => {
    jest.spyOn(Date, 'now').mockReturnValueOnce(new Date('2019/11/24').getTime());
    const wrapper: ShallowWrapper = shallow(<Header></Header>);
    expect(wrapper.text()).toBe('Tue Dec 24 2019 00:00:00 GMT+0800');
    expect(wrapper).toMatchSnapshot();
  });
});

index.spec.tsx.snap:

// Jest Snapshot v1

exports[`Header match snapshot 1`] = `
<div>
  Tue Dec 24 2019 00:00:00 GMT+0800
</div>
`;

Unit test result with 100% coverage report:

 PASS  src/stackoverflow/56425230/index.spec.tsx
  Header
    ✓ match snapshot (14ms)

-----------|----------|----------|----------|----------|-------------------|
File       |  % Stmts | % Branch |  % Funcs |  % Lines | Uncovered Line #s |
-----------|----------|----------|----------|----------|-------------------|
All files  |      100 |      100 |      100 |      100 |                   |
 index.tsx |      100 |      100 |      100 |      100 |                   |
-----------|----------|----------|----------|----------|-------------------|
Test Suites: 1 passed, 1 total
Tests:       1 passed, 1 total
Snapshots:   1 passed, 1 total
Time:        3.592s, estimated 7s
Lin Du
  • 88,126
  • 95
  • 281
  • 483