vendredi 26 août 2016

ReactTestRenderer: lib to find elements inside tree

I have the following code for my test

import React from 'react';
import renderer from 'react/lib/ReactTestRenderer';

import Accordion from '../../src/js/components/Accordion';
import AccordionPanel from '../../src/js/components/AccordionPanel';

// needed because this:
// http://ift.tt/2bTSbrm
jest.mock('react-dom');

describe('Accordion', () => {
  it('has correct default options', () => {
    const component = renderer.create(
      <Accordion>
        <AccordionPanel heading="First Title">
          <p>test</p>
        </AccordionPanel>
      </Accordion>
    );
    let tree = component.toJSON();
    expect(tree).toMatchSnapshot();
  });
});

Now I would like to call an onClick function in a property inside a children. I'm wondering if there is a lib that would be able to walk through the component.toJSON() tree and find an element given a query. For example:

findAllByType(tree, 'header');

The return of this call would be an array of header elements inside the tree.

I could create a recursive function to walk through the tree but I'm wondering if there is a lib out there that does it for me. I tried looking around but I could not find any.

Other possible utility functions for this would be:

  • findFirstByType(tree, type)
  • findAllByClassName(tree, className)
  • findFirstByClassName(tree, className)
  • findAllBy(tree, field, value)
  • findFirstBy(tree, field, value)

Aucun commentaire:

Enregistrer un commentaire