useLayoutEffect Issue

.mocharc.js

const { loadOptions } = require("mocha/lib/cli/options");

const options = loadOptions(process.argv.slice(2));
let spec = "tests/**/*.js";
if (options._.length) {
  spec = options._;
}

const common_config = {
  require: ["./ts-node", "config/init-config.js", "tests/test-globals.js"],
  file: [
    "tests/stub-useLayoutEffect-warnings.js",
    "tests/sinon-stub-sanity-test.js",
    "tests/test-setup.js"
  ],
  spec,
  slow: 300,
  timeout: 30000,
  exit: true,
  recursive: true
};

if (process.env.CI) {
  module.exports = {
    ...common_config,
    reporter: "dot",
    colors: true,
    bail: true,
    forbidOnly: true
  };
} else {
  module.exports = {
    ...common_config,
    slow: 10,
    reporter: "min"
  };
}

stub-useLayouteffect-warning.js

import { stub } from "sinon";

/**
 * MUI imported components trigger lots of errors due to their rendering
 * in a test environment. https://gist.github.com/gaearon/e7d97cdf38a2907924ea12e4ebdf3c85
 * This stub allows to hide those warnings; it is acceptable as they are not relevant to
 * indicate the actual health of our components
 */

// @ts-ignore
const originalConsoleError = console.error;

before(() => {
  // ref https://github.com/mui-org/material-ui/blob/e724d98eba018e55e1a684236a2037e24bcf050c/test/utils/createServerRender.js#L13
  // @ts-ignore
  stub(console, "error").callsFake((message, ...args) => {
    const isUseLayoutEffectWarning =
      /Warning: useLayoutEffect does nothing on the server/.test(message);

    if (!isUseLayoutEffectWarning) {
      // callThrough
      originalConsoleError(message, ...args);
    }
  });
});

after(() => {
  stub.restore();
});