Testing with updating context value

[ThanhPhat1080]

How can I get the updated value from context. In my case, I have a button, when I click on button, the data-context is update then UI update too, I don't know how to get the updated data-context and checking is UI update success or not.

Here is my code get from example

function useTestContext () {
  const state = useContext(ThemeContext);
  return state;
};

function testHookWithThemeProvider(callback) {
  return render(
    <ThemeProvider>
       <Form />
       <TestHook callback={callback} />
    </ThemeProvider>
  );
}

test('Context update',() => {
  let updateState;

  const { container, rerender } = testHookWithThemeProvider(() => {
    updateState = useTestContext();
  });

})

const button = container.querySelector('button.btn');
fireEvent.click(button);

// I not sure implement this rerender here.
rerender(
  <ThemeProvider>
    <Form />
    <TestHook 
      callback={() => { updateState = useTestContext(); }} 
    />
  </ThemeProvider>
)

expect(button.className).toEqual('btn dark');
// Fail. Still the same as initial. 

[ThanhPhat1080]

I resolved it by using rerender method right way. I don't need to pass variable to the rerender, just only call it.

...
const button = container.querySelector('button.btn');
fireEvent.click(button);
rerender();
expect(button.className).toEqual('btn dark'); // pass

Thanks.