tests with withState + React.createRef() takes unusually long or hangs

[niksosf]

I have this problem with
"react": "^16.3.0",
"recompose": "^0.27.0",
"babel-jest": "^22.4.3",

//Test.js
import React from "react";
import PropTypes from "prop-types";
import { withState } from "recompose";

const enhance = withState("x", "setX", "hi");
export const _Test = ({ prop, x, setX }) => {
  const rate = React.createRef();
  return (
    <div>
      <input ref={rate} />
    </div>
  );
};
_Test.propTypes = {
  prop: PropTypes.string.isRequired
};

// export const Test = enhance(_Test);
export const Test = enhance(_Test);

//Test.spec.js
// @flow
import React from "react";
import { shallow, mount } from "enzyme";
import sinon from "sinon";

import { Test } from "./Test";

describe("<TEst /> Component", function() {
  const setup = () => {
    const props = {
      prop: "hello there"
    };
    const output = mount(<Test {...props} />);
    return {
      output,
      props
    };
  };

  it("should render correctly", () => {
    const { output } = setup();
    expect(output).toMatchSnapshot();
  });
});

when run with jest Test.spec.js it takes almost 5s and often time hangs forever.

But with either 1) not using withState or 2) not using ref, the test finishes in a reasonable 1.5s.

Does anyone else have the same problem?

[istarkov]

And what you expect writing this here?
Without examples, without anything?
I close this as description is useless somehow. Feel free to reopen providing examples etc

[niksosf]

I clicked the "Submit" button by accident.
To answer your question, I expected to provide an example and can be (hopefully) reproduced the error quickly on those who would want to look into the issue.

[niksosf]

Do re-open.

[istarkov]

Possibly because enzyme still not support latests versions of React?

[niksosf]

I will add two more examples that might suggest otherwise.

[istarkov]

enzymejs/enzyme#1553 (comment)
seems like current enzyme have serious issues with createRef etc

[niksosf]

"enzyme": "^3.1.1",

// Test.js 
// No withState involvement, just a regular ref enabled stateless functional component.  
import React from "react";
import PropTypes from "prop-types";
//import { withState } from "recompose";

// const enhance = withState("x", "setX", "hi");
export const _Test = ({ prop, x, setX }) => {
  const rate = React.createRef();
  return (
    <div>
      <input ref={rate} />
    </div>
  );
};
_Test.propTypes = {
  prop: PropTypes.string.isRequired
};

export const Test = _Test;

jest Test.spec.js finishes in 1.7s

// Test.js 
// ref not being used in an input, but does have withState call
import React from "react";
import PropTypes from "prop-types";
import { withState } from "recompose";

const enhance = withState("x", "setX", "hi");
export const _Test = ({ prop, x, setX }) => {
  const rate = React.createRef();
  return (
    <div>
      hello, no input using refs here
    </div>
  );
};
_Test.propTypes = {
  prop: PropTypes.string.isRequired
};

// export const Test = _Test;
export const Test = enhance(_Test);

jest Test.spec.js finishes in 1.482s

[niksosf]

@istarkov Good find, it may very well have to do with it. I will keep an eye on that issue then.

[istarkov]

IMO its enzyme problem, try to write tests using react test utils https://reactjs.org/docs/test-utils.html
naked jsdom etc