Refactor setting dynamic attributes

packages/core/src/dom_components/model/Component.ts

@@ -306,9 +306,8 @@ export default class Component extends StyleableModel<ComponentProperties> {
     };
     this.em = em!;
     this.config = opt.config || {};
-    this.setAttributes({
+    this.addAttributes({
       ...(result(this, 'defaults').attributes || {}),
-      ...(this.get('attributes') || {}),
     });
     this.ccid = Component.createId(this, opt);
     this.preInit();
@@ -696,8 +695,7 @@ export default class Component extends StyleableModel<ComponentProperties> {
    * component.setAttributes({ id: 'test', 'data-key': 'value' });
    */
   setAttributes(attrs: ObjectAny, opts: SetAttrOptions = { skipWatcherUpdates: false, fromDataSource: false }) {
-    const evaluatedAttributes = this.componentDVListener.setAttributes(attrs, opts);
+    this.set('attributes', { ...attrs }, opts);
-    this.set('attributes', { ...evaluatedAttributes }, opts);
 
     return this;
   }

packages/core/src/dom_components/model/ComponentDynamicValueWatcher.ts

@@ -45,26 +45,19 @@ export class ComponentDynamicValueWatcher {
 
   addProps(props: ObjectAny, options: DynamicWatchersOptions = {}) {
     const evaluatedProps = this.propertyWatcher.addDynamicValues(props, options);
-    const shouldSkipOverridUpdates = options.skipWatcherUpdates || options.fromDataSource;
+    if (props.attributes) {
-    if (!shouldSkipOverridUpdates) {
+      const evaluatedAttributes = this.attributeWatcher.setDynamicValues({ ...props.attributes }, options);
+      evaluatedProps['attributes'] = evaluatedAttributes;
+    }
+
+    const skipOverridUpdates = options.skipWatcherUpdates || options.fromDataSource;
+    if (!skipOverridUpdates) {
       this.updateSymbolOverride();
     }
 
     return evaluatedProps;
   }
 
-  addAttributes(attributes: ObjectAny, options: DynamicWatchersOptions = {}) {
-    const evaluatedAttributes = this.attributeWatcher.addDynamicValues(attributes, options);
-    this.updateSymbolOverride();
-    return evaluatedAttributes;
-  }
-
-  setAttributes(attributes: ObjectAny, options: DynamicWatchersOptions = {}) {
-    const evaluatedAttributes = this.attributeWatcher.setDynamicValues(attributes, options);
-    this.updateSymbolOverride();
-    return evaluatedAttributes;
-  }
-
   removeAttributes(attributes: string[]) {
     this.attributeWatcher.removeListeners(attributes);
     this.updateSymbolOverride();