Fixed removing attributes during custom element update. Fixes #6747 (#6748)

(cherry picked from commit 0e889d7c72)

src/renderers/dom/shared/DOMPropertyOperations.js

@@ -206,6 +206,24 @@ var DOMPropertyOperations = {
     }
   },
 
+  /**
+   * Deletes an attributes from a node.
+   *
+   * @param {DOMElement} node
+   * @param {string} name
+   */
+  deleteValueForAttribute: function(node, name) {
+    node.removeAttribute(name);
+    if (__DEV__) {
+      ReactDOMInstrumentation.debugTool.onDeleteValueForProperty(node, name);
+      ReactInstrumentation.debugTool.onNativeOperation(
+        ReactDOMComponentTree.getInstanceFromNode(node)._debugID,
+        'remove attribute',
+        name
+      );
+    }
+  },
+
   /**
    * Deletes the value for a property on a node.
    *

src/renderers/dom/shared/ReactDOMComponent.js

@@ -904,6 +904,13 @@ ReactDOMComponent.Mixin = {
           // listener (e.g., onClick={null})
           deleteListener(this, propKey);
         }
+      } else if (isCustomComponent(this._tag, lastProps)) {
+        if (!RESERVED_PROPS.hasOwnProperty(propKey)) {
+          DOMPropertyOperations.deleteValueForAttribute(
+            getNode(this),
+            propKey
+          );
+        }
       } else if (
           DOMProperty.properties[propKey] ||
           DOMProperty.isCustomAttribute(propKey)) {

src/renderers/dom/shared/__tests__/ReactDOMComponent-test.js

@@ -302,6 +302,15 @@ describe('ReactDOMComponent', function() {
       expect(container.firstChild.className).toEqual('');
     });
 
+    it('should properly update custom attributes on custom elements', function() {
+      var container = document.createElement('div');
+      ReactDOM.render(<some-custom-element foo="bar"/>, container);
+      ReactDOM.render(<some-custom-element bar="buzz"/>, container);
+      var node = container.firstChild;
+      expect(node.hasAttribute('foo')).toBe(false);
+      expect(node.getAttribute('bar')).toBe('buzz');
+    });
+
     it('should clear a single style prop when changing `style`', function() {
       var styles = {display: 'none', color: 'red'};
       var container = document.createElement('div');