web-dev-qa-db-ja.com

Mocksを使用してJestとTypeScriptでテストする

TypeScriptとJestを使って、AngularとIonicアプリケーションの一部のコンポーネントをテストしようとしていますが、問題はAngularまたはIonic。そのため、Jestのモック機能を機能させようとしています。

私は単純にダミーのクラスを作成しており、関数の応答をモックして動作をオーバーライドできるかどうかを確認しようとしています。

jest-mock.ts

_export class AClass {
    constructor() { }

    GetOne():any {
        return  1;
    }

    GetTwo():any {
        return 2;
    }
}
_

jest-mock.spec.ts

_import { AClass } from './jest-mock';

// const mockGet = jest.fn( () => { return 3; } );  // Tried this to return 3?
const mockGet = jest.fn();
jest.mock('./jest-mock', () => {
    return jest.fn().mockImplementation( () => {
        return { GetOne: mockGet };
    });
});

describe('Testing Jest Mock is working', () => {
    it('should support mocking out the component', () => {
        expect(mockGet).toBeTruthy();
        expect(mockGet).toBe(3);                // Mocked Value
    });
});
_

私は単純に、関数の結果を変更できるテストを作成しようとしているため、他の実際のテストコードでモックを使用して、テストの結果を提供します。

モックTestObject = new AClass();からクラスを作成しようとすると

_TypeError: _jestMock.AClass is not a constructor
_

上記で定義したテストでは、次のエラーが表示されます。

_expect(received).toBe(expected)
    Expected value to be (using Object.is):
      3
    Received: 
      [Function mockConstructor]
    Difference:
       Comparing two different types of values. Expected number but received function.
_
8
Steven Scott

他の参考文献を確認しながら、私はなんとか模擬テストを機能させることができました。 jest-mocks.spec.tsを次のように変更しました。

jest.mock('./jest-mock', () => {
    return {                          // Define Function Mock Return Values
        GetOne: jest.fn( () => 3 )
    }
});
const MockObject = require('./jest-mock');

describe('mock function', () => {
    it('should create mock', () => {
        expect(jest.isMockFunction(MockObject.GetOne)).toBeTruthy();
    });

    it('should return mock values', () => {
        expect(MockObject.GetOne()).toBe(3);
        expect(MockObject.GetOne).toHaveBeenCalled();
        expect(MockObject.GetTwo).toBeUndefined();
    });
});
6
Steven Scott