UseEffect not called in child component after parent state update in Enzyme test

Viewed 111

I'm trying to test a click event using Enzyme and Jest. I have a parent component with [isX, setIsX] = useState(false) that is passed into a child component. The child component has:

useEffect(() => {
    console.log("effect");
    async function A() {
        if (isX) {
            ...
        }
    }
    A();
}, [isX])

I have a button in the parent component that calls setIsX(true) on click and I have confirmed that the test executes that code with console.log. However, in the child component useEffect is never called. I am using enzyme for the test. The wrapper is initialized with:

const div = document.createElement('div')
document.body.appendChild(div);
const wrapper = mount(component, { attachTo: div });
...

(the attachTo is necessary for a separate reason) and then I simulate the click. I've tried enzyme's wrapper.update() but the console.log in useEffect never shows up. I am new to React/enzyme, and any help is appreciated. Thanks.

Edit: I've confirmed that the props do change in the child component after calling wrapper.update() but useEffect still not called.

0 Answers
Related