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.

`closest` return a wrapper with `length: 1` even with unmatched `selector`

See original GitHub issue

const wrapper = shallow(
    React.createElement('div', { className: 'foo' },
        React.createElement('div', { className: 'bar' })
    )
);

console.log(
    wrapper.find('.bar').closest('.fooooo')
);

{
  root:
   ShallowWrapper {
     root: [Circular],
     unrendered:
      { '$$typeof': Symbol(react.element),
        type: 'div',
        key: null,
        ref: null,
        props: [Object],
        _owner: null,
        _store: {} },
     renderer:
      { _instance: null,
        render: [Function: render],
        getRenderOutput: [Function: getRenderOutput] },
     node:
      { '$$typeof': Symbol(react.element),
        type: 'div',
        key: null,
        ref: null,
        props: [Object],
        _owner: null,
        _store: {} },
     nodes: [ [Object] ],
     length: 1,
     options: {} },
  unrendered: null,
  renderer: null,
  node: undefined,
  nodes: [ undefined ],
  length: 1,
  options: {} }

Dummy ShallowWrapper is ok, but length should be 0.

Issue Analytics

State:
Created 8 years ago
Reactions:3
Comments:5

Top GitHub Comments

1reaction

anthonatorcommented, May 26, 2017

I’m seeing this as well.

const wrapper = shallow(
  React.createElement('div', { className: 'foo' },
    React.createElement('div', { className: 'bar' }),
  ),
);

console.log(wrapper.find('.fooooo').length); // 0
console.log(wrapper.find('.bar').closest('.fooooo').length); // 1

0reactions

jmnsfcommented, Sep 20, 2017

Finding this too. A workaround to make sure it’s a true match:

wrapper.closest('.fooooooo').is('.fooooooo'); // false