From 9f181f39e9f94d5fd6b45827a4490b936240859f Mon Sep 17 00:00:00 2001
From: Victor Berchet <victor@suumit.com>
Date: Thu, 26 Feb 2015 10:37:25 +0100
Subject: [PATCH] fix(StyleUrlResolver): add support for media query in import
 rules

---
 .../src/core/compiler/style_url_resolver.js   |  3 +-
 .../core/compiler/style_url_resolver_spec.js  | 61 +++++++++++++++----
 2 files changed, 49 insertions(+), 15 deletions(-)

diff --git a/modules/angular2/src/core/compiler/style_url_resolver.js b/modules/angular2/src/core/compiler/style_url_resolver.js
index d02f5e0c87..106b15aa84 100644
--- a/modules/angular2/src/core/compiler/style_url_resolver.js
+++ b/modules/angular2/src/core/compiler/style_url_resolver.js
@@ -34,6 +34,5 @@ export class StyleUrlResolver {
 }
 
 var _cssUrlRe = RegExpWrapper.create('(url\\()([^)]*)(\\))');
-// TODO(vicb): handle the media query part
-var _cssImportRe = RegExpWrapper.create('(@import[\\s]+(?!url\\())([^;]*)(;)');
+var _cssImportRe = RegExpWrapper.create('(@import[\\s]+(?!url\\())[\'"]([^\'"]*)[\'"](.*;)');
 var _quoteRe = RegExpWrapper.create('[\'"]');
diff --git a/modules/angular2/test/core/compiler/style_url_resolver_spec.js b/modules/angular2/test/core/compiler/style_url_resolver_spec.js
index dd86316fa6..fbb23c328d 100644
--- a/modules/angular2/test/core/compiler/style_url_resolver_spec.js
+++ b/modules/angular2/test/core/compiler/style_url_resolver_spec.js
@@ -5,27 +5,15 @@ import {UrlResolver} from 'angular2/src/core/compiler/url_resolver';
 
 export function main() {
   describe('StyleUrlResolver', () => {
-    it('should resolve urls', () => {
+    it('should resolve "url()" urls', () => {
       var styleUrlResolver = new StyleUrlResolver(new FakeUrlResolver());
       var css = `
-      @import '1.css';
-      @import "2.css";
-      @import url('3.css');
-      @import url("4.css");
-      @import url(5.css);
-
       .foo {
         background-image: url("double.jpg");
         background-image: url('simple.jpg');
         background-image: url(noquote.jpg);
       }`;
       var expectedCss = `
-      @import 'base/1.css';
-      @import 'base/2.css';
-      @import url('base/3.css');
-      @import url('base/4.css');
-      @import url('base/5.css');
-
       .foo {
         background-image: url('base/double.jpg');
         background-image: url('base/simple.jpg');
@@ -35,6 +23,53 @@ export function main() {
       var resolvedCss = styleUrlResolver.resolveUrls(css, 'base');
       expect(resolvedCss).toEqual(expectedCss);
     });
+
+    it('should resolve "@import" urls', () => {
+      var styleUrlResolver = new StyleUrlResolver(new FakeUrlResolver());
+      var css = `
+      @import '1.css';
+      @import "2.css";
+      `;
+      var expectedCss = `
+      @import 'base/1.css';
+      @import 'base/2.css';
+      `;
+
+      var resolvedCss = styleUrlResolver.resolveUrls(css, 'base');
+      expect(resolvedCss).toEqual(expectedCss);
+    });
+
+    it('should resolve "@import url()" urls', () => {
+      var styleUrlResolver = new StyleUrlResolver(new FakeUrlResolver());
+      var css = `
+      @import url('3.css');
+      @import url("4.css");
+      @import url(5.css);
+      `;
+      var expectedCss = `
+      @import url('base/3.css');
+      @import url('base/4.css');
+      @import url('base/5.css');
+      `;
+
+      var resolvedCss = styleUrlResolver.resolveUrls(css, 'base');
+      expect(resolvedCss).toEqual(expectedCss);
+    });
+
+    it('should support media query in "@import"', () => {
+      var styleUrlResolver = new StyleUrlResolver(new FakeUrlResolver());
+      var css = `
+      @import 'print.css' print;
+      @import url(print.css) print;
+      `;
+      var expectedCss = `
+      @import 'base/print.css' print;
+      @import url('base/print.css') print;
+      `;
+
+      var resolvedCss = styleUrlResolver.resolveUrls(css, 'base');
+      expect(resolvedCss).toEqual(expectedCss);
+    });
   });
 }