Testing GoJS with Enzyme

I’ve built a React wrapper around my GoJS Diagram and I’m trying to write some tests using the enzyme framework. I’m continually running into an issue where the test is failing because it cannot find the <div> in the DOM that GoJS is trying to attach too.

I’ve been using the “mount” option in Enzyme that says it should support full rendering. I’m assuming that the enzyme testing framework has not fully created (or will not create) the <div> in the DOM. I’m wondering if anybody else has had the same problem and if so, how did you solve it?

Out of all honesty, I’m new to enzyme and in a way a rookie with React. So I could be doing something wrong.

Diagram.test.js

import React from 'react';
import Diagram from '../Diagram';
import { mount } from 'enzyme';

describe('Diagram (GoJS)', () => {
  it('should render correctly', () => {
    const output = mount(<Diagram/>);
    expect(output.ref('goJsDiv')).toMatchSnapshot();
  });
});

Error Message:

Diagram (GoJS) › should render correctly
Invalid DIV id; could not get element with id: goJsDiv

I’m completely unfamiliar with Enzyme, sorry. But in your app does <Diagram/> expand to <div></div>?

If it is possible I suggest that you try passing a reference to the HTML DIV element directly rather than trying to give it an id and passing that id when building the Diagram.