assertion of style() for shallow()/render()

I think there is bug (or perhaps a mis-documentation) of the style() assertion, namely that it only works if you mount() the component.

describe("Chai-enzyme style test", function() {

    it("should do style test on shallow component", function() {
        const component = (
                    <p style={{color:"red"}}>Hello, World</p>
        );
        const wrapper = shallow(component);
        expect(wrapper).to.have.style("color", "red");
    });

    it("should do style test on rendered component", function() {
        const component = (
            <p style={{color:"red"}}>Hello, World</p>
        );
        const wrapper = render(component);
        expect(wrapper).to.have.style("color", "red");
    });

    it("should do style test on mounted component", function() {
        const component = (
            <p style={{color:"red"}}>Hello, World</p>
        );
        const wrapper = mount(component);
        expect(wrapper).to.have.style("color", "red");
    });
});

Result is

Chai-enzyme style test
    ✖ should do style test on shallow component
    ✖ should do style test on rendered component
    ✔ should do style test on mounted component

Finished in 0.025 secs / 0.017 secs

SUMMARY:
✔ 1 test completed
✖ 2 tests failed

FAILED TESTS:
  Chai-enzyme style test
    ✖ should do style test on shallow component
      PhantomJS 2.1.1 (Mac OS X 0.0.0)
    Window is not a constructor (evaluating '(0, _cheerio2.default)(this.wrapper.html())')
    get@/Users/.../test.spec.js:38342:44 <- webpack:///~/chai-enzyme/build/ShallowTestWrapper.js:127:0
    style@/Users/.../test.spec.js:38276:19 <- webpack:///~/chai-enzyme/build/ShallowTestWrapper.js:61:0
    /Users/.../test.spec.js:37455:37 <- webpack:///~/chai-enzyme/build/assertions/generic.js:17:0
    /Users/...test.spec.js:37907:24 <- webpack:///~/chai-enzyme/build/ChaiWrapper.js:199:0
    /Users/.../test.spec.js:32360:31 <- webpack:///~/chai/lib/chai/utils/addMethod.js:41:0
    /Users/.../test.spec.js:78:50 <- webpack:///test.spec.js:16:38

    ✖ should do style test on rendered component
      PhantomJS 2.1.1 (Mac OS X 0.0.0)
    undefined is not a constructor (evaluating '_cheerio2.default.load(html)')
    render@/Users/.../test.spec.js:19762:33 <- webpack:///~/enzyme/build/index.js:61:0
    /Users/.../test.spec.js:88:43 <- webpack:///test.spec.js:25:31

[ItsCosmo]

@dpoindexter: Thanks for a very helpful response. This solved my issue. Specifically, I removed the line: cheerio': 'window',

from externals configuration, and added the line: { test: /\.json$/, loader: "json"}

to the module.loaders configuration

[dpoindexter]

Were you using Webpack to do module bundling for karma, by any chance? I encountered essentially the same issue when using the checked assertion on a shallow render.

Enzyme’s documentation suggests configuring Webpack to treat Cheerio as an external module, which was the root cause of my problem. I was able to get it working by resolving Cheerio properly using Webpack’s JsonLoader.

If you’re not using Webpack, I don’t know what the problem is, sorry! But maybe someone else will come across this issue for the same reason I did.