如何对使用getContext的组件进行单元测试?

时间:2019-08-17 16:53:18

标签: svelte

我正在尝试对调用getContext的组件进行单元测试,但是我不知道如何从单元测试中设置上下文。我尝试创建一个设置上下文的包装器组件,但是嵌套的组件没有看到上下文值。我可以通过console.log看到Wrapper.svelte正确接收了contexts.foo属性,但是单元测试(和Nested.svelte中的console.log)报告上下文值为undefined

我的测试:

import Wrapper from './Wrapper.svelte';
import Nested from './Nested.svelte';
import { render, cleanup } from '@testing-library/svelte';
beforeEach(cleanup);

describe('Nested', () => {
  it('Should render the context', () => {
    const { getByText } = render(Wrapper, {
      props: { component: Nested, contexts: { foo: 'foo' } },
    });
    expect(getByText('foo'));
  });
});

Wrapper.svelte:

<script>
  import {setContext} from 'svelte';

  const {contexts, component, ...props} = $$props;

  setContext('foo', contexts.foo);

</script>

<svelte:component this={component} {...props} />

Nested.svelte

<script>
  import {getContext} from 'svelte';
  const foo = getContext('foo');
</script>

<p>{foo}</p>

我也尝试在Wrapper.svelte内部使用动态导入,但这也不起作用。

0 个答案:

没有答案