test method with jest and react-testing-library

Question

i can´t get the answer, how cant reach the method inside a functional component iin react using jest and react-testing-library.

I tried with enzyme but i see all is changing to RTL.

import React from "react";

const simpleComponents = (props) => {

    const simpleMethod = () =>{ 
        // method logic
    };

    return <h1>test</h1>;
    };
}

export default simpleComponents;

Answer 1

You should try to test only what your user would see in a real browser, and not your component internal logic. This is what react-testing-library promotes : writing tests that give confidence because they see/do what a real user would.

https://testing-library.com/docs/guiding-principles

Following these guidelines, you should try to build a test which triggers user interactions on visible elements (rendered by your component), and which would involve the execution of simpleMethod.

This is the whole point of react-testing-library queries : getByText, getByPlaceholder, getByRole : things that a real user would see, hiding internal logic. But I guess you could have this approach with Enzyme (I never used Enzyme).

Writing tests with this approach leads to less tests, but stronger ones, which IMHO is a good thing. It is quite different from classical unit tests (say in a Java context for example) where you tests functions, inputs, outputs...

In fact your React component is a function, its inputs are user interactions, its output is a DOM.