测试连接的组件是否不呈现值或有用的信息。 React / Redux

Question

我有一个连接的组件，看起来像这样：

import React from "react";
...
import { reduxForm, Field } from "redux-form";
import FormTextField from "../../../components/FormFields/FormTextField";
...

const ExposureEditTable = ({ initialValues, classes }) => {
  return initialValues.exposures.map((exposure, index) => {
    return (
      <TableRow
        className={classes.locationLevelAnalysisTableBodyTableRow}
        key={index}
      >
        <TableCell className={classes.locationLevelAnalysisBodyTableCell}>
          <Field name={`exposures[${index}].left`} component={formTextField} />
        ...

        <TableCell
          numeric
          className={classes.locationLevelAnalysisBodyTableCell}
        >
          <Field
            name={`locationNumberOfBldgs[${exposure.locationIndex}]`}
            component={formTextField}
            type="number"
            validate={[greaterThanOrEqualToZero]}
          />
        </TableCell>
      </TableRow>
    );
  });
};

export default reduxForm({ form: "exposures" })(
  withStyles(styles)(ExposureEditTable)
);

这是我的测试设置：

import React from "react";
import { shallow, } from "enzyme";
import ExposureEditTable from "../../../../locationLevelAnalysis/components/exposures/ExposureEditTable";
import { reduxForm } from "redux-form";
import { Provider } from "react-redux";
import configureStore from "redux-mock-store";

describe("ExposureEditTable", () => {
  const bbLocationSubmissionFields = {
    ElevationFeet: 100,
    NumBuildingsFromThirdPartyData: 1,
  };

  const dummyExposureData = [
    {
      locationIndex: 0,
      wildfireRiskScore: 100,
      left: "Left Street",
      right: "Right Street",
      front: "Front Store",
      back: "Back Parking Lot",
      bbLocationSubmissionFields: bbLocationSubmissionFields,
    },
    {
      locationIndex: 1,
      wildfireRiskScore: 200,
      left: "Left Street",
      right: "Right Street",
      front: "Front Convenience Store",
      back: "Back Parking Lot",
      bbLocationSubmissionFields: bbLocationSubmissionFields,
    },
  ];

  const mockLocationNumberOfBldgs = [undefined, 7];

  let exposureTableWrapper;

  beforeEach(() => {
    const initialState = {};
    const middlewares = [];
    const mockStore = configureStore(middlewares);
    const store = mockStore(initialState);
    const defaultProps = {
      store,
      initialValues: {
        exposures: dummyExposureData,
        locationNumberOfBldgs: mockLocationNumberOfBldgs,
      },
    };

    const FormDecoratedComponent = reduxForm({
      form: "testExposures",
    })(ExposureEditTable);

    exposureTableWrapper = shallow(
      <Provider store={store}>
        <FormDecoratedComponent {...defaultProps} />
      </Provider>
    );
  });

  it("renders a row with each building's exposures data", () => {
    expect(exposureTableWrapper).toMatchSnapshot();
  });
});

但是我的快照看起来空着，没有用。我不仅希望将传入的值作为初始值，而且还希望在文本字段中看到这些值。为什么以这种方式呈现？这是快照：

+<ReduxForm
+  initialValues={
+    Object {
+      "exposures": Array [
+        Object {
+          "back": "Back Parking Lot",
+          "bbLocationSubmissionFields": Object {
+            "ElevationFeet": 100,
+            "NumBuildingsFromThirdPartyData": 1,
+          },
+          "front": "Front Store",
+          "left": "Left Street",
+          "locationIndex": 0,
+          "right": "Right Street",
+          "wildfireRiskScore": 100,
+        },
+        Object {
+          "back": "Back Parking Lot",
+          "bbLocationSubmissionFields": Object {
+            "ElevationFeet": 100,
+            "NumBuildingsFromThirdPartyData": 1,
+          },
+          "front": "Front Convenience Store",
+          "left": "Left Street",
+          "locationIndex": 1,
+          "right": "Right Street",
+          "wildfireRiskScore": 200,
+        },
+      ],
+      "locationNumberOfBldgs": Array [
+        undefined,
+        7,
+      ],
+    }
+  }
+  store={
+    Object {
+      "clearActions": [Function],
+      "dispatch": [Function],
+      "getActions": [Function],
+      "getState": [Function],
+      "replaceReducer": [Function],
+      "subscribe": [Function],
+    }
+  }

我在做什么错了？

其他快照如下：

</WithStyles(TableRow)>,
  <WithStyles(TableRow)
    className="ExposureViewTable-locationLevelAnalysisTableBodyTableRow-7"
    key="1"
>
    <WithStyles(TableCell)
        className="ExposureViewTable-locationLevelAnalysisBodyTableCell-11"
        numeric={true}
    >
        **100**
    </WithStyles(TableCell)>
    <WithStyles(TableCell)
        className="ExposureViewTable-locationLevelAnalysisBodyTableCell-11"
    >
        Left Street
  ...

上面显示的值（粗体）