fix(platform-server): interpret Native view encapsulation as Emulated on the server (#15155)

PR Close #15155

packages/platform-server/src/server_renderer.ts

@@ -29,6 +29,7 @@ export class ServerRendererFactory2 implements RendererFactory2 {
       return this.defaultRenderer;
     }
     switch (type.encapsulation) {
+      case ViewEncapsulation.Native:
       case ViewEncapsulation.Emulated: {
         let renderer = this.rendererByCompId.get(type.id);
         if (!renderer) {

packages/platform-server/test/integration_spec.ts

@@ -8,7 +8,7 @@
 
 import {animate, style, transition, trigger} from '@angular/animations';
 import {APP_BASE_HREF, PlatformLocation, isPlatformServer} from '@angular/common';
-import {ApplicationRef, CompilerFactory, Component, HostListener, NgModule, NgModuleRef, NgZone, PLATFORM_ID, PlatformRef, destroyPlatform, getPlatform} from '@angular/core';
+import {ApplicationRef, CompilerFactory, Component, HostListener, NgModule, NgModuleRef, NgZone, PLATFORM_ID, PlatformRef, ViewEncapsulation, destroyPlatform, getPlatform} from '@angular/core';
 import {TestBed, async, inject} from '@angular/core/testing';
 import {Http, HttpModule, Response, ResponseOptions, XHRBackend} from '@angular/http';
 import {MockBackend, MockConnection} from '@angular/http/testing';
@@ -149,6 +149,23 @@ class ImageApp {
 class ImageExampleModule {
 }
 
+@Component({
+  selector: 'app',
+  template: 'Native works',
+  encapsulation: ViewEncapsulation.Native,
+  styles: [':host { color: red; }']
+})
+class NativeEncapsulationApp {
+}
+
+@NgModule({
+  declarations: [NativeEncapsulationApp],
+  imports: [BrowserModule.withServerTransition({appId: 'test'}), ServerModule],
+  bootstrap: [NativeEncapsulationApp]
+})
+class NativeExampleModule {
+}
+
 export function main() {
   if (getDOM().supportsDOMEvents()) return;  // NODE only
 
@@ -381,6 +398,14 @@ export function main() {
              called = true;
            });
          }));
+
+      it('should handle ViewEncapsulation.Native', async(() => {
+           renderModule(NativeExampleModule, {document: doc}).then(output => {
+             expect(output).not.toBe('');
+             expect(output).toContain('color: red');
+             called = true;
+           });
+         }));
     });
 
     describe('http', () => {