Merge ad55bb4 into 1cc0ccc

.gitignore

@@ -1,2 +1,4 @@
 node_modules
 *.log
+.nyc_output/
+coverage/

.travis.yml

@@ -1,7 +1,6 @@
 language: node_js
 node_js:
-  - "0.10"
-  - "0.12"
   - "4.0"
   - "6.0"
 script: "npm test"
+after_success: "npm run report-coverage"

README.md

@@ -1,6 +1,6 @@
 # react-katex
 
-[![Build Status](https://travis-ci.org/talyssonoc/react-katex.svg?branch=master)](https://travis-ci.org/talyssonoc/react-katex) [![Code Climate](https://codeclimate.com/github/talyssonoc/react-katex/badges/gpa.svg)](https://codeclimate.com/github/talyssonoc/react-katex)
+[![Build Status](https://travis-ci.org/talyssonoc/react-katex.svg?branch=master)](https://travis-ci.org/talyssonoc/react-katex) [![Code Climate](https://codeclimate.com/github/talyssonoc/react-katex/badges/gpa.svg)](https://codeclimate.com/github/talyssonoc/react-katex) [![Coverage Status](https://coveralls.io/repos/github/talyssonoc/react-katex/badge.svg?branch=master)](https://coveralls.io/github/talyssonoc/react-katex?branch=master)
 
 Display math with KaTeX and ReactJS!
 

package.json

@@ -13,7 +13,8 @@
   "main": "dist/react-katex",
   "scripts": {
     "build": "webpack",
-    "test": "mocha",
+    "test": "nyc --reporter=html mocha",
+    "report-coverage": "nyc report --reporter=text-lcov | coveralls",
     "lint": "eslint {src,test}/*.js",
     "prepublish": "npm run build"
   },
@@ -41,11 +42,13 @@
     "babel-preset-es2015": "^6.16.0",
     "babel-preset-react": "^6.16.0",
     "chai": "^3.5.0",
+    "coveralls": "^2.13.1",
     "enzyme": "^2.4.1",
     "eslint": "^3.7.1",
     "eslint-plugin-react": "^6.4.1",
     "katex": "^0.7.0",
     "mocha": "^3.1.2",
+    "nyc": "^11.0.3",
     "prop-types": "^15.5.10",
     "react": "^15.3.2",
     "react-addons-test-utils": "^15.3.2",

test/sharedExamples.js

@@ -6,9 +6,10 @@ import KaTeX from 'katex';
 export default (Component, { wrapperTag, displayMode }) => {
   const sumFormula = '\\sum_0^\\infty';
   const integralFormula = '\\int_{-infty}^\\infty';
-  const brokenFormula = '\\int_{';
+  const invalidCommandFormula = '\\inta';
+  const incompleteFormula = '\\sum_{';
   const renderError = (error) => (
-    <span className={'error'}>{`${error.name}: Invalid formula ${brokenFormula}`}</span>
+    <span className={'error'}>{`${error.name}: Cannot render this formula`}</span>
   );
 
   context('when passing the formula as props', () => {
@@ -57,23 +58,10 @@ export default (Component, { wrapperTag, displayMode }) => {
   });
 
   describe('error handling', () => {
-    it('renders the returned value from `renderError` prop when formula is invalid', () => {
-      const math = shallow(
-        <Component
-          math={brokenFormula}
-          renderError={renderError}
-        />
-      );
-
-      expect(math.html()).to.equal(
-        '<span class="error">ParseError: Invalid formula \\int_{</span>'
-      );
-    });
-
     it('updates when passing from invalid to valid formula', () => {
       const math = shallow(
         <Component
-          math={brokenFormula}
+          math={invalidCommandFormula}
           renderError={renderError}
         />
       );
@@ -96,18 +84,73 @@ export default (Component, { wrapperTag, displayMode }) => {
       );
 
       math.setProps({
-        math: brokenFormula
+        math: invalidCommandFormula
       });
 
       expect(math.html()).to.equal(
-        '<span class="error">ParseError: Invalid formula \\int_{</span>'
+        '<span class="error">ParseError: Cannot render this formula</span>'
       );
     });
 
-    it('blows when no `renderError` prop is passed', () => {
-      expect(() => {
-        shallow(<Component math={brokenFormula} />);
-      }).to.throw('KaTeX parse error');
+    context('when using default error handler', () => {
+      it('renders the formula with the wrong part highlighted in default color', () => {
+        const math = shallow(
+          <Component math={invalidCommandFormula} />
+        );
+
+        expect(math.html()).to.include('color:#cc0000;');
+      });
+
+      context('when passing custom error color', () => {
+        it('renders the formula with the wrong part highlighted in custom color', () => {
+          const math = shallow(
+            <Component
+              errorColor={'blue'}
+              math={invalidCommandFormula}
+            />
+          );
+
+          expect(math.html()).to.include('color:blue;');
+        });
+      });
+
+      context('when error is not caused by an invalid command', () => {
+        it('blows during rendering', () => {
+          expect(() => shallow(
+            <Component math={incompleteFormula} />
+          )).to.throw('KaTeX parse error');
+        });
+      });
+    });
+
+    context('when using custom error handler', () => {
+      it('renders the returned value from `renderError` prop', () => {
+        const math = shallow(
+          <Component
+            math={invalidCommandFormula}
+            renderError={renderError}
+          />
+        );
+
+        expect(math.html()).to.equal(
+          '<span class="error">ParseError: Cannot render this formula</span>'
+        );
+      });
+
+      context('when error is not caused by an invalid command', () => {
+        it('still uses custom handler', () => {
+          const math = shallow(
+            <Component
+              math={incompleteFormula}
+              renderError={renderError}
+            />
+          );
+
+          expect(math.html()).to.equal(
+            '<span class="error">ParseError: Cannot render this formula</span>'
+          );
+        });
+      });
     });
   });
 };