Failing Test in Reaktion Anwendung

Question

Ich bin Tests für meine Anwendung zu schreiben. Ich mache es das erste Mal und habe ein paar Probleme. Wenn ich Tests durchführe bekomme ich Fehler..Fail ist auf dem Bild unten. Was ich machen muss? Ich benutze einen Mokka und ein Enzym.

Code of Test

import 'jsdom-global/register'; 
 
import React from 'react'; 
 
import {mount, shallow} from 'enzyme'; 
 
import {expect} from 'chai'; 
 

 
import Header from '../../src/components/Header'; 
 
import Link from '../../src/components/Link'; 
 

 

 
describe ('',() => { 
 
    it('should have a logo image', function() { 
 
    const wrapper = mount(); 
 
    expect(wrapper.find('img')).to.have.length(1); 
 
    }); 
 
});

Und Code meiner Komponente:

class Header extends React.Component { 
 
    static propTypes = { 
 
    intl: intlShape.isRequired, 
 
    }; 
 

 
    componentDidMount() { 
 
    this.searchbox.refs.queryField.focus(); 
 
    } 
 

 
    render() { 
 
    return (
 
     <div className={s.root}> 
 
     <div className={s.container}> 
 
      <img className={s.alphaRibbon} src={alphaRibbon} alt="alpha" width="50px" /> 
 
      <Link className={s.brand} to="/"> 
 
      <img src={logoUrl2x} srcSet={`${logoUrl2x} 2x`} width="67" height="38" alt="8kolo" /> 
 
      <span className={s.brandTxt}> 
 
       <FormattedMessage {...messages.brand} /> 
 
      </span> 
 
      </Link> 
 
      <Navigation className={s.nav} /> 
 
      <div className={s.search}> 
 
      <SearchBoxRedirect 
 
       ref={sb => { this.searchbox = sb; }} 
 
       hitsRoute="/" 
 
       searchOnChange 
 
       placeholder={this.props.intl.formatMessage(messages.searchPlaceholder)} 
 
       prefixQueryFields={['full_name']} 
 
      /> 
 
      </div> 
 
      {/* <LanguageSwitcher /> */} 
 
     </div> 
 
     {/* <div className={s.banner}> 
 
      <div className={s.container}> 
 
      <FormattedMessage tagName="p" {...messages.bannerDesc} /> 
 
      </div> 
 
     </div>*/} 
 
     </div> 
 
    ); 
 
    } 
 
} 
 

 
export default withStyles(s)(injectIntl(Header));

Answer 1

Sie sind n ot Befestigungskomponente. Sie sollten die Komponente als Argument an übergeben.

const wrapper = mount();

Sollte sein:

const wrapper = mount(<Header />);