From 0609453e1f9ae074f8d786df903096a6eadb6aa0 Mon Sep 17 00:00:00 2001
From: Sekib Omazic
Date: Fri, 28 Feb 2014 12:39:10 +0100
Subject: fix(style): expressions in style tags

Enable data-binding for style tags.

Note: this feature does not work on IE8.

Closes #2387
Closes #6492
---
 src/ng/directive/style.js      |  2 +-
 test/ng/directive/styleSpec.js | 58 +++++++++++++++++++++++++++++++++++++++---
 2 files changed, 56 insertions(+), 4 deletions(-)

diff --git a/src/ng/directive/style.js b/src/ng/directive/style.js
index 68ea1465..1e700aab 100644
--- a/src/ng/directive/style.js
+++ b/src/ng/directive/style.js
@@ -2,5 +2,5 @@
 
 var styleDirective = valueFn({
   restrict: 'E',
-  terminal: true
+  terminal: false
 });
diff --git a/test/ng/directive/styleSpec.js b/test/ng/directive/styleSpec.js
index bdc4ea85..36f15cde 100644
--- a/test/ng/directive/styleSpec.js
+++ b/test/ng/directive/styleSpec.js
@@ -9,13 +9,65 @@ describe('style', function() {
   });
 
 
-  it('should not compile style element', inject(function($compile, $rootScope) {
-    element = jqLite('<style type="text/css">should {{notBound}}</style>');
+  it('should compile style element without binding', inject(function($compile, $rootScope) {
+    element = jqLite('<style type="text/css">.header{font-size:1.5em; h3{font-size:1.5em}}</style>');
     $compile(element)($rootScope);
     $rootScope.$digest();
 
     // read innerHTML and trim to pass on IE8
-    expect(trim(element[0].innerHTML)).toBe('should {{notBound}}');
+    expect(trim(element[0].innerHTML)).toBe('.header{font-size:1.5em; h3{font-size:1.5em}}');
+  }));
+
+
+  it('should compile style element with one simple bind', inject(function($compile, $rootScope) {
+    element = jqLite('<style type="text/css">.some-container{ width: {{elementWidth}}px; }</style>');
+    $compile(element)($rootScope);
+    $rootScope.$digest();
+
+    // read innerHTML and trim to pass on IE8
+    expect(trim(element[0].innerHTML)).toBe('.some-container{ width: px; }');
+
+    $rootScope.$apply(function() {
+      $rootScope.elementWidth = 200;
+    });
+
+    // read innerHTML and trim to pass on IE8
+    expect(trim(element[0].innerHTML)).toBe('.some-container{ width: 200px; }');
+  }));
+
+
+  it('should compile style element with one bind', inject(function($compile, $rootScope) {
+    element = jqLite('<style type="text/css">.header{ h3 { font-size: {{fontSize}}em }}</style>');
+    $compile(element)($rootScope);
+    $rootScope.$digest();
+
+    // read innerHTML and trim to pass on IE8
+    expect(trim(element[0].innerHTML)).toBe('.header{ h3 { font-size: em }}');
+
+    $rootScope.$apply(function() {
+      $rootScope.fontSize = 1.5;
+    });
+
+    // read innerHTML and trim to pass on IE8
+    expect(trim(element[0].innerHTML)).toBe('.header{ h3 { font-size: 1.5em }}');
+  }));
+
+
+  it('should compile style element with two binds', inject(function($compile, $rootScope) {
+    element = jqLite('<style type="text/css">.header{ h3 { font-size: {{fontSize}}{{unit}} }}</style>');
+    $compile(element)($rootScope);
+    $rootScope.$digest();
+
+    // read innerHTML and trim to pass on IE8
+    expect(trim(element[0].innerHTML)).toBe('.header{ h3 { font-size:  }}');
+
+    $rootScope.$apply(function() {
+      $rootScope.fontSize = 1.5;
+      $rootScope.unit = 'em';
+    });
+
+    // read innerHTML and trim to pass on IE8
+    expect(trim(element[0].innerHTML)).toBe('.header{ h3 { font-size: 1.5em }}');
   }));
 
 
-- 
cgit v1.2.3