ReactTestUtils - Check Component or Element Type

Monday, 14 November 2016 | Posted by
This is the child article of ReactTestUtils - Tutorial. In this article, I will explain how to Check Component or Element Type. Here we can verify

Verify DOM Component

General HTML components are DOM Components. It can be verified with isDOMComponent function. Below example finds element with h1 tag. isDOMComponent function returns true 
it('Verify Dom Component', function () {
    var root = TestUtils.renderIntoDocument(<Root/>);
    var rootElm = TestUtils.findRenderedDOMComponentWithTag(root, 'h1');
    expect(TestUtils.isElement(rootElm)).toEqual(false);
    expect(TestUtils.isDOMComponent(rootElm)).toEqual(true);
    expect(TestUtils.isCompositeComponent(rootElm)).toEqual(false);
});

Verify Composite Component

User defined React element is Composite component. Here SubRoot is user defined React element, It can be verified using isCompositeComponent
it('Verify Composite Type', function () {
    var root = TestUtils.renderIntoDocument(<Root/>);
    var rootElm = TestUtils.findRenderedComponentWithType(root, SubRoot);

    expect(TestUtils.isElement(rootElm)).toEqual(false);
    expect(TestUtils.isDOMComponent(rootElm)).toEqual(false);

    expect(TestUtils.isCompositeComponent(rootElm)).toEqual(true);
    expect(TestUtils.isCompositeComponentWithType(rootElm, SubRoot)).toEqual(true);
});

Labels:

2 comments:

  1. walsheila17 March 2020 at 02:42

    This comment has been removed by the author.

    ReplyDelete
  2. walsheila2 August 2020 at 00:20

    Very interesting and helpful sharing, thank you very much.Street View Online

    ReplyDelete

Subscribe to: Post Comments (Atom)

Blogroll

Follow this blog by Email

Popular Posts