From 3011cd86bd2e061ac79a9f4e83e9a64fca757220 Mon Sep 17 00:00:00 2001
From: Pawel Kozlowski <pkozlowski.opensource@gmail.com>
Date: Tue, 12 May 2015 16:46:40 +0200
Subject: [PATCH] feat(compiler): special-case class attribute in
 hostAttributes

Closes #1774

Closes #1841
---
 .../src/render/dom/compiler/directive_parser.js    | 14 +++++++++++---
 .../render/dom/compiler/directive_parser_spec.js   | 12 +++++++++++-
 2 files changed, 22 insertions(+), 4 deletions(-)

diff --git a/modules/angular2/src/render/dom/compiler/directive_parser.js b/modules/angular2/src/render/dom/compiler/directive_parser.js
index c829d89a0f..3523f054a6 100644
--- a/modules/angular2/src/render/dom/compiler/directive_parser.js
+++ b/modules/angular2/src/render/dom/compiler/directive_parser.js
@@ -100,9 +100,7 @@ export class DirectiveParser extends CompileStep {
       }
       if (isPresent(directive.hostAttributes)) {
         MapWrapper.forEach(directive.hostAttributes, (hostAttrValue, hostAttrName) => {
-          if (!DOM.hasAttribute(current.element, hostAttrName)) {
-            DOM.setAttribute(current.element, hostAttrName, hostAttrValue);
-          }
+          this._addHostAttribute(hostAttrName, hostAttrValue, current);
         });
       }
       if (isPresent(directive.readAttributes)) {
@@ -162,6 +160,16 @@ export class DirectiveParser extends CompileStep {
     directiveBinderBuilder.bindHostProperty(hostPropertyName, ast);
   }
 
+  _addHostAttribute(attrName, attrValue, compileElement) {
+    if (StringWrapper.equals(attrName, 'class')) {
+      ListWrapper.forEach(attrValue.split(' '), (className) => {
+        DOM.addClass(compileElement.element, className);
+      });
+    } else if (!DOM.hasAttribute(compileElement.element, attrName)) {
+      DOM.setAttribute(compileElement.element, attrName, attrValue);
+    }
+  }
+
   _splitBindConfig(bindConfig:string) {
     return ListWrapper.map(bindConfig.split('|'), (s) => s.trim());
   }
diff --git a/modules/angular2/test/render/dom/compiler/directive_parser_spec.js b/modules/angular2/test/render/dom/compiler/directive_parser_spec.js
index 53528c20e1..a12e709521 100644
--- a/modules/angular2/test/render/dom/compiler/directive_parser_spec.js
+++ b/modules/angular2/test/render/dom/compiler/directive_parser_spec.js
@@ -144,6 +144,15 @@ export function main() {
       expect(DOM.getAttribute(results[0].element, 'attr_name')).toEqual('attr_val');
     });
 
+    it('should add CSS classes if "class" specified in host element attributes', () => {
+      var element = el('<input class="foo baz" some-decor-with-host-attrs>');
+      var results = process(element);
+
+      expect(DOM.hasClass(results[0].element, 'foo')).toBeTruthy();
+      expect(DOM.hasClass(results[0].element, 'bar')).toBeTruthy();
+      expect(DOM.hasClass(results[0].element, 'baz')).toBeTruthy();
+    });
+
     it('should read attribute values', () => {
       var element = el('<input some-decor-props some-attr="someValue">');
       var results = process(element);
@@ -283,7 +292,8 @@ var someDirectiveWithHostProperties = new DirectiveMetadata({
 var someDirectiveWithHostAttributes = new DirectiveMetadata({
   selector: '[some-decor-with-host-attrs]',
   hostAttributes: MapWrapper.createFromStringMap({
-    'attr_name': 'attr_val'
+    'attr_name': 'attr_val',
+    'class': 'foo bar'
   })
 });