Skip to content

Commit

Permalink
Fixed removing attributes during custom element update. Fixes faceboo…
Browse files Browse the repository at this point in the history
…k#6747 (facebook#6748)

(cherry picked from commit 0e889d7)
  • Loading branch information
grassator authored and zpao committed Jun 8, 2016
1 parent cd59a69 commit 1f85ba0
Show file tree
Hide file tree
Showing 3 changed files with 34 additions and 0 deletions.
18 changes: 18 additions & 0 deletions src/renderers/dom/shared/DOMPropertyOperations.js
Original file line number Diff line number Diff line change
Expand Up @@ -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.
*
Expand Down
7 changes: 7 additions & 0 deletions src/renderers/dom/shared/ReactDOMComponent.js
Original file line number Diff line number Diff line change
Expand Up @@ -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)) {
Expand Down
9 changes: 9 additions & 0 deletions src/renderers/dom/shared/__tests__/ReactDOMComponent-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -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');
Expand Down

0 comments on commit 1f85ba0

Please sign in to comment.