Javascript 编写React/Redux时如何接近TDD

我正在使用TDD编写一个React/Redux应用程序。问题是，考虑到我想要使用的所有样板文件，如何开始编写新应用程序的第一步

根据TDD，为了通过测试，我应该只编写最少的代码，然后再进行重构。例如，我是否应该从没有Redux开始，然后重构并引入Redux？考虑到Redux的样板（stores/Reducer/wrapper元素等），我将进行相当大的重构

---

我理解TDD方法的巨大优势。问题是，是否“允许”使用超过最小代码集的更好方法来通过测试，在这种情况下..

我首选的方法是先测试react，然后根据提供给它的道具检查组件是否正确渲染

大概是这样的：

import {App} from '../../src/containers/App';
import React from 'react';
import ReactDOM from 'react-dom';
import {
  renderIntoDocument,
  scryRenderedDOMComponentsWithTag
} from 'react-addons-test-utils';
import {expect} from 'chai';

describe('Main page',() => {
  it('should show a sign-in page if isAuthenticated is false',() => {
    const component = renderIntoDocument(
      <App isAuthenticated={false}/>
    );

    const buttons = scryRenderedDOMComponentsWithTag(component,'button')

    expect(buttons.length).to.be.equal(1)

  });

  it('should show a welcome text if isAuthenticated is true',() => {
    const component = renderIntoDocument(
      <App isAuthenticated={true}/>
    );
    const text = scryRenderedDOMComponentsWithTag(component,'h1')
    expect(text).to.have.string('welcome')
  })
})

从“../../src/containers/App”导入{App}；
从“React”导入React；
从“react dom”导入react dom；
进口{
渲染文档，
SCryRenderdDomComponentSwithTag
}来自“react插件测试utils”；
从“chai”导入{expect}；
描述（'主页'，（）=>{
它（'如果isAuthenticated为false，则应显示登录页面'，（）=>{
常量组件=renderIntoDocument(
);
const buttons=scryRenderedDOMComponentsWithTag（组件，'button'）
expect（按钮长度）.to.be.equal（1）
});
它（'如果isAuthenticated为true，则应显示欢迎文本'，（）=>{
常量组件=renderIntoDocument(
);
const text=scryRenderDomComponentSwithTag（组件，'h1'）
expect（text）.to.have.string（'welcome'））
})
})

然后，我将为redux添加测试，以检查状态是否根据提供给reducer的输入而改变

---

这最终取决于您的偏好。

Redux不会影响您编写最少代码以通过每个单独测试的能力

你的个人反应组件只是拿道具和做/展示一些东西。您对这些组件的单元测试不应该关心这些道具是以标准的React方式通过的，还是通过React-redux插入的。因此，Redux的存在不会影响您以最少的代码通过React组件测试的能力

还有一些小的例外，例如将组件状态移动到Redux状态，或者更改处理副作用的方式（例如从API获取数据）。这些类型的更改可能需要对测试进行一些更改，但它们可能会使测试变得更简单

当然，如果您添加Redux，您必须为新的Redux还原器/动作创建者/选择器等编写测试，但是编写这些测试非常简单。您不会重复任何工作：无论您是否开始使用Redux，您花在编写测试上的时间都是一样的

---

关于开始使用或不使用Redux的一般概念：创建Redux的丹·阿布拉莫夫建议从简单的React开始，然后在需要时才添加Redux。

好的，这听起来很合理。我主要关心的是开始阶段，那时我还没有任何东西。我将写一个E2E测试，涵盖一个基本流程。然后，我将不得不编写最少的代码（可能是纯react组件）。然后我必须重构并添加Redux，这需要大量的样板文件（还原程序、动作创建者等）。所以，这一步是重构，我通常不会在重构时编写测试。我想知道如何实现这些步骤