Question

我正在尝试为React应用编写单元测试用例。我使用formik处理表单提交。在formik形式中，我们使用formik的FieldArray组件。如何为此编写测试用例？

import React from "react"
import { shallow } from "enzyme"
import { AdditionalCustomFields } from "./index"
import { additionalData, customFieldData} from "../../../../mockData"
import { settingStyles } from "../../../../../common/Styles"
import { withStyles } from "@material-ui/core/styles"
import PropTypes from "prop-types"


const props = {
       values : {
        additionalData,
        customFieldData
       }
}

const Composer = ({ classes}) =>{
    return <AdditionalCustomFields classes={classes} {...props}/>
}

Composer.propTypes = {
    classes: PropTypes.object.isRequired
  }

const Composition = withStyles(settingStyles)(Composer)

describe("Composer",()=>{
     const wrapper = shallow(<Composition />).dive().find(AdditionalCustomFields).shallow()

     it("Describe CustomFieldForm component",()=>{
         console.log("sub component========>", wrapper.debug())
    })
})

我得到的不是我的组件结构：-

PASS src/pages/Settings/components/Application/components/CustomFields/components/CustomFieldForm/component/AdditionalCustomFields/AdditionalCustomFields.test.js
  ● Console

    console.log src/pages/Settings/components/Application/components/CustomFields/components/CustomFieldForm/component/AdditionalCustomFields/AdditionalCustomFields.test.js:31
      sub component========> <WithStyles(ForwardRef(Grid)) container={true}>
        <FormikConnect(FieldArrayInner) name="additionalData" render={[Function: render]} />
      </WithStyles(ForwardRef(Grid))>

如何使用react编写Formik的单元测试用例？

0 个答案: