Merge branch 'development' into fix-memory-leaks

Author: lexasq

libs/common-docs/src/lib/common/top-menu/top-menu.component.ts

@@ -44,8 +44,11 @@ export class TopMenuComponent implements AfterViewInit {
       this.http
         .get<{ url: string; version: string; unprefixedUrl: string }[]>('assets/json/versions.json')
         .subscribe((data) => {
-          this.previousDocs.push(data[0]);
-          this.previousDocs = this.previousDocs.concat(data.reverse()).slice(0, -1);
+          this.previousDocs = data.sort((versionA, versionB) => {
+            const versionAsNumberA = Number(versionA.version.split('.').join(''));
+            const versionAsNumberB = Number(versionB.version.split('.').join(''));
+            return versionAsNumberB - versionAsNumberA;
+          });
         });
 
       this.http.get<{ version: string }>('assets/json/current-version.json').subscribe((data: { version: string }) => {

src/component-loader/component-loader.class.ts

@@ -226,6 +226,7 @@ export class ComponentLoader<T extends object> {
       );
     }
     this._contentRef?.viewRef?.destroy();
+    this._componentRef?.destroy();
 
     this._contentRef = void 0;
     this._componentRef = void 0;
@@ -312,12 +313,16 @@ export class ComponentLoader<T extends object> {
     if (!this._componentRef || !this._componentRef.location) {
       return;
     }
+
+    let unsubscribeOutsideClick = Function.prototype;
+    let unsubscribeEscClick = Function.prototype;
+
     // why: should run after first event bubble
     if (this._listenOpts.outsideClick) {
       const target = this._componentRef.location.nativeElement;
       setTimeout(() => {
         if (this._renderer && this._elementRef) {
-          this._globalListener = registerOutsideClick(this._renderer, {
+          unsubscribeOutsideClick = registerOutsideClick(this._renderer, {
             targets: [target, this._elementRef.nativeElement],
             outsideClick: this._listenOpts.outsideClick,
             hide: () => this._listenOpts.hide && this._listenOpts.hide()
@@ -327,12 +332,17 @@ export class ComponentLoader<T extends object> {
     }
     if (this._listenOpts.outsideEsc && this._renderer && this._elementRef) {
       const target = this._componentRef.location.nativeElement;
-      this._globalListener = registerEscClick(this._renderer, {
+      unsubscribeEscClick = registerEscClick(this._renderer, {
         targets: [target, this._elementRef.nativeElement],
         outsideEsc: this._listenOpts.outsideEsc,
         hide: () => this._listenOpts.hide && this._listenOpts.hide()
       });
     }
+
+    this._globalListener = () => {
+      unsubscribeOutsideClick();
+      unsubscribeEscClick();
+    };
   }
 
   getInnerComponent(): ComponentRef<T> | undefined {

src/datepicker/bs-datepicker-input.directive.ts

@@ -190,6 +190,7 @@ export class BsDatepickerInputDirective implements ControlValueAccessor, Validat
     }
 
     this._picker.bsValue = this._value;
+    this._onChange(this._value);
   }
 
   setDisabledState(isDisabled: boolean): void {

src/datepicker/testing/bs-daterangepicker.spec.ts

@@ -7,6 +7,7 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { By } from '@angular/platform-browser';
 import { BsCustomDates } from '../themes/bs/bs-custom-dates-view.component';
+import { firstValueFrom } from 'rxjs';
 
 @Component({
     selector: 'test-cmp',
@@ -87,7 +88,7 @@ describe('daterangepicker:', () => {
     expect(timepickerZone).not.toBeTruthy();
   });
 
-  it('should update time when time is changed in timepicker', () => {
+  it('should update time when time is changed in timepicker', (done) => {
     const directive = getDaterangepickerDirective(fixture);
     directive.bsConfig = {
       withTimepicker: true
@@ -119,6 +120,7 @@ describe('daterangepicker:', () => {
       .subscribe(view => {
         expect(view[0].getMinutes()).toEqual(ranges[1].value[0].getMinutes());
         expect(view[1].getMinutes()).toEqual(ranges[1].value[1].getMinutes());
+        done();
       });
   });
 
@@ -185,7 +187,7 @@ describe('daterangepicker:', () => {
         expect(getDaterangepickerContainer(datepicker)).toBeNull();
     });
 
-    it('should display correct date range in input when selected from ranges', () => {
+    it('should display correct date range in input when selected from ranges', (done) => {
         const datepicker = showDatepicker(fixture);
         const ranges = [
             {
@@ -207,6 +209,7 @@ describe('daterangepicker:', () => {
             .select(state => state.selectedRange)
             .subscribe(view => {
                 expect(view).toEqual(ranges[0].value);
+                done();
             });
     });
 
@@ -230,31 +233,6 @@ describe('daterangepicker:', () => {
 
         const rangesButton = document.querySelector('.bs-datepicker-predefined-btns');
         expect(rangesButton.childElementCount).toEqual(ranges.length);
-
-    });
-
-    it('should display correct date range in input when selected from ranges', () => {
-        const datepicker = showDatepicker(fixture);
-        const ranges = [
-            {
-                label: 'Last 7 days',
-                value: [new Date('12-10-2019'), new Date('12-16-2019')]
-            },
-            {
-                label: 'Next 7 days',
-                value: [new Date('12-16-2019'), new Date('12-22-2019')]
-            }
-        ];
-        datepicker.bsConfig.ranges = ranges;
-        const datepickerContainerInstance = getDaterangepickerContainer(datepicker);
-        datepickerContainerInstance.setRangeOnCalendar(ranges[0]);
-
-        fixture.detectChanges();
-        datepickerContainerInstance[`_store`]
-            .select(state => state.selectedRange)
-            .subscribe(view => {
-                expect(view).toEqual(ranges[0].value);
-            });
     });
 
     it('should correctly display the selected range button with active custom class', () => {
@@ -286,7 +264,7 @@ describe('daterangepicker:', () => {
         expect(activeRangeButton[0].innerHTML.trim()).toEqual(ranges[0].label);
     });
 
-  it('should not allow to select date behind max value', () => {
+  it('should not allow to select date behind max value', async () => {
     const datepicker = showDatepicker(fixture);
     datepicker.bsConfig.maxDate = new Date();
     datepicker.bsConfig.maxDateRange = 10;
@@ -300,15 +278,12 @@ describe('daterangepicker:', () => {
       value: [correctDateStart, correctDateEnd]
     };
 
-    datepickerContainerInstance.setMaxDateRangeOnCalendar(correctDateStart);
+    datepickerContainerInstance.setMaxDateRangeOnCalendar(correctDateEnd);
     datepickerContainerInstance.setRangeOnCalendar(selectedRange);
     fixture.detectChanges();
 
-    datepickerContainerInstance[`_store`]
-      .select(state => state)
-      .subscribe(view => {
-        expect(view.maxDate).toEqual(correctDateEnd);
-      });
+    let view = await firstValueFrom(datepickerContainerInstance[`_store`].select((state) => state));
+    expect(view.maxDate).toEqual(correctDateEnd);
 
     const incorrectCaseStart = new Date(new Date().setDate(new Date().getDate() - 5));
     const incorrectCaseEnd = new Date(new Date().setDate(new Date().getDate() + 15));
@@ -321,10 +296,7 @@ describe('daterangepicker:', () => {
     datepickerContainerInstance.setRangeOnCalendar(selectedRange1);
     fixture.detectChanges();
 
-    datepickerContainerInstance[`_store`]
-      .select(state => state)
-      .subscribe(view => {
-        expect(view.maxDate).not.toEqual(incorrectCaseEnd);
-      });
-  });
+    view = await firstValueFrom(datepickerContainerInstance[`_store`].select((state) => state));
+    expect(view.maxDate).not.toEqual(incorrectCaseEnd);
   });
+});