feat: apply styles when adding them to the application scope (#7652)

tns-core-modules/application/application-common.ts

@@ -117,10 +117,6 @@ export function loadAppCss(): void {
     }
 }
 
-export function addCss(cssText: string): void {
-    events.notify(<CssChangedEventData>{ eventName: "cssChanged", object: app, cssText: cssText });
-}
-
 global.__onUncaughtError = function (error: NativeScriptError) {
     events.notify(<UnhandledErrorEventData>{ eventName: uncaughtErrorEvent, object: app, android: error, ios: error, error: error });
 };

tns-core-modules/application/application.android.ts

@@ -1,7 +1,8 @@
 import {
     AndroidActivityBundleEventData, AndroidActivityEventData, ApplicationEventData, OrientationChangedEventData,
     AndroidApplication as AndroidApplicationDefinition, AndroidActivityNewIntentEventData,
-    AndroidActivityResultEventData, AndroidActivityBackPressedEventData, AndroidActivityRequestPermissionsEventData
+    AndroidActivityResultEventData, AndroidActivityBackPressedEventData, AndroidActivityRequestPermissionsEventData,
+    CssChangedEventData
 } from ".";
 
 import {
@@ -151,6 +152,14 @@ export function run(entry?: NavigationEntry | string) {
     _start(entry);
 }
 
+export function addCss(cssText: string): void {
+    notify(<CssChangedEventData>{ eventName: "cssChanged", object: androidApp, cssText: cssText });
+    const rootView = getRootView();
+    if (rootView) {
+        rootView._onCssStateChange();
+    }
+}
+
 const CALLBACKS = "_callbacks";
 
 export function _resetRootView(entry?: NavigationEntry | string) {

tns-core-modules/application/application.d.ts

@@ -168,6 +168,10 @@ export function getCssFileName(): string;
  */
 export function loadAppCss();
 
+/**
+* Adds new values to the application styles.
+* @param cssText - A valid styles which will be added to the current application styles.
+*/
 export function addCss(cssText: string): void;
 
 /**

tns-core-modules/application/application.ios.ts

@@ -1,9 +1,10 @@
 import {
     iOSApplication as IOSApplicationDefinition,
-    LaunchEventData,
     ApplicationEventData,
-    OrientationChangedEventData,
-    LoadAppCSSEventData
+    CssChangedEventData,
+    LaunchEventData,
+    LoadAppCSSEventData,
+    OrientationChangedEventData
 } from ".";
 
 import {
@@ -349,6 +350,14 @@ export function run(entry?: string | NavigationEntry) {
     _start(entry);
 }
 
+export function addCss(cssText: string): void {
+    notify(<CssChangedEventData>{ eventName: "cssChanged", object: <any>iosApp, cssText: cssText });
+    const rootView = getRootView();
+    if (rootView) {
+        rootView._onCssStateChange();
+    }
+}
+
 export function _resetRootView(entry?: NavigationEntry | string) {
     createRootFrame.value = false;
     mainEntry = typeof entry === "string" ? { moduleName: entry } : entry;