score:3

Accepted answer

i solved my problem by wrapping everything on my test with act. i believe that this error was happening because part of the test was wrapped in act, but the async part wasn't, so the change was happening outside the scope of this function.

here is the updated test, that is passing:

import react from 'react';
import themehandler from './theme-handler';

import { mockedprovider, wait } from '@apollo/react-testing';
import { getbrandthemedocument } from '../../generated/graphql';
import { button } from '@material-ui/core';
import { mount } from 'enzyme';
import { act } from 'react-dom/test-utils';

describe('theme handler', () => {
  const originalenv = process.env;

  beforeeach(() => {
    // https://stackoverflow.com/questions/48033841/test-process-env-with-jest/48042799
    jest.resetmodules();
    process.env = { ...originalenv };
    delete process.env.react_app_brand;
  });

  aftereach(() => {
    process.env = originalenv;
  });

  it('should use a theme retrieved from the backend', async () => {
    process.env.react_app_brand = '39';

    await act(async () => {
      const mocks = [
        {
          request: {
            query: getbrandthemedocument,
            variables: { brandid: 39 },
          },
          result: {
            data: {
              brandtheme: {
                brandthemecolor: [
                  { key: 'primarycolor', value: '#182335' },
                  { key: 'darkprimarycolor', value: '#161f2f' },
                ],
              },
            },
          },
        },
      ];

      const wrapper = mount(
        <mockedprovider mocks={mocks} addtypename={false}>
          <themehandler>
            <button color='primary' id='test-obj'>
              hello world!
            </button>
          </themehandler>
        </mockedprovider>
      );

      expect(wrapper).tobetruthy();

      await wait(0);

      wrapper.update();
      expect(wrapper.find('#test-obj')).tobetruthy();
    });
  });
});

Related Query

More Query from same tag