Bem: get rid of attrs prop and proxy all props to <Tag>

bem · Nov 24, 2017 · 36da7b4 · 36da7b4
1 parent 9b81fdb
commit 36da7b4
Show file tree

Hide file tree

Showing 2 changed files with 41 additions and 7 deletions.
diff --git a/src/Bem.js b/src/Bem.js
@@ -1,8 +1,32 @@
 import inherit from 'inherit';
 import stringify from '@bem/sdk.naming.entity.stringify';
 
+const bemModes = {
+    block : 1,
+    elem : 1,
+    addBemClassName : 1,
+    tag : 1,
+    attrs : 1,
+    mods : 1,
+    mix : 1,
+    cls : 1
+};
+
 export default function({ preset, naming }) {
     const { Base, classAttribute, Render, PropTypes } = preset;
+    const getRenderProps = function(instance, node) {
+        const mergedProps = {
+            ...node.attrs,
+            ...node,
+            [classAttribute] : instance.__cnb(node)
+        };
+
+        return Object.keys(mergedProps).reduce((props, p) => {
+            if(!bemModes[p]) props[p] = mergedProps[p];
+            return props;
+        }, Object.create(null));;
+    };
+
     return inherit(Base, {
         __constructor() {
             this.__base(...arguments);
@@ -39,11 +63,8 @@ export default function({ preset, naming }) {
             return this.__render(node);
         },
 
-        __render(node) {
-            return Render(node.tag || 'div', {
-                [classAttribute] : this.__cnb(node),
-                ...node.attrs
-            }, node.children);
+        __render(props) {
+            return Render(props.tag || 'div', getRenderProps(this, props));
         }
     }, {
         displayName : 'Bem',

diff --git a/tests/htmlMethods.spec.js b/tests/htmlMethods.spec.js
@@ -14,8 +14,21 @@ describe('Entity without declaration', () => {
         expect(shallow(<Bem block="Block" tag="b"/>).type()).toBe('b');
     });
 
-    it('Should proper attrs', () => {
-        expect(shallow(<Bem block="Block" tag="b" attrs={{ id : 'the-id' }}/>).prop('id'))
+    it('Should proper inline attrs', () => {
+        expect(shallow(<Bem block="Block" tag="b" id="the-id"/>).prop('id'))
+            .toBe('the-id');
+    });
+
+    it('Should merge inline attrs and attrs mode', () => {
+        expect(shallow(<Bem block="Block" id="the-id" attrs={{ action : '/' }}/>).props())
+            .toMatchObject({
+                id : 'the-id',
+                action : '/'
+            });
+    });
+
+    it('Should have props priority', () => {
+        expect(shallow(<Bem block="Block" id="the-id" attrs={{ id : 'no-id' }}/>).prop('id'))
             .toBe('the-id');
     });
 });