add tooltip and tests passing

NREL · Sep 10, 2024 · 2ea6511 · 2ea6511
1 parent 62523c9
commit 2ea6511
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 16 deletions.
diff --git a/src/app/setup-wizard/pre-visit/company-setup/company-setup.component.spec.ts b/src/app/setup-wizard/pre-visit/company-setup/company-setup.component.spec.ts
@@ -14,6 +14,7 @@ import { CompanyIdbService } from 'src/app/indexed-db/company-idb.service';
 import { FacilityIdbService } from 'src/app/indexed-db/facility-idb.service';
 import { OnSiteVisitIdbService } from 'src/app/indexed-db/on-site-visit-idb.service';
 import { IdbOnSiteVisit, getNewIdbOnSiteVisit } from 'src/app/models/onSiteVisit';
+import { LabelWithTooltipModule } from 'src/app/shared/label-with-tooltip/label-with-tooltip.module';
 
 describe('CompanySetupComponent', () => {
   let component: CompanySetupComponent;
@@ -37,7 +38,7 @@ describe('CompanySetupComponent', () => {
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      imports: [FontAwesomeModule, SharedSettingsFormsModule, FormsModule, ReactiveFormsModule],
+      imports: [FontAwesomeModule, SharedSettingsFormsModule, FormsModule, ReactiveFormsModule, LabelWithTooltipModule],
       declarations: [CompanySetupComponent],
       providers: [
         { provide: UserIdbService, useValue: userIdbService },

diff --git a/src/app/shared/label-with-tooltip/label-with-tooltip.component.spec.ts b/src/app/shared/label-with-tooltip/label-with-tooltip.component.spec.ts
@@ -1,13 +1,15 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 
 import { LabelWithTooltipComponent } from './label-with-tooltip.component';
+import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
 
 describe('LabelWithTooltipComponent', () => {
   let component: LabelWithTooltipComponent;
   let fixture: ComponentFixture<LabelWithTooltipComponent>;
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
+      imports: [FontAwesomeModule],
       declarations: [LabelWithTooltipComponent]
     })
     .compileComponents();

diff --git a/src/app/shared/label-with-tooltip/label-with-tooltip.component.ts b/src/app/shared/label-with-tooltip/label-with-tooltip.component.ts
@@ -1,19 +1,20 @@
 import { Component, Input } from '@angular/core';
 import { LabelTooltips } from './LabelTooltips';
 import { faQuestionCircle, IconDefinition } from '@fortawesome/free-solid-svg-icons';
-declare var bootstrap: any;
+
+import * as bootstrap from 'bootstrap';
 
 @Component({
   selector: 'app-label-with-tooltip',
   templateUrl: './label-with-tooltip.component.html',
   styleUrl: './label-with-tooltip.component.css'
 })
 export class LabelWithTooltipComponent {
-  @Input({required: true})
+  @Input({ required: true })
   field: string;
   @Input()
   label: string;
-  @Input({required: true})
+  @Input({ required: true })
   labelId: string;
 
   @Input()
@@ -35,28 +36,32 @@ export class LabelWithTooltipComponent {
 
   ngOnInit(): void {
     this.helpTooltip = LabelTooltips[this.field];
-    if(!this.helpTooltip){
+    if (!this.helpTooltip) {
       this.helpTooltip = {
         tooltip: 'Help Text Missing. Sorry :/'
       }
     }
   }
 
-  ngAfterViewInit(){
+  ngAfterViewInit() {
     // Bootstrap tooltip initialization
-    var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
-    this.tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
-    return new bootstrap.Tooltip(tooltipTriggerEl)
-    }) 
+    if (bootstrap) {
+      var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
+      this.tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
+        return new bootstrap.Tooltip(tooltipTriggerEl)
+      })
+    }
   }
 
-  ngOnDestroy(){
-    for (const tooltip of this.tooltipList) {
-      tooltip.dispose();
+  ngOnDestroy() {
+    if (this.tooltipList) {
+      for (const tooltip of this.tooltipList) {
+        tooltip.dispose();
+      }
+      this.tooltipList = new Array<any>();
     }
-    this.tooltipList = new Array<any>();
   }
-  
+
   hideTooltipHover() {
     this.showTooltipHover = false;
   }
@@ -65,7 +70,7 @@ export class LabelWithTooltipComponent {
     this.showTooltipHover = true;
   }
 
-  toggleClickTooltip(){
+  toggleClickTooltip() {
     this.showTooltipClick = !this.showTooltipClick;
   }
 }