From fc7568c224655cdd3b177d7e0406c4fef0ffc8e9 Mon Sep 17 00:00:00 2001 From: Carlos Lancha Date: Tue, 30 Oct 2018 14:48:53 +0100 Subject: [PATCH 1/2] Fixes #1275 - Sync data attributes in ClayComponent --- packages/clay-component/src/ClayComponent.js | 27 +++++++++++++++----- 1 file changed, 20 insertions(+), 7 deletions(-) diff --git a/packages/clay-component/src/ClayComponent.js b/packages/clay-component/src/ClayComponent.js index 23f99d77e7..ddbf24c51c 100644 --- a/packages/clay-component/src/ClayComponent.js +++ b/packages/clay-component/src/ClayComponent.js @@ -47,13 +47,15 @@ class ClayComponent extends Component { rendered(...args) { super.rendered(...args); - for (let dataKey in this.data) { - if (Object.prototype.hasOwnProperty.call(this.data, dataKey)) { - this.element.setAttribute( - 'data-' + dataKey, - this.data[dataKey] - ); - } + this._renderDataAttributes(); + } + + /** + * @inheritDoc + */ + syncData(newVal, prevVal) { + if (newVal != prevVal) { + this._renderDataAttributes(); } } @@ -121,6 +123,17 @@ class ClayComponent extends Component { this.runListeners_(listeners, args, facade); return true; } + + _renderDataAttributes() { + for (let dataKey in this.data) { + if (Object.prototype.hasOwnProperty.call(this.data, dataKey)) { + this.element.setAttribute( + 'data-' + dataKey, + this.data[dataKey] + ); + } + } + } } /** From 26439144b7a385dadcefda41eb0f43debaf6a0a9 Mon Sep 17 00:00:00 2001 From: Carlos Lancha Date: Tue, 30 Oct 2018 17:18:03 +0100 Subject: [PATCH 2/2] Fixes #1275 - SF --- packages/clay-component/src/ClayComponent.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/packages/clay-component/src/ClayComponent.js b/packages/clay-component/src/ClayComponent.js index ddbf24c51c..4d18ec417d 100644 --- a/packages/clay-component/src/ClayComponent.js +++ b/packages/clay-component/src/ClayComponent.js @@ -124,6 +124,9 @@ class ClayComponent extends Component { return true; } + /** + * Places the data attributes in the dom. + */ _renderDataAttributes() { for (let dataKey in this.data) { if (Object.prototype.hasOwnProperty.call(this.data, dataKey)) {