react-native-savor
v0.1.12
Published
A simple way of adding tests (and more) to your React Native apps
Downloads
57
Maintainers
Readme
Savor
Overview
Savor gives you all you need to write amazing tests, right out of the box, all in one place: a test framework, BDD and TDD assertions, stubbing/mocking, code coverage and static analysis.
Savor uses the following Open-Source libraries to make that happen:
- Mocha as the test framework
- Chai as the assertion library (both for BDD and for TDD)
- Sinon as the stubbing library
- Istanbul as the code coverage tool
- ESLint as the static analyzer
- Enzyme as the React testing framework
Savor also gives you the ability to plug your tests into your continuous integration process via Coveralls for code coverage and Codacy for code analysis. It also support CodeClimate which is a tool that offers both static analysis and code coverage. To integrate with your CI tool, make sure you add a post-execution script that runs the following:
npm run coveralls
npm run codacy
npm run codeclimate
For Travis CI for example, this is what your .travis.yml
file might look like:
language: node_js
node_js:
- "5.0"
after_success:
- npm run coveralls
- npm run codacy
- npm run codeclimate
Installation
STEP 1
Add Savor to your module as a development dependency:
npm install --save-dev react-native-savor
STEP 2
Add Savor to your module scripts:
"scripts": {
"savor": "react-native-savor"
}
If you'd like more granularity over your scripts you can also install single Savor commands:
"scripts": {
"savor": "react-native-savor",
"test": "react-native-savor test",
"lint": "react-native-savor lint",
"cover": "react-native-savor cover",
"coveralls": "react-native-savor coveralls",
"codacy": "react-native-savor codacy"
"codeclimate": "react-native-savor codeclimate"
}
Make sure you also configure Babel correctly in your package.json
:
"babel": {
"plugins": ["transform-react-jsx"],
"presets": ["react-native", {}]
}
STEP 3
Make sure your code resides under a src
directory and all your specs under a test/specs
directory:
package.json
node_modules/
src/
main.js
test/
assets/
BasicComponent.js
specs/
main.js
Adding Tests
You can now write tests under your test
directory, like so:
import React, {
View,
Text,
StyleSheet
} from 'react-native'
import savor from '../../../..'
import BasicComponent from '../assets/react-native/BasicComponent'
const TestText = (<Text>test</Text>)
const TestComponent = (<BasicComponent/> )
savor.add('should mount a basic React Native component', function(context, done) {
const wrapper = context.shallow(TestComponent)
context.expect(wrapper.length).to.equal(1)
context.expect(wrapper).to.contain(TestText)
done()
}).
run('My React Native Tests')
The Savor Context
When you add a test, you are given a context
that contains the following:
context.expect // Using Chai
context.assert // Using Chai
context.stub // Using Sinon
context.shallow // Using Enzyme
context.mount // Using Enzyme
context.render // Using Enzyme
context.dir // The temporary test location
Running Tests
You can now simply run your tests like so:
npm test
Test Coverage
You can check your coverage like this:
npm run coverage
Static Analysis
You can lint your code like this:
npm run lint
Working Example
Take a look at the example for more details on how to integrate Savor within your module.
Enjoy!
License
Copyright (c) 2016 I. Dan Calinescu
Licensed under the The MIT License (MIT) (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at
https://raw.githubusercontent.com/idancali/react-native-savor/master/LICENSE
Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.