how to execute test for "simple" sample custom widget?

534
5
Jump to solution
07-10-2021 02:45 PM
by Anonymous User
Not applicable

Hello All,

I'm trying to run the test provided w/ the sample custom widget "simple".  

I'm assuming that I need to create a package.json and install some dependencies but not clear on what and I don't see documentation on jimu-for-test.

Can someone please point me in the right direction?

Thanks!

--john

 

 

 

 

 

 

 

1 Solution

Accepted Solutions
by Anonymous User
Not applicable

Thanks again Grant.  It seemed like I just had to re-arrange the imports in client/jimu-for-test/setup-jest.js to:

require('jest-fetch-mock').enableMocks()
const { System } = require('systemjs');
global.systemRegister = System.register;
const Enzyme = require('enzyme');
const Adapter = require('@wojtekmaj/enzyme-adapter-react-17')
Enzyme.configure({ adapter: new Adapter() });

View solution in original post

5 Replies
Grant-S-Carroll
Esri Contributor

There are already scripts in the package.json to run the tests. 

You can execute them using the following commands by executing them in the client folder.

npm run test

or 

for the watch

npm run test:watch

I've pushed these both out in to .bat files to make it simpler to execute them. I;ve been writing a few tests recently and was planning on putting together a cheat sheet on the complications I've found so far when wrting unit tests for custom widgets.

 

Hope that helps

 

 

 

0 Kudos
by Anonymous User
Not applicable

Thanks for your suggestion Grant.  When I try, I get the error:

 FAIL  your-extensions/widgets/simple/tests/simple-widget.test.tsx
  ● Test suite failed to run

    TypeError: global.systemRegister is not a function

 

0 Kudos
Grant-S-Carroll
Esri Contributor

Hi John

Right, sorry about that. Looks like there is an issue with the setup-test.js file under the folder, client/jimu-for-test/setup-jest.js

I've modifed this to match what I have in ExB 1.2 see below, basically commented out the Enzyme imports.

 

require('jest-fetch-mock').enableMocks()
const { System } = require('systemjs');
//const Enzyme = require('enzyme');
//const Adapter = require('@wojtekmaj/enzyme-adapter-react-17')
//Enzyme.configure({ adapter: new Adapter() });

global.systemRegister = System.register;

 

 

I havent had a chance to dig any deeper, but i suspect its and issue with the Enzyme or Adapter imports. What this means that in your tests you may have to import them like below.

 

import { React } from 'jimu-core';
import _Widget from '../src/runtime/widget';
import { widgetRender, wrapWidget } from 'jimu-for-test';

//Configure Enzyme here
const Enzyme = require('enzyme');
const Adapter = require('@wojtekmaj/enzyme-adapter-react-17')
Enzyme.configure({ adapter: new Adapter() });

const render = widgetRender();
describe('test simple widget', () => {
  it('simple test', () => {
    const Widget = wrapWidget(_Widget, {
      config: {exampleConfigProperty: 'a'},
    });
    const {queryByText} = render(<Widget widgetId="Widget_1" />);
    expect(queryByText('exampleConfigProperty: a').tagName).toBe('P');
  })
});

 

 

However, with the above changes I was able to get the out of the box test to run.

 

Cheers

by Anonymous User
Not applicable

Thanks again Grant.  It seemed like I just had to re-arrange the imports in client/jimu-for-test/setup-jest.js to:

require('jest-fetch-mock').enableMocks()
const { System } = require('systemjs');
global.systemRegister = System.register;
const Enzyme = require('enzyme');
const Adapter = require('@wojtekmaj/enzyme-adapter-react-17')
Enzyme.configure({ adapter: new Adapter() });
Grant-S-Carroll
Esri Contributor

Nice, will update my 1.4 instance to match.

Cheers

0 Kudos