Redux 在测试是否调用了操作创建者时，如何避免测试实现细节？

我是测试新手，我正在为使用Redux的大型React应用程序编写测试，我正在尝试遵循React测试库的“避免测试实现细节”理念

但我不确定在测试动作创建者是否被正确调用时如何进行。我计划单独测试动作创建者，因此不需要确保他们在这种上下文中调度动作

假设我有一个要管理的项目列表。如果我删除或创建了一个，作为一个用户，我希望看到列表中的更改。我可以通过使组件断开连接并将jest spy作为动作创建者传递来轻松测试动作创建者是否被调用，但这将测试实现细节（在我的例子中还有其他缺点）。如果我想以一种模拟用户预期行为的方式对此进行测试，我需要action creator实际将其操作发送到reducer并更改存储。这需要一个单独的测试API，它有自己的问题。重构动作创建者以检查他们是否被测试调用，从而跳过常规API调用，这不是一个好的选择

---

在这里最好的方法是什么？我怀疑我有点想得太多了，有一个简单的解决方案，但到目前为止我还没有找到或想出任何办法。

我就是这样做的。首先，我会跟随设置我的测试。我将呈现显示列表并连接到存储的组件

此时，我将使用

fireEvent

模拟与应用程序交互的用户。例如，您可以模拟单击按钮来删除项目。一旦我模拟了点击，动作将被调度，商店将被更新，应用程序将被重新呈现。然后我会检查列表是否正确更新

/*
In this test I'm assuming the output of List is something like this:
<ol>
  <li>Foo <button>Delete Foo</button></li>
  <li>Bar <button>Delete Bar</button></li>
  <li>Baz <button>Delete Baz</button></li>
</ol>
*/
test('It's possible to remove elements from the list', () => {
  const { getByText, queryByText } = renderWithRedux(<List />)
  expect(getByText('Foo')).toBeInTheDocument()
  fireEvent.click(getByText('Delete Foo'))
  expect(queryByText('Foo')).not.toBeInTheDocument()
})

/*
在本测试中，我假设List的输出如下：
Foo删除Foo
栏删除栏
删除Baz
*/
test（'可以从列表中删除元素'，（）=>{
const{getByText，queryByText}=renderWithRedux（）
expect（getByText（'Foo'））.toBeInTheDocument（）
fireEvent.click（getByText（'Delete Foo'））
expect（queryByText（'Foo'））.not.toBeInTheDocument（）
})