These are chat archives for airbnb/enzyme

16th
Nov 2017
Dimitris Karagiannis
@mkarajohn
Nov 16 2017 13:05

@andrecalvo I faced a similar issue a few days ago.

The way I got it working so far is by installing require-hacker as a dev dependency, and then in the setup I execute this:

import requireHacker from 'require-hacker';

const svgComponent = `
  class SVG extends require('react').Component {
    render() {
      return require('react').createElement('svg');
    }
  }
`;

requireHacker.hook('svg', () => `module.exports = ${svgComponent}`);
also commented out the line require.extensions['.svg'] = noop
Andre
@andrecalvo
Nov 16 2017 14:57
Thanks @mkarajohn, will give it a try and get back to you :)
Renato Augusto Gama dos Santos
@renatoagds
Nov 16 2017 16:00
@andrecalvo You could try this setup (https://github.com/airbnb/enzyme/issues/253#issuecomment-216272991) that will mock your images inside your test.
Andre
@andrecalvo
Nov 16 2017 16:18
@mkarajohn that worked a charm! Thanks so much. @renatoagds thanks for the suggestion!
Shanon Jackson
@ShanonJackson
Nov 16 2017 20:21
Hey guys, been stuck on this problem for like 1 whole day now.
How can i access styles of a react 16 component within a enzyme test. Alot of our components use themeing.
it seems everything fails, getting inline-styles is easy but i want to get styles applied by a stylesheet.
tried.....
getComputedStyle(enzyme.getDomNode()), getDomNode.style everything you could imagine nothing is giving me anything more than inline styles
willing to import any library that solves this problem its been destroying me
Jordan Harband
@ljharb
Nov 16 2017 21:15
@shanonjackson why are you looking at styles in tests anyways/
?
JJ
@ohmyjersh
Nov 16 2017 23:27
I am trying to shallow render a component to assert on some components that should be visible, but I have seeing this error.... : Cannot read property 'have' of undefined
it works just fine with snapshot testing.
it('renders EmailSearchActivity with no search results', () => { const wrapper = shallow( <EmailSearchActivity {...{ results: null, isLoading: false }} /> ); expect(wrapper.find(SearchBar)).to.have.length(1); expect(wrapper.find(SearchResultsTable)).to.have.length(0); expect(wrapper.find(NoResults)).to.have.length(1); });
is the test ^^
JJ
@ohmyjersh
Nov 16 2017 23:37
nevermind, using chai syntax... need jest :(