javascript - 迁移到 TypeScript 后 Jest 测试无法正常工作

Question

最近，我将一个项目从普通的旧式 JavaScript 迁移到了 TypeScript。以前每个测试都运行良好。更改后，一些测试用例就崩溃了，我不明白为什么。我将 Vue.js 与 vue-test-utils 和 jest 一起使用。

jest.config.js

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 支持。但是，我不知道什么依赖组合会导致错误的行为。

我更新了相关依赖项，这最终会导致更多失败的测试。

• 开 Jest
• ts-开 Jest
• babel Jest

Answer 1

添加

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

到 jest.config.js，因为您将 ts-jest 与 babel-jest 一起使用。 Source .