5

I want to unit test with Jest and Enzyme if my <Text /> tag correctly receives props.header as text.

Usually I was able to test the content of the <Text /> tag like this:

it("should render a label", () => {
  expect(wrapper.find(Text).contains("submit")).toBe(true);
});

But as soon as I pass an object this is no longer possible. Let me show you:

const createTestProps = props => ({
  header: SOME_CONSTANT,
  ...props
});

...

  let wrapper;
  let props;
  beforeEach(() => {
    props = createTestProps();
    wrapper = shallow(<MyList {...props} loaded={false} />);
  });

  it("should render a header", () => {
    expect(wrapper.find(Text).contains(props.header)).toBe(true);
  });

This fails with the following error message:

● MyList › rendering › still loading › should render a header

    expect(received).toBe(expected) // Object.is equality

    Expected: true
    Received: false

How could I test this using Jest and Enzyme?

Edit

I found out that it has something to do passing a constant to the props. If I hardcode the value of props like this:

const createTestProps = props => ({
  header: "Some hardcoded value",
  ...props
});

The test also passes. Is there a way to make this work even with a constant?

halfer
  • 19,824
  • 17
  • 99
  • 186
J. Hesters
  • 13,117
  • 31
  • 133
  • 249
  • If SOME_CONSTANT is a string variable, it should behave exactly the same. I wonder if the contents of SOME_CONSTANT are different from what you expect. Can you share a whole file that reproduces the error? – stone Jul 29 '18 at 04:50
  • @stone unfortunately I can't, because of a busy schedule. But the constant is literally just defined like this: `SOME_CONSTANT="This is the text."` and it's being imported correctly (since I can console.log it). – J. Hesters Jul 29 '18 at 11:56

0 Answers0