how-to-test.jsx

// generic ui component
class Panel {
  render() {
    return <div>
      <b>{this.props.title}</b>
      <p>{this.props.body}</p>
    </div>;
  }
}

// Component I want to test...
class ComponentToTest {
  get title() {
    return <div>
      title text
    </div>;
  }

  get body() {
    return <div>
      body text
    </div>;
  }

  render() {
    return <div>
      <Panel title={this.title} body={this.body} />
    </div>;
  }
}

it('does a thing', () => {
  const wrapper = shallow(<ComponentToTest />);
  /*
    here, since wrapper shallow doesn't render <Panel />, it won't put the title
    and body on the page. Is there a way to test this WITHOUT manually testing the
    body/title methods by hand (I still want to render the whole component) and WITHOUT
    manually finding the panel element and calling its render method or specific methods
    on it?
    
    Changing the API of panel is an option
  */
});