TypeError：プロパティ 'apply'が未定義の場合

Question

反応コンポーネントをテストできません。以下は私のsetup.jsのコードを書いています - 設定ファイルとエラーテキスト。

require('babel-register')(); 
 

 
var jsdom = require('jsdom').jsdom; 
 

 
var exposedProperties = ['window', 'navigator', 'document']; 
 

 
global.document = jsdom(''); 
 
global.window = document.defaultView; 
 
Object.keys(document.defaultView).forEach((property) => { 
 
    if (typeof global[property] === 'undefined') { 
 
    exposedProperties.push(property); 
 
    global[property] = document.defaultView[property]; 
 
    } 
 
}); 
 

 
global.navigator = { 
 
    userAgent: 'node.js' 
 
}; 
 
// 
 
var documentRef = document; 
 

 
// 
 
process.env.NODE_ENV = 'test'; 
 

 
function noop() { 
 
    return null; 
 
} 
 

 
require.extensions['.css'] = noop; 
 
require.extensions['.scss'] = noop; 
 
require.extensions['.md'] = noop; 
 
require.extensions['.png'] = noop; 
 
require.extensions['.svg'] = noop; 
 
require.extensions['.jpg'] = noop; 
 
require.extensions['.jpeg'] = noop; 
 
require.extensions['.gif'] = noop;

テストコード。これは非常に簡単なテストで、それが失敗した。（

編集。私のコンポーネントのコードは以下の通りです。同型スタイル・ローダー\ libに\ \

import React from 'react'; 
 
import {mount, shallow} from 'enzyme'; 
 
import {expect} from 'chai'; 
 

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

 

 

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

WithStyles.componentWillMountで

（node_modules node_modulesでwithStyles.j は\反応-DOM \ LIB \ ReactCompositeComponent.js：348：23 measureLifeCyclePerfで （node_modules \反応-DOM \ LIB \ ReactCompositeComponent.js：75：12）

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

あなたは、CSSファイルへの依存関係を解決するために同型スタイル・ローダーでのWebPACKを使用しているが、あなたは右、あなたのテストのセットアップでのWebPACKを使用していませんか？テスト設定でスタイルロードをエミュレートするには、css-modules-require-hookを試してみてください。