我正在尝试对调用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内部使用动态导入,但这也不起作用。