How to use the ngx-bootstrap/collapse.CollapseModule.forRoot function in ngx-bootstrap

return abp.localization.currentLanguage.name;
  }

  // todo: Waiting for https://github.com/angular/angular/issues/31465 to be fixed.
  return 'en';
}

@NgModule({
  imports: [
    BrowserModule,
    BrowserAnimationsModule,
    HttpClientModule,
    SharedModule.forRoot(),
    ModalModule.forRoot(),
    BsDropdownModule.forRoot(),
    CollapseModule.forRoot(),
    TabsModule.forRoot(),
    AbpModule,
    ServiceProxyModule,
    RootRoutingModule,
  ],
  declarations: [RootComponent],
  providers: [
    { provide: HTTP_INTERCEPTORS, useClass: AbpHttpInterceptor, multi: true },
    {
      provide: APP_INITIALIZER,
      useFactory: (appInitializer: AppInitializer) => appInitializer.init(),
      deps: [AppInitializer],
      multi: true,
    },
    { provide: API_BASE_URL, useFactory: () => AppConsts.remoteServiceBaseUrl },
    {

import {RouterProxyComponent} from "./components/router-proxy.component";
import {RoutingModule} from "./app.routing.module";
import {createAppMetaReducer, createErrorHandlingMetaReducer, reducers} from "./store/reducers/root";

export const APP_MODULE_NG_CONF: NgModule = {
    declarations: [
        AppComponent,
        RouterProxyComponent,
    ],
    imports: [
        BrowserModule,
        RoutingModule,
        BrowserAnimationsModule,
        CoreModule,
        AccordionModule.forRoot(),
        CollapseModule.forRoot(),
        BsDropdownModule.forRoot(),
        PopoverModule.forRoot(),
        StoreModule.forRoot(
            reducers,
            {
                runtimeChecks: {
                    strictStateImmutability: true,
                    strictActionImmutability: true,
                    // strictStateSerializability: true,
                    // strictActionSerializability: true,
                },
            },
        ),
        StoreModule.forFeature(AccountsReducer.featureName, AccountsReducer.reducer),
        StoreModule.forFeature(DbViewReducer.featureName, DbViewReducer.reducer),
        StoreModule.forFeature(ErrorsReducer.featureName, ErrorsReducer.reducer),

// Bootstrap modules
import { CollapseModule } from 'ngx-bootstrap/collapse';
import { HomeComponent } from './containers/home/home.component';



@NgModule({
  declarations: [
    AppComponent,
    HeaderComponent,
    HomeComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    CollapseModule.forRoot(),
    ToastModule.forRoot(),
    BrowserAnimationsModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

import { TooltipModule } from 'ngx-bootstrap/tooltip';
import { TooltipsComponent } from './tooltips.component';


// Components Routing
import { BaseRoutingModule } from './base-routing.module';

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    BaseRoutingModule,
    BsDropdownModule.forRoot(),
    TabsModule,
    CarouselModule.forRoot(),
    CollapseModule.forRoot(),
    PaginationModule.forRoot(),
    PopoverModule.forRoot(),
    ProgressbarModule.forRoot(),
    TooltipModule.forRoot()
  ],
  declarations: [
    CardsComponent,
    FormsComponent,
    SwitchesComponent,
    TablesComponent,
    TabsComponent,
    CarouselsComponent,
    CollapsesComponent,
    PaginationsComponent,
    PopoversComponent,
    ProgressComponent,

describe('DeploymentsComponent', () => {
  let service: jasmine.SpyObj;

  beforeEach(async(function(): void {
    service = createMock(DeploymentsService);
    service.getApplications.and.returnValue(of(['foo-app', 'bar-app']));
    service.getEnvironments.and.returnValue(of(['stage', 'prod']));
    service.ngOnDestroy.and.callThrough();
    TestBed.overrideProvider(DeploymentsService, { useValue: service });
  }));

  const testContext = initContext(DeploymentsComponent, HostComponent, {
    imports: [CollapseModule.forRoot()],
    providers: [
      {
        provide: Spaces,
        useValue: { current: of({ id: 'fake-spaceId' }) },
      },
    ],
    schemas: [NO_ERRORS_SCHEMA],
  });

  it('should set service result to applications property', function(done: DoneFn) {
    testContext.testedDirective.applications.subscribe((applications) => {
      expect(service.getApplications).toHaveBeenCalledWith('fake-spaceId');
      expect(applications).toEqual(['foo-app', 'bar-app']);
      done();
    });
  });

describe('DeploymentsResourceUsageComponent', () => {

  const mockEnvironmentData: string[] = ['envId1', 'envId2'];

  const testContext = initContext(DeploymentsResourceUsageComponent, HostComponent,
    {
      imports: [CollapseModule.forRoot()],
      declarations: [FakeResourceCardComponent]
    },
    (component: DeploymentsResourceUsageComponent): void => {
      component.environments = of(mockEnvironmentData);
      component.spaceId = of('spaceId');
    }
  );

  it('should create children components with proper environment objects', (): void => {
    const arrayOfComponents: DebugElement[] =
      testContext.fixture.debugElement.queryAll(By.directive(FakeResourceCardComponent));
    expect(arrayOfComponents.length).toEqual(mockEnvironmentData.length);

    mockEnvironmentData.forEach((envData: string, index: number): void => {
      const cardComponent: FakeResourceCardComponent = arrayOfComponents[index].componentInstance;
      expect(cardComponent.environment).toEqual(mockEnvironmentData[index]);

describe('DeploymentsResourceUsageComponent', () => {
  const mockEnvironmentData: string[] = ['envId1', 'envId2'];

  const testContext = initContext(
    DeploymentsResourceUsageComponent,
    HostComponent,
    {
      imports: [CollapseModule.forRoot()],
      declarations: [FakeResourceCardComponent],
    },
    (component: DeploymentsResourceUsageComponent): void => {
      component.environments = of(mockEnvironmentData);
      component.spaceId = of('spaceId');
    },
  );

  it('should create children components with proper environment objects', (): void => {
    const arrayOfComponents: DebugElement[] = testContext.fixture.debugElement.queryAll(
      By.directive(FakeResourceCardComponent),
    );
    expect(arrayOfComponents.length).toEqual(mockEnvironmentData.length);

    mockEnvironmentData.forEach(
      (envData: string, index: number): void => {

max: jasmine.createSpy('max'),
        },
        data: {
          colors: jasmine.createSpy('colors'),
        },
        destroy: jasmine.createSpy('destroy'),
        flush: jasmine.createSpy('flush'),
      };
    },
  );

  const testContext = initContext(
    DeploymentDetailsComponent,
    HostComponent,
    {
      imports: [CollapseModule.forRoot()],
      declarations: [FakeDeploymentsDonutComponent, FakeDeploymentGraphLabelComponent],
      providers: [
        {
          provide: DeploymentsService,
          useFactory: (): jasmine.SpyObj => {
            const svc: jasmine.SpyObj = createMock(DeploymentsService);
            svc.getVersion.and.returnValue(of('1.2.3'));
            svc.getDeploymentCpuStat.and.returnValue(
              new BehaviorSubject([{ used: 1, quota: 2, timestamp: 1 }]),
            );
            svc.getDeploymentMemoryStat.and.returnValue(
              new BehaviorSubject([{ used: 3, quota: 4, units: 'GB', timestamp: 1 }]),
            );
            svc.getAppUrl.and.returnValue(of('mockAppUrl'));
            svc.getConsoleUrl.and.returnValue(of('mockConsoleUrl'));
            svc.getLogsUrl.and.returnValue(of('mockLogsUrl'));

import { DeploymentsDonutChartComponent } from './deployments-donut/deployments-donut-chart/deployments-donut-chart.component';
import { DeploymentsDonutComponent } from './deployments-donut/deployments-donut.component';
import { DeploymentsLinechartComponent } from './deployments-linechart/deployments-linechart.component';
import { DeploymentsRoutingModule } from './deployments-routing.module';
import { DeploymentsToolbarComponent } from './deployments-toolbar/deployments-toolbar.component';
import { DeploymentsComponent } from './deployments.component';
import { DeploymentsResourceUsageComponent } from './resource-usage/deployments-resource-usage.component';
import { LoadingUtilizationBarComponent } from './resource-usage/loading-utilization-bar.component';
import { ResourceCardComponent } from './resource-usage/resource-card.component';
import { UtilizationBarComponent } from './resource-usage/utilization-bar.component';
import { DeploymentApiService } from './services/deployment-api.service';

@NgModule({
  imports: [
    BsDropdownModule.forRoot(),
    CollapseModule.forRoot(),
    AccordionModule.forRoot(),
    TooltipModule.forRoot(),
    CommonModule,
    DeploymentsRoutingModule,
    ModalModule.forRoot(),
    SparklineChartModule,
    ToolbarModule
  ],
  declarations: [
    DeleteDeploymentModal,
    DeploymentsComponent,
    DeploymentCardContainerComponent,
    DeploymentCardComponent,
    DeploymentGraphLabelComponent,
    DeploymentStatusIconComponent,
    DeploymentsAppsComponent,

async(() => {
      TestBed.configureTestingModule({
        imports: [CollapseModule.forRoot(), ModalModule.forRoot(), PopoverModule.forRoot()],
        declarations: [FooterComponent],
      })
        .compileComponents()
        .then(() => {
          fixture = TestBed.createComponent(FooterComponent);
          component = fixture.componentInstance;
          element = fixture.nativeElement;
        });
    })
  );