Skip to content
This repository has been archived by the owner on Apr 12, 2024. It is now read-only.

feature(style): expressions in style tags #6492

Closed
wants to merge 5 commits into from
Closed

feature(style): expressions in style tags #6492

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
49660c6
fix(style): expressions in style tags
SekibOmazic Feb 28, 2014
3b881a4
test changed to show that binding works for complex expressions
SekibOmazic Feb 28, 2014
423d9dc
remove illegal trailing whitespace
SekibOmazic Feb 28, 2014
d24fbb9
make tests more readable
SekibOmazic Mar 1, 2014
a2446ac
add one more test with simple bind
SekibOmazic Mar 1, 2014
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/ng/directive/style.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,5 +2,5 @@

var styleDirective = valueFn({
restrict: 'E',
terminal: true
terminal: false
});
54 changes: 51 additions & 3 deletions test/ng/directive/styleSpec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,15 +9,63 @@ 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; }');
}));

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

in the future please use two blanks spaces between its. I'll fix this PR before merging.

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 }}');
}));

it('should compile content of element with style attr', inject(function($compile, $rootScope) {
element = jqLite('<div style="some">{{bind}}</div>');
Expand Down