玩笑打破了从未为测试导入的模块

时间:2020-01-28 08:47:51

标签: javascript vue.js jestjs styled-components babel-jest

我无法终生弄清楚为什么会发生这种情况,这显然与玩笑如何加载组件进行测试有关,因为它似乎试图构建index.js文件中找到的所有组件,然后所有组件导入到该组件,然后这些组件的所有组件共享一个index.js文件。但是为什么会这样,我不明白,因为这不是在ES6中定义命名导出的方式,并且由于从未隔离加载组件,因此也使得实际单元测试组件极为困难。而且必须重构我们的整个代码库才能运行测试,而在产品中一切正常时,这似乎是我们无法采取的极端措施。有人可以帮忙吗?

NB:明确地说-这与错误undefined is not allowed for styled tag type.无关,也不涉及如何解决-问题是此错误出现在模块中,而该模块从未在被测试的组件中使用过,也不在测试中-因此该测试中不应出现该错误。

〜/ TestComponent.vue

  <p>Test</p>
</template>

<script>
export default {
  name: "test-component",
};
</script>

〜/ __ tests __ / TestComponent.spec.js

import { shallowMount, createLocalVue } from '@vue/test-utils';
import Vuex from 'vuex';

const localVue = createLocalVue();

localVue.use(Vuex);

describe("TestComponent.vue", () => {
    it('works', () => {
        const wrapper = shallowMount(TestComponent);
        expect(wrapper).toMatchSnapshot();
    })
})

〜/ index.js

export { default as TestComponent } from './TestComponent.vue';
export { default } from './SearchScreen.vue';

测试结果:

  ● Test suite failed to run

    undefined is not allowed for styled tag type.

      83 |   `}
      84 | `;
    > 85 | const StyledBacknavigation = styled(MainNav)`
         |                              ^
      86 |   ${({ theme: { mainMenu } }) => css`
      87 |     font-family: ${mainMenu.fontFamily};
      88 |   `}

      at styled (node_modules/vue-styled-components/lib/constructors/styled.js:21:13)
      at Object.<anonymous> (resources/assets/js/fragments/MainMenu/MainMenu.components.js:85:30)
      at Object.<anonymous> (resources/assets/js/fragments/MainMenu/index.js:1:1)
      at Object.<anonymous> (resources/assets/js/components/Layout/SoHeader.components.js:10:1)
      at resources/assets/js/components/Layout/SoHeader.vue:35:1
      at Object.<anonymous> (resources/assets/js/components/Layout/SoHeader.vue:116:3)
      at Object.<anonymous> (resources/assets/js/components/Layout/index.js:3:1)
      at Object.<anonymous> (resources/assets/js/components/index.js:21:1)
      at Object.<anonymous> (resources/assets/js/fragments/FeaturedList/FeaturedList.components.js:1:1)
      at Object.<anonymous> (resources/assets/js/fragments/FeaturedList/index.js:1:1)
      at Object.<anonymous> (resources/assets/js/fragments/index.js:1:1)
      at Object.<anonymous> (resources/assets/js/screens/SearchScreen/SearchScreen.components.js:1:1)
      at Object.<anonymous> (resources/assets/js/screens/SearchScreen/index.js:1:1)
      at Object.<anonymous> (resources/assets/js/screens/SearchScreen/__tests__/TestComponent.spec.js:1:1)

0 个答案:

没有答案
相关问题