Ich bin neu in Mocha und versuche damit eine einfache React-Komponente zu testen. Der Test wird bestanden, wenn die Reaktionskomponente kein CSS-Design hat, aber einen Syntaxfehler auslöst, wenn das Tag in der Reaktionskomponente einen Klassennamen enthält:
Testing.react.js
import React from 'react';
export default class Testing extends React.Component {
render() {
return (
<section>
<form>
<input type="text" />
</form>
</section>
);
}
}
testing.jsx
import {
React,
sinon,
assert,
expect,
TestUtils
} from '../../test_helper';
import TestingSample from '../../../app/components/Testing.react.js';
describe('TestingSample component', function(){
before('render and locate element', function(){
var renderedComponent = TestUtils.renderIntoDocument(
<TestingSample />
);
var inputComponent = TestUtils.findRenderedDOMComponentWithTag(
renderedComponent, 'input'
);
this.inputElement = inputComponent.getDOMNode();
});
it('<input> should be of type "text"', function () {
assert(this.inputElement.getAttribute('type') === 'text');
});
})
Der Test würde bestehen:
> mocha --opts ./test/javascripts/mocha.opts --compilers js:babel/register --recursive test/javascripts/**/*.jsx
TestSample component
✓ <input> should be of type "text"
1 passing (44ms)
Nachdem ich den Klassennamen in das Eingabe-Tag eingefügt habe, wird ein Fehler angezeigt:
import React from 'react';
import testingStyle from '../../scss/components/landing/testing.scss';
export default class Testing extends React.Component {
render() {
return (
<section>
<form>
<input type="text" className="testingStyle.color" placeholder="Where would you like to dine" />
</form>
</section>
);
}
}
Testergebnis:
SyntaxError: /Users/../../../Documents/project/app/scss/components/landing/testing.scss: Unexpected token (1:0)
> 1 | .color {
| ^
2 | color: red;
3 | }
Ich habe online gesucht, aber bisher kein Glück. Vermisse ich etwas Bitte helfen Sie mir oder weisen Sie mich in die richtige Richtung. Wir würden uns sehr freuen. Ich verwende derzeit:
Node Express Server
React
React-Router
Webpack
Babel
Mokka
Chai
Sinon
Sinon-Chai