From b86ae049329af6079875b9afbacf900847651435 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Morten=20Sj=C3=B8gren?= <m_abs@mabs.dk>
Date: Sat, 8 Jun 2019 18:35:41 +0200
Subject: [PATCH 1/2] fix(1845): CSS special selector ":host" only work first
 time

---
 nativescript-angular/renderer.ts | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/nativescript-angular/renderer.ts b/nativescript-angular/renderer.ts
index 450c27f5d..aadc69a1a 100644
--- a/nativescript-angular/renderer.ts
+++ b/nativescript-angular/renderer.ts
@@ -57,8 +57,12 @@ export class NativeScriptRendererFactory implements RendererFactory2 {
             return this.defaultRenderer;
         }
 
-        let renderer: NativeScriptRenderer = this.componentRenderers.get(type.id);
+        let renderer = this.componentRenderers.get(type.id);
         if (renderer) {
+            if (renderer instanceof EmulatedRenderer) {
+                renderer.applyToHost(element);
+            }
+
             return renderer;
         }
 

From d8eadfd588dfc046c7197dc943b923aea2457a51 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Morten=20Anton=20Bach=20Sj=C3=B8gren?= <msn@nota.dk>
Date: Wed, 12 Jun 2019 12:38:32 +0200
Subject: [PATCH 2/2] test(HostSelector): Adds test for the :host css-selector

---
 tests/app/tests/renderer-tests.ts | 45 +++++++++++++++++++++++++++++++
 1 file changed, 45 insertions(+)

diff --git a/tests/app/tests/renderer-tests.ts b/tests/app/tests/renderer-tests.ts
index 2a0984ed3..49c59ff2a 100644
--- a/tests/app/tests/renderer-tests.ts
+++ b/tests/app/tests/renderer-tests.ts
@@ -16,6 +16,7 @@ import { View, fontInternalProperty, backgroundInternalProperty } from "tns-core
 import { nsTestBedAfterEach, nsTestBedBeforeEach, nsTestBedRender } from "nativescript-angular/testing";
 import { ComponentFixture, TestBed, async } from "@angular/core/testing";
 import { Observable, ReplaySubject } from "rxjs";
+import { Label } from "tns-core-modules/ui/label/label";
 
 @Component({
     template: `<StackLayout><Label text="Layout"></Label></StackLayout>`
@@ -97,6 +98,37 @@ export class StyledLabelCmp2 {
     }
 }
 
+@Component({
+    selector: "host-styled",
+    styles: [`
+        Label {
+            color: blue;
+        }
+
+        :host Label {
+            color: red;
+        }
+    `
+    ],
+    template: `<Label text="Styled!"></Label>`
+})
+export class HostStyledCmp {
+    constructor(public elementRef: ElementRef<ProxyViewContainer>) {
+    }
+}
+
+@Component({
+    selector: "host-styled-parent",
+    template: `
+        <host-styled></host-styled>
+        <host-styled></host-styled>
+    `
+})
+export class HostStyledParentCmp {
+    constructor(public elementRef: ElementRef<ProxyViewContainer>) {
+    }
+}
+
 @Component({
     selector: "ng-if-label",
     template: `<Label *ngIf="show" text="iffed"></Label>`
@@ -251,6 +283,7 @@ describe("Renderer E2E", () => {
         LayoutWithLabel, LabelCmp, LabelContainer,
         ProjectableCmp, ProjectionContainer,
         StyledLabelCmp, StyledLabelCmp2,
+        HostStyledCmp, HostStyledParentCmp,
         NgIfLabel, NgIfThenElseComponent, NgIfMultiple,
         NgIfTwoElements, NgIfMultiple,
         NgIfElseComponent, NgIfThenElseComponent,
@@ -293,6 +326,18 @@ describe("Renderer E2E", () => {
         });
     });
 
+    it("applies component :host styles", () => {
+        return nsTestBedRender(HostStyledParentCmp).then((fixture) => {
+            const proxyView = fixture.componentRef.instance.elementRef.nativeElement;
+
+            for (let i = 0; i < 2; i += 1) {
+                const child = proxyView.getChildAt(i) as ProxyViewContainer;
+                const label = child.getChildAt(0) as Label;
+                assert.equal(Red, label.style.color.hex);
+            }
+        });
+    });
+
     it("applies component styles from multiple sources", () => {
         return nsTestBedRender(StyledLabelCmp2).then((fixture) => {
             const componentRef: ComponentRef<StyledLabelCmp2> = fixture.componentRef;