Komponententest react-redux connected Komponenten mit Mocha/Chai

Question

Ich versuche eine verbundene Komponente zu testen, die ich sowohl als eine verbundene Komponente als auch als eine einfache wie der Vorschlag here von Ashwin Van Dijk exportiert habe.

Alle meine Tests für dumme Komponenten funktionieren gut, und die App läuft gut (die verbundene Komponente funktioniert).

Die Komponente ist ziemlich einfach-nur eine Liste von Staat abgerufen Anzeige:

über CSS

import React, { Component } from 'react'; 
import { connect } from 'react-redux'; 
import * as actions from '../actions'; 
import Plot from './plot'; 
import Spinner from 'react-spinkit'; 

export class Dashboard extends Component { 
    componentWillMount() { 
     this.props.fetchMessage(); 
     this.props.fetchPlots(); 
    } 

    render() { 
     const plots = this.props.plots; 
     if (plots === undefined) { 
      return (
       <div className="dashboard loading"> 
        <Spinner name="three-bounce" /> 
       </div> 
      ); 
     } 

     return (
      <div className='container-fluid dashboard'> 
       **(all my stuff lives here)** 
      </div> 
     ); 
    } 
} 

function mapStateToProps(state) { 
    return { 
     message: state.auth.message, 
     plots: state.auth.plots 
    } 
} 

export default connect(mapStateToProps, actions)(Dashboard); 

Der Test nicht einmal Lauf es gibt mir einen komisch aussehenden Fehler:

C:\Users\BaruchKogan\Documents\Visual Studio 2017\Projects\TrellisReact\node_modules\loaders.css\loaders.css:14 
@-webkit-keyframes scale { 
^ 
SyntaxError: Invalid or unexpected token 
    at createScript (vm.js:56:10) 
    at Object.runInThisContext (vm.js:97:10) 
    at Module._compile (module.js:542:28) 
    at Module._extensions..js (module.js:579:10) 
    at Object.require.extensions.(anonymous function) [as .js] (C:\Users\BaruchKogan\Documents\Visual Studio 2017\Projects\TrellisReact\node_modules\babel-register\lib\node.js:152:7) 
    at Module.load (module.js:487:32) 
    at tryModuleLoad (module.js:446:12) 
    at Function.Module._load (module.js:438:3) 
    at Module.require (module.js:497:17) 
    at require (internal/module.js:20:19) 
    at Object.<anonymous> (C:\Users\BaruchKogan\Documents\Visual Studio 2017\Projects\TrellisReact\node_modules\react-spinkit\dist\index.js:40:3) 
    at Module._compile (module.js:570:32) 
    at Module._extensions..js (module.js:579:10) 
    at Object.require.extensions.(anonymous function) [as .js] (C:\Users\BaruchKogan\Documents\Visual Studio 2017\Projects\TrellisReact\node_modules\babel-register\lib\node.js:152:7) 
    at Module.load (module.js:487:32) 
    at tryModuleLoad (module.js:446:12) 
    at Function.Module._load (module.js:438:3) 
    at Module.require (module.js:497:17) 
    at require (internal/module.js:20:19) 
    at Object.<anonymous> (C:/Users/BaruchKogan/Documents/Visual Studio 2017/Projects/TrellisReact/src/components/dashboard.js:5:1) 
    at Module._compile (module.js:570:32) 
    at loader (C:\Users\BaruchKogan\Documents\Visual Studio 2017\Projects\TrellisReact\node_modules\babel-register\lib\node.js:144:5) 
    at Object.require.extensions.(anonymous function) [as .js] (C:\Users\BaruchKogan\Documents\Visual Studio 2017\Projects\TrellisReact\node_modules\babel-register\lib\node.js:154:7) 
    at Module.load (module.js:487:32) 
    at tryModuleLoad (module.js:446:12) 
    at Function.Module._load (module.js:438:3) 
    at Module.require (module.js:497:17) 
    at require (internal/module.js:20:19) 
    at Object.<anonymous> (C:/Users/BaruchKogan/Documents/Visual Studio 2017/Projects/TrellisReact/test/components/dashboard_test.js:2:1) 
    at Module._compile (module.js:570:32) 
    at loader (C:\Users\BaruchKogan\Documents\Visual Studio 2017\Projects\TrellisReact\node_modules\babel-register\lib\node.js:144:5) 
    at Object.require.extensions.(anonymous function) [as .js] (C:\Users\BaruchKogan\Documents\Visual Studio 2017\Projects\TrellisReact\node_modules\babel-register\lib\node.js:154:7) 
    at Module.load (module.js:487:32) 
    at tryModuleLoad (module.js:446:12) 
    at Function.Module._load (module.js:438:3) 
    at Module.require (module.js:497:17) 
    at require (internal/module.js:20:19) 
    at C:\Users\BaruchKogan\Documents\Visual Studio 2017\Projects\TrellisReact\node_modules\mocha\lib\mocha.js:220:27 
    at Array.forEach (native) 
    at Mocha.loadFiles (C:\Users\BaruchKogan\Documents\Visual Studio 2017\Projects\TrellisReact\node_modules\mocha\lib\mocha.js:217:14) 
    at Mocha.run (C:\Users\BaruchKogan\Documents\Visual Studio 2017\Projects\TrellisReact\node_modules\mocha\lib\mocha.js:469:10) 
    at loadAndRun (C:\Users\BaruchKogan\Documents\Visual Studio 2017\Projects\TrellisReact\node_modules\mocha\bin\_mocha:360:22) 
    at rerun (C:\Users\BaruchKogan\Documents\Visual Studio 2017\Projects\TrellisReact\node_modules\mocha\bin\_mocha:387:5) 
    at C:\Users\BaruchKogan\Documents\Visual Studio 2017\Projects\TrellisReact\node_modules\mocha\bin\_mocha:395:7 
    at StatWatcher.<anonymous> (C:\Users\BaruchKogan\Documents\Visual Studio 2017\Projects\TrellisReact\node_modules\mocha\lib\utils.js:174:9) 
    at emitTwo (events.js:106:13) 
    at StatWatcher.emit (events.js:191:7) 
    at StatWatcher._handle.onchange (fs.js:1501:10) 

Irgendwelche Gedanken?

Answer 1

Es sieht so aus, als ob Mocha versucht, eine CSS-Datei als Javascript zu laden. Ich habe dieses Problem in der Vergangenheit mithilfe von Ignorierstilen gelöst. Siehe: https://stackoverflow.com/a/34375878/379358

(verschobene Kommentar pro Anfrage)