Svelte 商店和笑话

Question

我正在寻找一种方法来模拟 Svelte 组件中使用的存根存储，特别是使用自动订阅语法（即 或$myStore）$myStore.property。

我尝试了几种不同的模拟，主要遵循以下原则：

jest.mock('./stores/users', () => ({
  currentUser: jest.fn().mockImplementation(() =>
    writable({
      isAdmin: true,
    }),
  ),
}));

对于任何未定义的自动订阅的商店引用，测试都会出错。例如，如果我"../../stores/users"像这样从我的组件中引用商店......

{#if $user.isAdmin}
  <div>Hello I'm an admin</div>
{/if}

...然后我收到TypeError: Cannot read property 'isAdmin' of undefined

看来即使在模拟 Svelte 商店时，$自动订阅语法也没有破坏测试。我应该指出，在记录模拟存储时，存在预期的 Svelte 存储方法（ subscribe()、set()和），并且执行该方法也会按预期公开该属性。update()subscribe()isAdmin

我似乎找不到任何处理 Svelte 和商店使用的已建立的单元测试模式，因此有关该主题的任何和所有输入将不胜感激！

Answer 1

该$快捷方式是 svelte 独有的。您无法在精简应用程序之外访问它。

但是，您可以使用get从 svelte/store 导出的函数来实现相同的操作，该函数将订阅、读取并立即取消订阅，就像$您要使用的快捷方式一样：

import { get } from 'svelte/store'
import store from './stores/users' //- change to your path

const user = get(store)
expect(user.isAdmin).toEqual(true)