Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Change in _owner causes issues with shallow rendered tests

See original GitHub issue

There appears to have been a change in how _owner is generated between 0.13 and 0.14 which is causing a number of our shallow rendered tests to fail when upgrading because the deepEquals fails on the _owner property. Here is a simple example component which exhibits the issue.

'use strict';

fdescribe('ComponentTest', function() {

  it('passes in 0.13 but fails in 0.14', function() {
    var components = {};
    components.tester = React.createClass({

      getInitialState: function() {
        return this.generateState();
      },

      generateState: function() {
        var state = {};
        state.body = (
          <ul className="foo">
            <li><div>Item 1</div></li>
            <li>Item 2</li>
          </ul>);
        return state;
      },

      render: function() {
        return (
          <div className="foo">
            {this.state.body}
          </div>);
      }
    });

    var shallowRenderer = testUtils.createRenderer();
    shallowRenderer.render(<components.tester />);
    var output = shallowRenderer.getRenderOutput();

    assert.deepEqual(output,
      <div className="foo">
        <ul className="foo">
          <li><div>Item 1</div></li>
          <li>Item 2</li>
        </ul>
      </div>);
  });
});

    AssertionError: expected { '$typeof': 60103,
      type: 'div',
      key: null,
      ref: null,
      props: 
       { className: 'foo',
         children: 
          { '$typeof': 60103,
            type: 'ul',
            key: null,
            ref: null,
            props: [Object],
            _owner: [Object],
            _store: {} } },
      _owner: null,
      _store: {} } to deeply equal { '$typeof': 60103,
      type: 'div',
      key: null,
      ref: null,
      props: 
       { className: 'foo',
         children: 
          { '$typeof': 60103,
            type: 'ul',
            key: null,
            ref: null,
            props: [Object],
            _owner: null,
            _store: {} } },
      _owner: null,
      _store: {} }

Issue Analytics

State:
Created 8 years ago
Comments:7 (1 by maintainers)

Top GitHub Comments

1reaction

gaearoncommented, Apr 14, 2016

This should be fixed by #6362.

0reactions

vfilcommented, Apr 9, 2016

I prefer applying a monkey patch, until we have this fixed in react by wrapping TestUtils in my own module:

function render(component) {
    const renderer = TestUtils.createRenderer()
    renderer.render(component)
    return patch(renderer.getRenderOutput())
}

function fixOwner(obj) {
    return obj._owner ? Object.assign({}, obj, {_owner: null}) : Object.assign({}, obj)
}

function patch(obj) {
    if (Array.isArray(obj)) {
        return obj.map(comp => {
            return fixChildren(comp)
        })
    } else {
        obj = fixOwner(obj)
        if (obj.props && typeof obj.props.children === 'object') {
            obj.props = fixOwner(obj.props)
            obj.props.children = fixChildren(obj.props.children)
        }
        return obj
    }
}

https://gist.github.com/vfil/81049b1590aa3b9e439188a49a5d67bc