Merge branch 'master' into lodash

.babelrc

@@ -1,5 +1,5 @@
 {
-  "presets": ["es2015"],
+  "presets": ["@babel/env"],
   "env": {
     "test": {
       "plugins": ["rewire"]

.coveralls.yml

@@ -0,0 +1,2 @@
+# COVERALLS_REPO_TOKEN should be set in Travis-CI
+repo_token: ${COVERALLS_REPO_TOKEN}

.npmrc

@@ -0,0 +1 @@
+package-lock=false

.nvmrc

@@ -0,0 +1 @@
+10

.nycrc

@@ -0,0 +1,14 @@
+{
+  "reporter": [
+    "lcov",
+    "text"
+  ],
+  "include": [
+    "src/**/*.js"
+  ],
+  "require": [
+    "@babel/register"
+  ],
+  "sourceMap": true,
+  "instrument": true
+}

.travis.yml

@@ -0,0 +1,26 @@
+language: node_js
+node_js:
+  - "10"
+  - "12"
+
+notifications:
+  email: false
+
+# Enable builds on limited branches
+branches:
+  only:
+  - master
+  - /release\/\d{1,2}\.x/
+
+before_install:
+  - npm config set //registry.npmjs.org/:_authToken=$npm_config__auth
+
+install:
+  - npm install --always-auth=true
+
+script:
+  - npm test
+
+after_success:
+  # Deploy coverage reports to Coveralls for node 12 run
+  - if [[ $(node -v) == v12* ]]; then npm install coveralls; ./node_modules/.bin/coveralls < coverage/lcov.info; fi

CHANGELOG.md

@@ -1,6 +1,31 @@
 ### Unreleased
 
-* n/a
+#### Chores
+* Update babel packages to @babel scope and v7
+
+### 2.1.1 (2018-11-09)
+
+* Update @condenast/jsonml.js to version 1.0.1 to fix es5-compatibility
+
+### 2.1.0 (2018-11-08)
+
+* Switch to Conde Nast fork of jsonml.js (#16)
+
+### 2.0.1 (2018-06-18)
+
+* Clean up `class` prop in React elements (#14)
+
+### 2.0.0 (2018-04-26)
+
+* Remove React 14/15 as a peer dependency
+
+### 1.1.0 (2018-04-26)
+
+* Allow React 16 as a peer dependency
+
+### 1.0.0 (2018-03-29)
+
+* Avoid mutating the inputs
 
 ### 0.1.1 (2017-09-26)
 

README.md

@@ -1,5 +1,6 @@
+[![Build Status](https://travis-ci.org/CondeNast/jsonmltoreact.svg?branch=master)](https://travis-ci.org/CondeNast/jsonmltoreact)
 [![Code Climate](https://codeclimate.com/github/diffcunha/jsonmltoreact/badges/gpa.svg)](https://codeclimate.com/github/diffcunha/jsonmltoreact)
-[![Test Coverage](https://codeclimate.com/github/diffcunha/jsonmltoreact/badges/coverage.svg)](https://codeclimate.com/github/diffcunha/jsonmltoreact/coverage)
+[![Coverage Status](https://coveralls.io/repos/github/CondeNast/jsonmltoreact/badge.svg?branch=master)](https://coveralls.io/github/CondeNast/jsonmltoreact?branch=master)
 
 # jsonmltoreact
 JsonML to React converter

package.json

@@ -1,50 +1,52 @@
 {
   "name": "@condenast/jsonmltoreact",
-  "version": "0.1.1",
+  "version": "2.1.1",
   "description": "JsonML to React component converter",
   "main": "./lib/index.js",
   "scripts": {
     "build": "npm run build:js",
     "build:js": "./node_modules/.bin/babel ./src --out-dir ./lib",
-    "coverage": "nyc --reporter=lcov --require babel-core/register mocha ${TEST_FILES:-test/src/index.spec.js}",
+    "coverage": "nyc --reporter=lcov --require @babel/register mocha ${TEST_FILES:-test/src/index.spec.js}",
     "lint": "eslint --ext .js -c .eslintrc .",
     "prebuild": "rm -rf lib",
-    "precommit": "npm run lint",
-    "prepublish": "npm run build",
-    "prepush": "npm test",
+    "prepublishOnly": "npm run build",
     "pretest": "npm run lint",
-    "test": "NODE_ENV=test nyc mocha"
+    "test": "NODE_ENV=test nyc mocha",
+    "tdd": "NODE_ENV=test nyc mocha --watch --break"
   },
   "repository": {
     "type": "git",
     "url": "https://github.com/CondeNast/jsonmltoreact"
   },
   "license": "MIT",
   "dependencies": {
-    "jsonml.js": "^0.1.0",
+    "@condenast/jsonml.js": "^1.0.1",
     "lodash": "^4.14.1"
   },
   "peerDependencies": {
-    "react": "^0.14.0 || ^15.0.0"
+    "react": "^16.0.0"
   },
   "devDependencies": {
-    "babel-cli": "^6.8.0",
-    "babel-core": "^6.8.0",
-    "babel-eslint": "^6.0.4",
-    "babel-plugin-rewire": "^1.0.0-rc-3",
-    "babel-preset-es2015": "^6.6.0",
-    "babel-template": "^6.8.0",
-    "babel-types": "^6.8.1",
-    "chai": "^3.5.0",
-    "eslint": "^2.10.1",
-    "husky": "^0.11.4",
-    "mocha": "^2.4.5",
-    "nyc": "^6.4.4",
-    "sinon": "^1.17.4"
+    "@babel/cli": "^7.8.4",
+    "@babel/core": "^7.8.4",
+    "@babel/preset-env": "^7.8.4",
+    "@babel/register": "^7.8.3",
+    "@babel/template": "^7.8.3",
+    "@babel/types": "^7.8.3",
+    "babel-eslint": "^10.0.0",
+    "babel-plugin-rewire": "^1.2.0",
+    "chai": "^4.0.0",
+    "eslint": "^6.0.0",
+    "husky": "^4.2.3",
+    "mocha": "^7.0.0",
+    "nyc": "^15.0.0",
+    "react": "^16.2.0",
+    "sinon": "^9.0.0"
   },
-  "nyc": {
-    "require": [
-      "babel-core/register"
-    ]
+  "husky": {
+    "hooks": {
+      "pre-commit": "npm run lint",
+      "pre-push": "npm test"
+    }
   }
 }

renovate.json

@@ -0,0 +1,51 @@
+{
+  "extends": ["config:base"],
+  "ignoreUnstable": true,
+  "devDependencies": {
+    "automerge": true
+  },
+  "pinVersions": false,
+  "respectLatest": true,
+  "rebaseStalePrs": true,
+  "prConcurrentLimit": 4,
+  "schedule": [
+    "after 8pm every weekday",
+    "before 5am every weekday",
+    "every weekend"
+  ],
+  "timezone": "America/New_York",
+  "packageRules": [
+    {
+      "groupName": "Major dev deps",
+      "packagePatterns": ["*"],
+      "depTypeList": ["devDependencies"],
+      "updateTypes": ["major"],
+      "labels": ["UPDATE-MAJOR-DEV"],
+      "semanticCommits": true
+    },
+    {
+      "groupName": "Non-major dev deps",
+      "packagePatterns": ["*"],
+      "depTypeList": ["devDependencies"],
+      "updateTypes": ["minor", "patch"],
+      "labels": ["UPDATE-NON-MAJOR-DEV"],
+      "semanticCommits": true
+    },
+    {
+      "groupName": "Major deps",
+      "packagePatterns": ["*"],
+      "depTypeList": ["dependencies"],
+      "updateTypes": ["major"],
+      "labels": ["UPDATE-MAJOR"],
+      "semanticCommits": true
+    },
+    {
+      "groupName": "Non-major deps",
+      "packagePatterns": ["*"],
+      "depTypeList": ["dependencies"],
+      "updateTypes": ["minor", "patch"],
+      "labels": ["UPDATE-NON-MAJOR"],
+      "semanticCommits": true
+    }
+  ]
+}

src/JsonmlToReact.js

@@ -1,8 +1,9 @@
 import React from 'react';
-import JsonML from 'jsonml.js/lib/utils';
+import JsonML from '@condenast/jsonml.js/dist/utils';
 import isFunction from 'lodash/isFunction';
 
 import {
+  filter,
   reactConverters,
   toStyleObject,
   voidElementTags
@@ -36,26 +37,18 @@ export default class JsonmlToReact {
       return node;
     }
 
-    let attrs = Object.assign({ key: index }, JsonML.getAttributes(node));
-
-    if (attrs.class) {
-      attrs.className = attrs.class;
-      attrs.class = undefined;
-    }
-
-    if (attrs.style) {
-      attrs.style = toStyleObject(attrs.style);
-    }
-
+    const rawAttrs = Object.assign({}, JsonML.getAttributes(node));
     const tag = JsonML.getTagName(node);
     const converter = this.converters[tag];
-    const result = isFunction(converter) ? converter(attrs, data) : {};
+    const result = isFunction(converter) ? converter(rawAttrs, data) : {};
 
     const type = result.type || tag;
-    const props = result.props || attrs;
-
-    // reassign key in case `converter` removed it
-    props.key = props.key || index;
+    const resultProps = result.props || rawAttrs || {};
+    const props = Object.assign({}, filter(resultProps, key => key !== 'class'), {
+      className: resultProps.className || resultProps.class,
+      key: index,
+      style: rawAttrs.style && toStyleObject(rawAttrs.style)
+    });
 
     // If it's a void element, don't create children
     if (voidElementTags[type]) {

src/utils.js

@@ -1,5 +1,20 @@
 import camelCase from 'lodash/camelCase';
 
+/**
+ * Returns a copy of an object, with specific keys omitted
+ *
+ * @param {Object} obj - Source object
+ * @param {Function} filterFn - function to check if a key/val pair should be retained
+ * @returns {Object} a new object omitting keys
+ */
+export function filter(obj, filterFn) {
+  return Object.keys(obj).reduce((acc, key) => {
+    if (filterFn(key, obj[key])) {
+      acc[key] = obj[key];
+    }
+    return acc;
+  }, {});
+}
 
 /**
  * React HTML tags

test/src/JsonmlToReact.spec.js

@@ -1,5 +1,5 @@
-import sinon from 'sinon';
 import { expect } from 'chai';
+import sinon  from 'sinon';
 
 import JsonmlToReact from '../../src/JsonmlToReact';
 
@@ -24,6 +24,10 @@ const converters = {
 };
 
 describe('JsonmlToReact class', function () {
+  afterEach(function () {
+    sinon.restore();
+  });
+
   let jsonmlToReact = new JsonmlToReact(converters);
 
   it('exports a module', function () {
@@ -134,6 +138,13 @@ describe('JsonmlToReact class', function () {
 
       jsonmlToReact._visit.restore();
     });
+
+    it('doesn\'t mutate the raw attributes', function () {
+      const attributes = { style: 'display: block; color: #fff;' };
+      const node = ['a', attributes];
+      jsonmlToReact._visit(node, 987);
+      expect(attributes).to.deep.equal({ style: 'display: block; color: #fff;' });
+    });
   });
 
   describe('convert method', () => {
@@ -155,13 +166,28 @@ describe('JsonmlToReact class', function () {
       let spy = sinon.spy(ReactMock, 'createElement');
 
       let node = ['p', {}, 'i am a text node'];
+      const expectedAttributes = {
+        className: undefined,
+        key: 0,
+        style: undefined
+      };
 
       jsonmlToReact.convert(node);
-
-      expect(spy.calledWith('p', { key: 0 }, 'i am a text node')).to.be.true;
-
+      expect(spy.calledWith('p', expectedAttributes, 'i am a text node')).to.be.true;
       ReactMock.createElement.restore();
     });
   });
 
+  describe('converters', () => {
+    it('are called with the raw attributes and \'data\'', function () {
+      const attributes = { style: 'display: block; color: #fff;' };
+      const data = { something: Math.random() };
+      const node = ['test-tag-with-data', attributes];
+
+      const spy = sinon.spy(jsonmlToReact.converters, 'test-tag-with-data');
+      jsonmlToReact.convert(node, data);
+
+      sinon.assert.calledWith(spy, attributes, data);
+    });
+  });
 });

test/src/utils.spec.js

@@ -1,21 +1,27 @@
 import { expect } from 'chai';
 
 import {
+  filter,
   reactHTMLTags,
   reactConverters,
   toStyleObject
 } from '../../src/utils';
 
+describe('filter', function () {
+  it('should filter matching keys', function () {
+    const foo = { bar: 1, foo: 2, class: 3 };
+    expect(filter(foo, key => key !== 'class')).to.deep.equal({ bar: 1, foo: 2 });
+  });
+});
 
-describe('reactConverters array', () => {
+describe('reactConverters array', function () {
   it('is a object with all HTML tags as keys and a function as value', function () {
     expect(reactConverters).to.have.all.keys(reactHTMLTags);
   });
 });
 
-
-describe('toStyleObject function', () => {
-  it('returns class object parsed from the CSS style string', () => {
+describe('toStyleObject function', function () {
+  it('returns class object parsed from the CSS style string', function () {
     let css = 'display: block; color: #fff;';
     let result = toStyleObject(css);