Enzyme shallow returns undefined for renderless component

Question

This is my js file

import React, { Component } from 'react';

export default class ProjectStore extends Component {
  static lodingCount = 0;
  constructor(props) {
    super(props);
  }

  static setLodingCount(countValue){
    ProjectStore.lodingCount = countValue;
  }

  static getLodingCount(){
    return ProjectStore.lodingCount;
  }
}

I wrote a test case for the same like below:

import React from 'react';
import {shallow} from 'enzyme';
import ProjectStore from '../projectStore.js';

describe('<ProjectStore />', () => {
  it('should return loading count', () => {
    const ProjectStore = shallow(<ProjectStore />);
    ProjectStore.setLodingCount(2);
    expect(ProjectStore.lodingCount).toEqual(2);
  });
});

but when I executed npm test it returned:

ReferenceError: ProjectStore is not defined

What am I doing wrong here?

score 1 · Accepted Answer · answered Jun 01 '18 at 06:35

1

When testing a static method from a class, you don't need to render that component. All you need to do is calling that static method from that class like the following:

import React from 'react';
import Adapter from 'enzyme-adapter-react-16';

import ProjectStore from './projectStore.js';

describe('<ProjectStore />', () => {
  it('should return loading count', () => {
    ProjectStore.setLodingCount(2);
    expect(ProjectStore.lodingCount).toEqual(2);
  });
});

You can learn more from this answer.

answered Jun 01 '18 at 06:35

Joshua

3,055
3
22
37

Thanks @konekoya working for me. One more thing can you please suggest how can I write test case for constructor method in this case. – rahul Jun 01 '18 at 06:43
@rahul That's best asked in a separate question – Nick Sep 13 '18 at 14:35

Enzyme shallow returns undefined for renderless component

1 Answers1