React / React Native + Enzyme：如何测试一个组件是否呈现它的孩子？

Question

I have a component with which I wrap all my screens:

import React from "react";
import { SafeAreaView } from "react-native";
import { PropTypes } from "prop-types";

import styles from "./styles";

const SafeContainer = ({ children }) => {
  return <SafeAreaView style={styles.container}>{children}</SafeAreaView>;
};

SafeContainer.propTypes = {
  children: PropTypes.any
};

export default SafeContainer;

I'm currently writing it's unit tests. I would like to test if this component renders its children. How can I do this?

Here is the code that I've written (but even though the component works, the test does not pass):

import React from "react";
import { shallow } from "enzyme";
import SafeContainer from "./SafeContainer";

describe("SafeContainer", () => {
  describe("rendering", () => {
    let wrapper;
    beforeEach(() => {
      wrapper = shallow(<SafeContainer />);
    });

    it("should render a <SafeAreaView />", () => {
      expect(wrapper.find("SafeAreaView")).toHaveLength(1);
    });

    it("should render its children", () => {
      expect(wrapper.children()).toEqual(wrapper.props().children);
    });
  });
});

How could I write a test that checks if the component renders it's children?

EDIT: Through the answer from eramit I implemented this check like this:

describe("SafeContainer", () => {
  describe("rendering", () => {
    let wrapper;
    beforeEach(() => {
      wrapper = shallow(
        <SafeContainer>
          <View className="Test" />
        </SafeContainer>
      );
    });

    it("should render a <SafeAreaView />", () => {
      expect(wrapper.find("SafeAreaView")).toHaveLength(1);
    });

    it("should render its children", () => {
      expect(wrapper.find(".Test")).toHaveLength(1);
    });
  });
});

Answer 1

You could create some test child div and check.

describe("SafeContainer", () => {
  describe("rendering", () => {
    let wrapper;
    beforeEach(() => {
      const TestComponent = <SafeContainer><div className="Test"/></SafeContainer> 
      wrapper = mount(<TestComponent />);
    });

    it("should render a <SafeAreaView />", () => {
      expect(wrapper.find("SafeAreaView")).toHaveLength(1);
    });

    it("should render its children", () => {
      expect(wrapper.find(".Test")).toHaveLength(1);
    });
  });

});