diff --git a/index.js b/index.js index e5d592b..e6c51bc 100644 --- a/index.js +++ b/index.js @@ -131,7 +131,16 @@ function addAttribute(props, name, value, ctx) { return; } - name = info.name || paramCase(name); + if (ctx.react) { + var beginFour = name.slice(0, 4); + if ((beginFour === 'data' || beginFour === 'aria') && name.length > 4) { + name = paramCase(name); + } else { + name = info.name || camelCase(name); + } + } else { + name = info.name || paramCase(name); + } if (value !== null && typeof value === 'object' && 'length' in value) { /* Accept `array`. Most props are space-separater. */ diff --git a/test.js b/test.js index aa5c6bd..84a4c44 100644 --- a/test.js +++ b/test.js @@ -143,7 +143,7 @@ test('hast-to-hyperscript', function (t) { t.test('should support `React.createElement` in `development`', function (st) { var currentEnv = process.env.NODE_ENV; - var baseline = doc.replace(/color:red;/, 'color:red'); + var baseline = doc.replace(/color:red;/, 'color:red').replace(/camel-case/, 'camelCase'); process.env.NODE_ENV = 'development'; var actual = toH(r, hast); @@ -160,7 +160,7 @@ test('hast-to-hyperscript', function (t) { r('strong', { key: 'h-2', style: {color: 'red'}, - 'camel-case': 'on off', + camelCase: 'on off', 'data-some': 'yes', 'aria-valuenow': '1' }, ['charlie']), @@ -180,7 +180,7 @@ test('hast-to-hyperscript', function (t) { t.test('should support `React.createElement` in `production`', function (st) { var currentEnv = process.env.NODE_ENV; - var baseline = doc.replace(/color:red;/, 'color:red'); + var baseline = doc.replace(/color:red;/, 'color:red').replace(/camel-case/, 'camelCase'); process.env.NODE_ENV = 'production'; var actual = toH(r, hast); @@ -197,7 +197,7 @@ test('hast-to-hyperscript', function (t) { r('strong', { key: 'h-2', style: {color: 'red'}, - 'camel-case': 'on off', + camelCase: 'on off', 'data-some': 'yes', 'aria-valuenow': '1' }, ['charlie']), @@ -271,6 +271,20 @@ test('hast-to-hyperscript', function (t) { 'react: should parse an invalid style declaration' ); + st.deepEqual( + toH(r, u('element', {tagName: 'div', properties: { + 'camel-case': 'on off', + 'data-some': 'yes', + 'aria-valuenow': '1' + }})).props, + { + camelCase: 'on off', + 'data-some': 'yes', + 'aria-valuenow': '1' + }, + 'react: should parse attributeName as camelCase with the exceptions' + ); + st.end(); });