This is a temporary solution. Might change in the near future, this depends on how create-react-app will implement testing.
create-react-app quick-test-example
cd quick-test-example
npm run eject
import React from 'react' | |
import ReactDOM from 'react-dom' | |
import { createStore, combineReducers } from 'redux' | |
import * as R from 'ramda' | |
// composition helper | |
const combine = R.curry((c, o) => x => (<div>{c(x)} {o(x)}</div>)) | |
const combineComponents = (...args) => { | |
const [first, ...rest] = args | |
return R.reduce((acc, c) => combine(acc, c), first, rest) |
import React from 'react' | |
import { render } from 'react-dom' | |
import { compose, map, prop, curry, reduce, pipe } from 'ramda' | |
const combine = curry((c, o) => x => (<div>{c(x)} {o(x)}</div>)) | |
const combineComponents = (...args) => { | |
const [first, ...rest] = args | |
return reduce((acc, c) => combine(acc, c), first, rest) | |
} |
import React, { PropTypes, Component } from 'react'; | |
import { createStore, combineReducers } from 'redux'; | |
import { render } from 'react-dom'; | |
let devCardTest = require('./DevCardsTest.js').default; | |
const devCardStyle = { | |
background: '#eee', | |
padding: '20px', | |
marginBottom: '10px' | |
}; |
import React, { PropTypes } from 'react'; | |
const foobar = (props) => ( | |
<div> | |
<h3>Testdrive. Stateless. Yes.</h3> | |
<div>{props.name}</div> | |
<div>{props.model}</div> | |
</div> | |
); |
import React from 'react' | |
import { shallow, mount, render } from 'enzyme' | |
import Root, { SearchBar, ReleaseTable, Release } from '../src/Root' | |
describe('<SearchBar>', () => { | |
let onSearch; | |
beforeEach(() => { | |
onSearch = jasmine.createSpy('onSearch'); | |
}); |
import React from 'react' | |
import { shallow, mount, render } from 'enzyme' | |
import Root, { SearchBar, ReleaseTable, Release } from '../src/Root' | |
const createShallowRelaseTable = (noOutOfPrint = false, searchText = '') => { | |
let items = [{ artist: 'foobar', title: 'bar', outOfPrint: true }]; | |
let props = { searchText, releases: items, noOutOfPrint }; | |
return shallow(<ReleaseTable { ...props } />); | |
} |
import React from 'react' | |
import { shallow, mount, render } from 'enzyme' | |
import Root, { SearchBar, ReleaseTable, Release } from '../src/Root' | |
const createShallowRelease = (outOfPrint = true) => { | |
let props = {release: { artist: 'foobar', title: 'bar', outOfPrint }}; | |
return shallow(<Release {...props} />); | |
}; | |
describe('<Release>', () => { |
{ | |
"name": "example-karma-jasmine-webapck-test-setup", | |
"description": "React Test Setup with Karma/Jasmine/Webpack", | |
"scripts": { | |
"test": "karma start --single-run --browsers PhantomJS" | |
}, | |
"devDependencies": { | |
"babel": "^6.5.2", | |
"babel-core": "^6.5.2", | |
"babel-eslint": "^5.0.0", |
{ | |
"name": "example-karma-jasmine-webapck-test-setup", | |
"description": "React Test Setup with Karma/Jasmine/Webpack", | |
"scripts": { | |
"test": "karma start --single-run --browsers PhantomJS" | |
}, | |
"devDependencies": { | |
"babel": "^6.5.2", | |
"babel-core": "^6.5.2", | |
"babel-eslint": "^5.0.0", |