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
parent
4dd949b10e
commit
76cbdeb176
|
@ -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');
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
Loading…
Reference in New Issue