Extracted from https://github.com/facebook/react/issues/12643.

We're currently diff a host node in the complete phase even if it has bailed out in the begin phase. By itself, this just means we're doing a little bit more work than necessary. But it also has some observable effects. In particular, https://github.com/facebook/react/issues/13424 (which by itself would be very rare and probably not worth fixing) is made worse because we end up committing update to inputs from another component.

I have a fix for this in https://github.com/facebook/react/pull/13423. Filing this for posterity.
expect(container.innerHTML).toBe('<div>bar</div>');
  });
  it('should warn when replacing a container which was manually updated outside of React', () => {
    
    ReactDOM.render(<div key="1">foo</div>, container);
    ReactDOM.render(<div key="1">bar</div>, container);
    expect(container.innerHTML).toBe('<div>bar</div>');
    
    
    
    container.innerHTML = '<div>MEOW.</div>';
    expect(() => {
      expect(() =>
        ReactDOM.render(<div key="2">baz</div>, container),
      ).toWarnDev(
        'render(...): ' +
          'It looks like the React-rendered content of this container was ' +
          'removed without using React. This is not supported and will ' +
          'cause errors. Instead, call ReactDOM.unmountComponentAtNode ' +
          'to empty a container.',
        {withoutStack: true},
      );
    }).toThrowError();
  });
  it('should warn when doing an update to a container manually updated outside of React', () => {
    
    ReactDOM.render(<div>foo</div>, container);
    ReactDOM.render(<div>bar</div>, container);
    expect(container.innerHTML).toBe('<div>bar</div>');