test(backdrop): coverage

Author: xidedix

CHANGELOG.md

@@ -1,6 +1,20 @@
 ### [@coreui/angular](https://coreui.io/angular/) changelog
 
 
+---
+
+#### `5.3.9` wip
+
+- fix(accordion): accordion item not expanded when visible=true on init (regression)
+- refactor(alert): signal inputs, host bindings, cleanup, tests
+- refactor(breadcrumb): signal inputs, host bindings, cleanup, tests
+- refactor(grid): signal inputs, host bindings, cleanup, tests
+- refactor(header): signal inputs, host bindings, cleanup, tests
+- refactor(theme.directive): signal inputs, host bindings, cleanup, tests
+- test(accordion): coverage
+- test(element-ref): update
+- test(backdrop): coverage
+
 ---
 
 #### `5.3.8`

projects/coreui-angular/src/lib/backdrop/backdrop.service.spec.ts

@@ -1,16 +1,59 @@
-import { TestBed } from '@angular/core/testing';
+import { fakeAsync, TestBed, tick } from '@angular/core/testing';
 
 import { BackdropService } from './backdrop.service';
+import { DOCUMENT } from '@angular/common';
 
 describe('BackdropService', () => {
   let service: BackdropService;
+  let document: Document;
+  let backdrop: any;
 
   beforeEach(() => {
     TestBed.configureTestingModule({});
     service = TestBed.inject(BackdropService);
+    document = TestBed.inject(DOCUMENT);
   });
 
+  afterAll(() => {
+    expect(document.querySelector('.modal-backdrop')).toBeNull();
+  }, 500);
+
   it('should be created', () => {
     expect(service).toBeTruthy();
   });
+
+  it('should set backdrop', fakeAsync(() => {
+    // expect(service.scrollbarWidth).toBe('0px');
+    expect(document.querySelector('.modal-backdrop')).toBeNull();
+    backdrop = service.setBackdrop();
+    tick();
+    expect(document.querySelector('.modal-backdrop')).not.toBeNull();
+    expect(backdrop).toHaveClass('modal-backdrop');
+    expect(backdrop).toHaveClass('fade');
+    expect(backdrop).toHaveClass('show');
+    service.clearBackdrop(backdrop);
+    expect(backdrop).not.toHaveClass('show');
+    expect(document.querySelector('.modal-backdrop')).not.toBeNull();
+  }));
+
+  it('should hide scrollbar', () => {
+    service.hideScrollbar();
+    expect(document.body.style.overflow).toBe('hidden');
+    // expect(document.body.style.paddingRight).toBe('0px');
+  });
+
+  it('should reset scrollbar', () => {
+    service.resetScrollbar();
+    expect(document.body.style.overflow).not.toBe('hidden');
+  });
+
+  it('should emit backdrop click', fakeAsync(() => {
+    backdrop = service.setBackdrop();
+    tick();
+    service.backdropClick$.subscribe((value) => {
+      expect(value).toBeTrue();
+    });
+    backdrop.dispatchEvent(new MouseEvent('click'));
+    service.clearBackdrop(backdrop);
+  }));
 });

projects/coreui-angular/src/lib/backdrop/backdrop.service.ts

@@ -6,7 +6,6 @@ import { Subject } from 'rxjs';
   providedIn: 'root'
 })
 export class BackdropService {
-
   readonly #backdropClick = new Subject<boolean>();
   readonly backdropClick$ = this.#backdropClick.asObservable();
 
@@ -58,7 +57,9 @@ export class BackdropService {
     return undefined;
   }
 
-  get #isRTL() { return this.#document.documentElement.dir === 'rtl' || this.#document.body.dir === 'rtl'; }
+  get #isRTL() {
+    return [this.#document.documentElement.dir, this.#document.body.dir].includes('rtl');
+  }
 
   #scrollBarVisible = true;