fix: #285 react-css-modules causes modifying key property of the component children (#286)

Author: vitaliymaz

src/linkClass.js

@@ -50,7 +50,7 @@ const linkElement = (element: ReactElement, styles: Object, configuration: Objec
   if (React.isValidElement(children)) {
     elementShallowCopy.props.children = linkElement(React.Children.only(children), styles, configuration);
   } else if (_.isArray(children) || isIterable(children)) {
-    elementShallowCopy.props.children = React.Children.map(children, (node) => {
+    elementShallowCopy.props.children = _.map(children, (node) => {
       if (React.isValidElement(node)) {
         // eslint-disable-next-line no-use-before-define
         return linkElement(React.Children.only(node), styles, configuration);

tests/linkClass.js

@@ -141,6 +141,22 @@ describe('linkClass', () => {
         expect(subject.props.children[0].props).not.to.have.property('styleName');
         expect(subject.props.children[1].props).not.to.have.property('styleName');
       });
+      it('preserves original keys', () => {
+        let subject;
+
+        subject = <div>
+          <p key='1' styleName='foo' />
+          <p key='2' styleName='bar' />
+        </div>;
+
+        subject = linkClass(subject, {
+          bar: 'bar-1',
+          foo: 'foo-1'
+        });
+
+        expect(subject.props.children[0].key).to.equal('1');
+        expect(subject.props.children[1].key).to.equal('2');
+      });
     });
     context('when multiple descendants have styleName and are iterable', () => {
       it('assigns a generated className', () => {