轉移到 TypeScript 后 Jest 測試不起作用

Question

最近我將一個項目從普通的舊 JavaScript 轉移到了 TypeScript。 以前每個測試都運行良好。 更改后，一些測試用例剛剛中斷，我不明白為什么。 我將 Vue.js 與vue-test-utils和jest一起使用。

開玩笑的配置文件

module.exports = {
    collectCoverageFrom: [
        '/src/**/*.{js,jsx,vue}',
        '!**/node_modules/**',
        '!**/vendor/**',
    ],
    moduleFileExtensions: [
        'ts',
        'js',
        'json',
        'vue',
    ],
    transform: {
        '.*\\.(vue)$': 'vue-jest',
        '^.+\\.js$': 'babel-jest',
        '^.+\\.ts$': 'ts-jest',
    },
    transformIgnorePatterns: [
        '<rootDir>/node_modules/(?!vuex-class-modules).+\\.js$',
    ],
    moduleNameMapper: {
        '^@/(.*)$': '<rootDir>/src/$1',
    },
    setupFilesAfterEnv: [
        '@testing-library/jest-dom/extend-expect',
    ],
};

現在失敗的示例測試的片段，之前一直運行良好。

some.test.js

function mountStore(loggedInState) {
    const store = new Vuex.Store({
        modules: {
            customer: {
                namespaced: true,
                state: {
                    isLoggedIn: loggedInState,
                },
                actions,
            },
        },
    });

    return shallowMount(Component, {
        localVue,
        store,
        router,
        stubs: { 'router-link': RouterLinkStub },
    });
}

describe('Test with customer logged in at beginning', () => {
    let wrapper;

    beforeEach(() => {
        wrapper = mountStore(true);
    });

    it('should redirect to home if user is logged in on init', () => {
        expect(wrapper.vm.$route.name).toBe('Home');
    });
});

關於這個特定的測試用例，結果如下。

expect(received).toBe(expected) // Object.is equality

Expected: "Home"
Received: null

我還注意到升級所有依賴項（包括一些 Jest 依賴項）會導致更多失敗的測試。 所以我希望（可能）是原因，因為我稍后才添加了 TypeScript 支持。 但是，我不知道什么依賴組合會導致錯誤的行為。

我已經更新了相關的依賴項，這最終會導致更多失敗的測試。

• 笑話
• 笑話
• babel-jest

Answer 1

您是否嘗試添加@types/jest ？ 並將其添加到您的tsconfig.json ：

"types": ["@types/node", "@nuxt/types", "@types/jest", "nuxt-i18n"]

Answer 2

添加

preset: 'ts-jest/presets/js-with-babel',

到jest.config.js因為您將ts-jest與babel-jest 。 來源。