diff --git a/packages/compiler/src/shadow_css.ts b/packages/compiler/src/shadow_css.ts
index 15e805c00f3c9e..c7a85a62bbbffb 100644
--- a/packages/compiler/src/shadow_css.ts
+++ b/packages/compiler/src/shadow_css.ts
@@ -135,8 +135,6 @@
 export class ShadowCss {
   strictStyling: boolean = true;
 
-  constructor() {}
-
   /*
    * Shim some cssText with the given selector. Returns cssText that can
    * be included in the document via WebComponents.ShadowCSS.addCssToDocument(css).
@@ -367,12 +365,12 @@ export class ShadowCss {
     return processRules(cssText, (rule: CssRule) => {
       let selector = rule.selector;
       let content = rule.content;
-      if (rule.selector[0] != '@') {
+      if (rule.selector[0] !== '@') {
         selector =
             this._scopeSelector(rule.selector, scopeSelector, hostSelector, this.strictStyling);
       } else if (
           rule.selector.startsWith('@media') || rule.selector.startsWith('@supports') ||
-          rule.selector.startsWith('@page') || rule.selector.startsWith('@document')) {
+          rule.selector.startsWith('@document')) {
         content = this._scopeSelectors(rule.content, scopeSelector, hostSelector);
       } else if (rule.selector.startsWith('@font-face')) {
         content = this._stripScopingSelectors(rule.content, scopeSelector, hostSelector);
@@ -792,7 +790,7 @@ function combineHostContextSelectors(contextSelectors: string[], otherSelectors:
  *     in-place.
  * @param multiples The number of times the current groups should appear.
  */
-export function repeatGroups<T>(groups: string[][], multiples: number): void {
+export function repeatGroups(groups: string[][], multiples: number): void {
   const length = groups.length;
   for (let i = 1; i < multiples; i++) {
     for (let j = 0; j < length; j++) {
diff --git a/packages/compiler/test/ng_module_resolver_spec.ts b/packages/compiler/test/ng_module_resolver_spec.ts
index 572890edad839a..1526da8b51599d 100644
--- a/packages/compiler/test/ng_module_resolver_spec.ts
+++ b/packages/compiler/test/ng_module_resolver_spec.ts
@@ -7,15 +7,28 @@
  */
 
 import {NgModuleResolver} from '@angular/compiler/src/ng_module_resolver';
-import {ɵstringify as stringify} from '@angular/core';
-import {NgModule} from '@angular/core/src/metadata';
+import {Component, Directive, Injectable, NgModule, ɵstringify as stringify} from '@angular/core';
 import {JitReflector} from '@angular/platform-browser-dynamic/src/compiler_reflector';
 
-class SomeClass1 {}
-class SomeClass2 {}
-class SomeClass3 {}
-class SomeClass4 {}
-class SomeClass5 {}
+@Directive()
+class SomeClass1 {
+}
+
+@NgModule()
+class SomeClass2 {
+}
+
+@NgModule()
+class SomeClass3 {
+}
+
+@Injectable()
+class SomeClass4 {
+}
+
+@Component({template: ''})
+class SomeClass5 {
+}
 
 @NgModule({
   declarations: [SomeClass1],
diff --git a/packages/compiler/test/shadow_css_spec.ts b/packages/compiler/test/shadow_css_spec.ts
index 16ddc93d0f61ae..1f883b8f9bde99 100644
--- a/packages/compiler/test/shadow_css_spec.ts
+++ b/packages/compiler/test/shadow_css_spec.ts
@@ -14,8 +14,11 @@ import {normalizeCSS} from '@angular/platform-browser/testing/src/browser_util';
     function s(css: string, contentAttr: string, hostAttr: string = '') {
       const shadowCss = new ShadowCss();
       const shim = shadowCss.shimCssText(css, contentAttr, hostAttr);
-      const nlRegexp = /\n/g;
-      return normalizeCSS(shim.replace(nlRegexp, ''));
+      return normalize(shim);
+    }
+
+    function normalize(value: string): string {
+      return normalizeCSS(value.replace(/\n/g, '')).trim();
     }
 
     it('should handle empty string', () => {
@@ -53,10 +56,40 @@ import {normalizeCSS} from '@angular/platform-browser/testing/src/browser_util';
       expect(s(css, 'contenta')).toEqual(expected);
     });
 
-    it('should handle page rules', () => {
-      const css = '@page {div {font-size:50px;}}';
-      const expected = '@page {div[contenta] {font-size:50px;}}';
-      expect(s(css, 'contenta')).toEqual(expected);
+    // @page rules use a special set of at-rules and selectors and they can't be scoped.
+    // See: https://www.w3.org/TR/css-page-3
+    it('should preserve @page rules', () => {
+      const contentAttr = 'contenta';
+      const css = `
+        @page {
+          margin-right: 4in;
+
+          @top-left {
+            content: "Hamlet";
+          }
+
+          @top-right {
+            content: "Page " counter(page);
+          }
+        }
+
+        @page main {
+          margin-left: 4in;
+        }
+
+        @page :left {
+          margin-left: 3cm;
+          margin-right: 4cm;
+        }
+
+        @page :right {
+          margin-left: 4cm;
+          margin-right: 3cm;
+        }
+      `;
+      const result = s(css, contentAttr);
+      expect(result).toEqual(normalize(css));
+      expect(result).not.toContain(contentAttr);
     });
 
     it('should handle document rules', () => {