MOBILE-4616 database: Fix loading of custom CSS

Custom CSS was not loaded if the text passed to core-compile-html was
initially empty and changed afterwards.
main
Albert Gasset 2024-10-17 12:33:08 +02:00
parent 4dd949b10e
commit 76cbdeb176
1 changed files with 6 additions and 3 deletions

View File

@ -91,6 +91,7 @@ export class CoreCompileHtmlComponent implements OnChanges, OnDestroy, DoCheck {
protected differ: KeyValueDiffer<unknown, unknown>; // To detect changes in the jsData input. protected differ: KeyValueDiffer<unknown, unknown>; // To detect changes in the jsData input.
protected creatingComponent = false; protected creatingComponent = false;
protected pendingCalls = {}; protected pendingCalls = {};
protected componentStyles = '';
constructor( constructor(
protected changeDetector: ChangeDetectorRef, protected changeDetector: ChangeDetectorRef,
@ -152,7 +153,7 @@ export class CoreCompileHtmlComponent implements OnChanges, OnDestroy, DoCheck {
componentClass, componentClass,
this.container, this.container,
this.extraImports, this.extraImports,
this.cssCode, this.componentStyles,
); );
this.element.addEventListener('submit', (event) => { this.element.addEventListener('submit', (event) => {
@ -185,7 +186,7 @@ export class CoreCompileHtmlComponent implements OnChanges, OnDestroy, DoCheck {
protected async loadCSSCode(): Promise<void> { protected async loadCSSCode(): Promise<void> {
// Do not allow (yet) to load CSS code to a component that doesn't have text. // Do not allow (yet) to load CSS code to a component that doesn't have text.
if (!this.text) { if (!this.text) {
this.cssCode = ''; this.componentStyles = '';
return; return;
} }
@ -196,10 +197,12 @@ export class CoreCompileHtmlComponent implements OnChanges, OnDestroy, DoCheck {
// Prepend all CSS rules with :host to avoid conflicts. // Prepend all CSS rules with :host to avoid conflicts.
if (!this.cssCode || this.cssCode.includes(':host')) { if (!this.cssCode || this.cssCode.includes(':host')) {
this.componentStyles = this.cssCode ?? '';
return; return;
} }
this.cssCode = CoreDom.prefixCSS(this.cssCode, ':host ::ng-deep', ':host'); this.componentStyles = CoreDom.prefixCSS(this.cssCode, ':host ::ng-deep', ':host');
} }
/** /**