Question

在useContext（）钩子中使用mobx存储时，什么是编写单元测试用例的最佳方法？我们应该使用酶还是反应测试库？这里不使用Provider或@inject（）

商店设计：

//StoreA
export class StoreA {
  rootStore: RootStore;
  constructor(rootStore: RootStore) {
    this.rootStore = rootStore;
  }
  //StoreA implementations...
}

 //StoreB
export class StoreB {
  rootStore: RootStore;
  constructor(rootStore: RootStore) {
    this.rootStore = rootStore;
  }
  //StoreB implementations...
}

//RootStore
export class RootStore {
  StoreA: StoreA;
  StoreB: StoreB;
  constructor() {
    this.storeA = new storeA(this);
    this.storeB = new storeB(this);
  }
}

export const RootStoreContext = createContext(new RootStore());

在组件存储中通过useContext挂钩使用

const SomeComponent = ({}) => {
  const rootStore = useContext(RootStoreContext);
  const { storeAdata, storeAmethods } = rootStore.storeA;
  //Component code....
}

Stackblitz链接： https://stackblitz.com/edit/react-ts-qec5vu?file=Hello.tsx

在以下情况下，

如何仅针对单个商店（具有循环依赖性）编写单元测试用例
如果使用了React测试库，如何模拟存储和useContext？
可以使用酶吗？
哪个库适合编写UTC？

Answer 1

如果您只是对商店进行单元测试，请不要使用组件。直接实例化商店并进行测试。

如果您正在测试组件交互（集成），那么我建议您使用react测试库。创建上下文提供程序，并为每个测试使用提供程序包装组件。

更多信息：https://testing-library.com/docs/example-react-context

Mobx + RootStore + useContext挂钩时的单元测试用例

1 个答案: