diff --git a/libs/angular/src/jslib.module.ts b/libs/angular/src/jslib.module.ts
index 6ef2cf1d4d..89e6cfeacb 100644
--- a/libs/angular/src/jslib.module.ts
+++ b/libs/angular/src/jslib.module.ts
@@ -85,11 +85,11 @@ import { IconComponent } from "./vault/components/icon.component";
TextDragDirective,
CopyClickDirective,
A11yTitleDirective,
+ AutofocusDirective,
],
declarations: [
A11yInvalidDirective,
ApiActionDirective,
- AutofocusDirective,
BoxRowDirective,
DeprecatedCalloutComponent,
CopyTextDirective,
diff --git a/libs/components/src/button/button.component.spec.ts b/libs/components/src/button/button.component.spec.ts
index b20e4148b6..6ddbc17280 100644
--- a/libs/components/src/button/button.component.spec.ts
+++ b/libs/components/src/button/button.component.spec.ts
@@ -1,7 +1,5 @@
-// FIXME: Update this file to be type safe and remove this and next line
-// @ts-strict-ignore
import { Component, DebugElement } from "@angular/core";
-import { ComponentFixture, TestBed, waitForAsync } from "@angular/core/testing";
+import { ComponentFixture, TestBed } from "@angular/core/testing";
import { By } from "@angular/platform-browser";
import { ButtonModule } from "./index";
@@ -13,21 +11,18 @@ describe("Button", () => {
let disabledButtonDebugElement: DebugElement;
let linkDebugElement: DebugElement;
- beforeEach(waitForAsync(() => {
+ beforeEach(async () => {
TestBed.configureTestingModule({
- imports: [ButtonModule],
- declarations: [TestApp],
+ imports: [TestApp],
});
- // FIXME: Verify that this floating promise is intentional. If it is, add an explanatory comment and ensure there is proper error handling.
- // eslint-disable-next-line @typescript-eslint/no-floating-promises
- TestBed.compileComponents();
+ await TestBed.compileComponents();
fixture = TestBed.createComponent(TestApp);
testAppComponent = fixture.debugElement.componentInstance;
buttonDebugElement = fixture.debugElement.query(By.css("button"));
disabledButtonDebugElement = fixture.debugElement.query(By.css("button#disabled"));
linkDebugElement = fixture.debugElement.query(By.css("a"));
- }));
+ });
it("should not be disabled when loading and disabled are false", () => {
testAppComponent.loading = false;
@@ -85,11 +80,11 @@ describe("Button", () => {
`,
- standalone: false,
+ imports: [ButtonModule],
})
class TestApp {
- buttonType: string;
- block: boolean;
- disabled: boolean;
- loading: boolean;
+ buttonType?: string;
+ block?: boolean;
+ disabled?: boolean;
+ loading?: boolean;
}
diff --git a/libs/components/src/dialog/dialog.service.stories.ts b/libs/components/src/dialog/dialog.service.stories.ts
index 5db6577091..a9fe92ea4b 100644
--- a/libs/components/src/dialog/dialog.service.stories.ts
+++ b/libs/components/src/dialog/dialog.service.stories.ts
@@ -1,18 +1,15 @@
-import { DIALOG_DATA, DialogModule, DialogRef } from "@angular/cdk/dialog";
+import { DIALOG_DATA, DialogRef } from "@angular/cdk/dialog";
import { Component, Inject } from "@angular/core";
+import { provideAnimations } from "@angular/platform-browser/animations";
import { Meta, StoryObj, moduleMetadata } from "@storybook/angular";
import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
import { ButtonModule } from "../button";
-import { IconButtonModule } from "../icon-button";
-import { SharedModule } from "../shared";
import { I18nMockService } from "../utils/i18n-mock.service";
-import { DialogComponent } from "./dialog/dialog.component";
+import { DialogModule } from "./dialog.module";
import { DialogService } from "./dialog.service";
-import { DialogCloseDirective } from "./directives/dialog-close.directive";
-import { DialogTitleContainerDirective } from "./directives/dialog-title-container.directive";
interface Animal {
animal: string;
@@ -20,7 +17,7 @@ interface Animal {
@Component({
template: ``,
- standalone: false,
+ imports: [ButtonModule],
})
class StoryDialogComponent {
constructor(public dialogService: DialogService) {}
@@ -50,7 +47,7 @@ class StoryDialogComponent {
`,
- standalone: false,
+ imports: [DialogModule, ButtonModule],
})
class StoryDialogContentComponent {
constructor(
@@ -68,17 +65,8 @@ export default {
component: StoryDialogComponent,
decorators: [
moduleMetadata({
- declarations: [StoryDialogContentComponent],
- imports: [
- SharedModule,
- ButtonModule,
- DialogModule,
- IconButtonModule,
- DialogCloseDirective,
- DialogComponent,
- DialogTitleContainerDirective,
- ],
providers: [
+ provideAnimations(),
DialogService,
{
provide: I18nService,
diff --git a/libs/components/src/dialog/simple-dialog/simple-configurable-dialog/simple-configurable-dialog.service.stories.ts b/libs/components/src/dialog/simple-dialog/simple-configurable-dialog/simple-configurable-dialog.service.stories.ts
index d703b6a673..036ef1177e 100644
--- a/libs/components/src/dialog/simple-dialog/simple-configurable-dialog/simple-configurable-dialog.service.stories.ts
+++ b/libs/components/src/dialog/simple-dialog/simple-configurable-dialog/simple-configurable-dialog.service.stories.ts
@@ -1,6 +1,6 @@
import { Component } from "@angular/core";
-import { BrowserAnimationsModule } from "@angular/platform-browser/animations";
-import { Meta, StoryObj, applicationConfig, moduleMetadata } from "@storybook/angular";
+import { provideAnimations } from "@angular/platform-browser/animations";
+import { Meta, StoryObj, applicationConfig } from "@storybook/angular";
import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
@@ -31,7 +31,7 @@ import { DialogModule } from "../../dialog.module";
}
`,
- standalone: false,
+ imports: [ButtonModule, CalloutModule, DialogModule],
})
class StoryDialogComponent {
protected dialogs: { title: string; dialogs: SimpleDialogOptions[] }[] = [
@@ -147,11 +147,9 @@ export default {
title: "Component Library/Dialogs/Service/SimpleConfigurable",
component: StoryDialogComponent,
decorators: [
- moduleMetadata({
- imports: [ButtonModule, BrowserAnimationsModule, DialogModule, CalloutModule],
- }),
applicationConfig({
providers: [
+ provideAnimations(),
{
provide: I18nService,
useFactory: () => {
diff --git a/libs/components/src/dialog/simple-dialog/simple-dialog.service.stories.ts b/libs/components/src/dialog/simple-dialog/simple-dialog.service.stories.ts
index e5695a7ac5..cc5c8f2ae1 100644
--- a/libs/components/src/dialog/simple-dialog/simple-dialog.service.stories.ts
+++ b/libs/components/src/dialog/simple-dialog/simple-dialog.service.stories.ts
@@ -1,13 +1,11 @@
import { DialogRef, DIALOG_DATA } from "@angular/cdk/dialog";
import { Component, Inject } from "@angular/core";
-import { BrowserAnimationsModule } from "@angular/platform-browser/animations";
+import { provideAnimations } from "@angular/platform-browser/animations";
import { Meta, StoryObj, moduleMetadata } from "@storybook/angular";
import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
import { ButtonModule } from "../../button";
-import { IconButtonModule } from "../../icon-button";
-import { SharedModule } from "../../shared/shared.module";
import { I18nMockService } from "../../utils/i18n-mock.service";
import { DialogModule } from "../dialog.module";
import { DialogService } from "../dialog.service";
@@ -18,7 +16,7 @@ interface Animal {
@Component({
template: ``,
- standalone: false,
+ imports: [ButtonModule],
})
class StoryDialogComponent {
constructor(public dialogService: DialogService) {}
@@ -49,7 +47,7 @@ class StoryDialogComponent {
`,
- standalone: false,
+ imports: [ButtonModule, DialogModule],
})
class StoryDialogContentComponent {
constructor(
@@ -67,15 +65,8 @@ export default {
component: StoryDialogComponent,
decorators: [
moduleMetadata({
- declarations: [StoryDialogContentComponent],
- imports: [
- SharedModule,
- IconButtonModule,
- ButtonModule,
- BrowserAnimationsModule,
- DialogModule,
- ],
providers: [
+ provideAnimations(),
DialogService,
{
provide: I18nService,
diff --git a/libs/components/src/form-field/password-input-toggle.spec.ts b/libs/components/src/form-field/password-input-toggle.spec.ts
index 78b2521d64..114010c37b 100644
--- a/libs/components/src/form-field/password-input-toggle.spec.ts
+++ b/libs/components/src/form-field/password-input-toggle.spec.ts
@@ -6,7 +6,6 @@ import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.servic
import { IconButtonModule } from "../icon-button";
import { BitIconButtonComponent } from "../icon-button/icon-button.component";
-import { InputModule } from "../input/input.module";
import { I18nMockService } from "../utils/i18n-mock.service";
import { BitFormFieldControl } from "./form-field-control";
@@ -25,7 +24,7 @@ import { BitPasswordInputToggleDirective } from "./password-input-toggle.directi
`,
- standalone: false,
+ imports: [FormFieldModule, IconButtonModule],
})
class TestFormFieldComponent {}
@@ -37,8 +36,7 @@ describe("PasswordInputToggle", () => {
beforeEach(async () => {
await TestBed.configureTestingModule({
- imports: [FormFieldModule, IconButtonModule, InputModule],
- declarations: [TestFormFieldComponent],
+ imports: [TestFormFieldComponent],
providers: [
{
provide: I18nService,
diff --git a/libs/components/src/input/autofocus.directive.ts b/libs/components/src/input/autofocus.directive.ts
index 3fd06156f3..46eb1b15b1 100644
--- a/libs/components/src/input/autofocus.directive.ts
+++ b/libs/components/src/input/autofocus.directive.ts
@@ -19,7 +19,6 @@ import { FocusableElement } from "../shared/focusable-element";
*/
@Directive({
selector: "[appAutofocus], [bitAutofocus]",
- standalone: false,
})
export class AutofocusDirective implements AfterContentChecked {
@Input() set appAutofocus(condition: boolean | string) {
diff --git a/libs/components/src/menu/menu.component.spec.ts b/libs/components/src/menu/menu.component.spec.ts
index 7992407587..c6a54f1afa 100644
--- a/libs/components/src/menu/menu.component.spec.ts
+++ b/libs/components/src/menu/menu.component.spec.ts
@@ -1,5 +1,5 @@
import { Component } from "@angular/core";
-import { ComponentFixture, TestBed, waitForAsync } from "@angular/core/testing";
+import { ComponentFixture, TestBed } from "@angular/core/testing";
import { By } from "@angular/platform-browser";
import { MenuTriggerForDirective } from "./menu-trigger-for.directive";
@@ -16,19 +16,16 @@ describe("Menu", () => {
// The overlay is created outside the root debugElement, so we need to query its parent
const getBitMenuPanel = () => document.querySelector(".bit-menu-panel");
- beforeEach(waitForAsync(() => {
+ beforeEach(async () => {
TestBed.configureTestingModule({
- imports: [MenuModule],
- declarations: [TestApp],
+ imports: [TestApp],
});
- // FIXME: Verify that this floating promise is intentional. If it is, add an explanatory comment and ensure there is proper error handling.
- // eslint-disable-next-line @typescript-eslint/no-floating-promises
- TestBed.compileComponents();
+ await TestBed.compileComponents();
fixture = TestBed.createComponent(TestApp);
fixture.detectChanges();
- }));
+ });
it("should open when the trigger is clicked", async () => {
const buttonDebugElement = fixture.debugElement.query(By.directive(MenuTriggerForDirective));
@@ -73,6 +70,6 @@ describe("Menu", () => {
Item 2
`,
- standalone: false,
+ imports: [MenuModule],
})
class TestApp {}
diff --git a/libs/components/src/radio-button/radio-button.component.spec.ts b/libs/components/src/radio-button/radio-button.component.spec.ts
index 617eb8454b..265b8e2312 100644
--- a/libs/components/src/radio-button/radio-button.component.spec.ts
+++ b/libs/components/src/radio-button/radio-button.component.spec.ts
@@ -1,7 +1,5 @@
-// FIXME: Update this file to be type safe and remove this and next line
-// @ts-strict-ignore
import { Component } from "@angular/core";
-import { ComponentFixture, TestBed, waitForAsync } from "@angular/core/testing";
+import { ComponentFixture, TestBed } from "@angular/core/testing";
import { By } from "@angular/platform-browser";
import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
@@ -17,26 +15,23 @@ describe("RadioButton", () => {
let testAppComponent: TestApp;
let radioButton: HTMLInputElement;
- beforeEach(waitForAsync(() => {
+ beforeEach(async () => {
mockGroupComponent = new MockedButtonGroupComponent();
TestBed.configureTestingModule({
- imports: [RadioButtonModule],
- declarations: [TestApp],
+ imports: [TestApp],
providers: [
{ provide: RadioGroupComponent, useValue: mockGroupComponent },
{ provide: I18nService, useValue: new I18nMockService({}) },
],
});
- // FIXME: Verify that this floating promise is intentional. If it is, add an explanatory comment and ensure there is proper error handling.
- // eslint-disable-next-line @typescript-eslint/no-floating-promises
- TestBed.compileComponents();
+ await TestBed.compileComponents();
fixture = TestBed.createComponent(TestApp);
fixture.detectChanges();
testAppComponent = fixture.debugElement.componentInstance;
radioButton = fixture.debugElement.query(By.css("input[type=radio]")).nativeElement;
- }));
+ });
it("should emit value when clicking on radio button", () => {
testAppComponent.value = "value";
@@ -77,7 +72,7 @@ class MockedButtonGroupComponent implements Partial {
@Component({
selector: "test-app",
template: `Element`,
- standalone: false,
+ imports: [RadioButtonModule],
})
class TestApp {
value?: string;
diff --git a/libs/components/src/radio-button/radio-group.component.spec.ts b/libs/components/src/radio-button/radio-group.component.spec.ts
index 7ca99aaca1..ff01b9323f 100644
--- a/libs/components/src/radio-button/radio-group.component.spec.ts
+++ b/libs/components/src/radio-button/radio-group.component.spec.ts
@@ -1,5 +1,5 @@
import { Component } from "@angular/core";
-import { ComponentFixture, TestBed, waitForAsync } from "@angular/core/testing";
+import { ComponentFixture, TestBed } from "@angular/core/testing";
import { FormsModule } from "@angular/forms";
import { By } from "@angular/platform-browser";
@@ -16,16 +16,13 @@ describe("RadioGroupComponent", () => {
let buttonElements: RadioButtonComponent[];
let radioButtons: HTMLInputElement[];
- beforeEach(waitForAsync(() => {
+ beforeEach(async () => {
TestBed.configureTestingModule({
- imports: [FormsModule, RadioButtonModule],
- declarations: [TestApp],
+ imports: [TestApp],
providers: [{ provide: I18nService, useValue: new I18nMockService({}) }],
});
- // FIXME: Verify that this floating promise is intentional. If it is, add an explanatory comment and ensure there is proper error handling.
- // eslint-disable-next-line @typescript-eslint/no-floating-promises
- TestBed.compileComponents();
+ await TestBed.compileComponents();
fixture = TestBed.createComponent(TestApp);
fixture.detectChanges();
testAppComponent = fixture.debugElement.componentInstance;
@@ -37,7 +34,7 @@ describe("RadioGroupComponent", () => {
.map((e) => e.nativeElement);
fixture.detectChanges();
- }));
+ });
it("should select second element when setting selected to second", async () => {
testAppComponent.selected = "second";
@@ -75,7 +72,7 @@ describe("RadioGroupComponent", () => {
Third
`,
- standalone: false,
+ imports: [FormsModule, RadioButtonModule],
})
class TestApp {
selected?: string;
diff --git a/libs/components/src/toggle-group/toggle-group.component.spec.ts b/libs/components/src/toggle-group/toggle-group.component.spec.ts
index 6da5c4258f..b00161d906 100644
--- a/libs/components/src/toggle-group/toggle-group.component.spec.ts
+++ b/libs/components/src/toggle-group/toggle-group.component.spec.ts
@@ -1,7 +1,5 @@
-// FIXME: Update this file to be type safe and remove this and next line
-// @ts-strict-ignore
import { Component } from "@angular/core";
-import { ComponentFixture, TestBed, waitForAsync } from "@angular/core/testing";
+import { ComponentFixture, TestBed } from "@angular/core/testing";
import { By } from "@angular/platform-browser";
import { ToggleGroupModule } from "./toggle-group.module";
@@ -13,15 +11,12 @@ describe("Button", () => {
let buttonElements: ToggleComponent[];
let radioButtons: HTMLInputElement[];
- beforeEach(waitForAsync(() => {
+ beforeEach(async () => {
TestBed.configureTestingModule({
- imports: [ToggleGroupModule],
- declarations: [TestApp],
+ imports: [TestApp],
});
- // FIXME: Verify that this floating promise is intentional. If it is, add an explanatory comment and ensure there is proper error handling.
- // eslint-disable-next-line @typescript-eslint/no-floating-promises
- TestBed.compileComponents();
+ await TestBed.compileComponents();
fixture = TestBed.createComponent(TestApp);
testAppComponent = fixture.debugElement.componentInstance;
buttonElements = fixture.debugElement
@@ -32,7 +27,7 @@ describe("Button", () => {
.map((e) => e.nativeElement);
fixture.detectChanges();
- }));
+ });
it("should select second element when setting selected to second", () => {
testAppComponent.selected = "second";
@@ -67,7 +62,7 @@ describe("Button", () => {
Third
`,
- standalone: false,
+ imports: [ToggleGroupModule],
})
class TestApp {
selected?: string;
diff --git a/libs/components/src/toggle-group/toggle.component.spec.ts b/libs/components/src/toggle-group/toggle.component.spec.ts
index a4377b2e7b..c26ea3ed6a 100644
--- a/libs/components/src/toggle-group/toggle.component.spec.ts
+++ b/libs/components/src/toggle-group/toggle.component.spec.ts
@@ -1,7 +1,5 @@
-// FIXME: Update this file to be type safe and remove this and next line
-// @ts-strict-ignore
import { Component } from "@angular/core";
-import { ComponentFixture, TestBed, waitForAsync } from "@angular/core/testing";
+import { ComponentFixture, TestBed } from "@angular/core/testing";
import { By } from "@angular/platform-browser";
import { ToggleGroupComponent } from "./toggle-group.component";
@@ -13,22 +11,19 @@ describe("Button", () => {
let testAppComponent: TestApp;
let radioButton: HTMLInputElement;
- beforeEach(waitForAsync(() => {
+ beforeEach(async () => {
mockGroupComponent = new MockedButtonGroupComponent();
TestBed.configureTestingModule({
- imports: [ToggleGroupModule],
- declarations: [TestApp],
+ imports: [TestApp],
providers: [{ provide: ToggleGroupComponent, useValue: mockGroupComponent }],
});
- // FIXME: Verify that this floating promise is intentional. If it is, add an explanatory comment and ensure there is proper error handling.
- // eslint-disable-next-line @typescript-eslint/no-floating-promises
- TestBed.compileComponents();
+ await TestBed.compileComponents();
fixture = TestBed.createComponent(TestApp);
testAppComponent = fixture.debugElement.componentInstance;
radioButton = fixture.debugElement.query(By.css("input[type=radio]")).nativeElement;
- }));
+ });
it("should emit value when clicking on radio button", () => {
testAppComponent.value = "value";
@@ -69,7 +64,7 @@ class MockedButtonGroupComponent implements Partial {
@Component({
selector: "test-app",
template: ` Element`,
- standalone: false,
+ imports: [ToggleGroupModule],
})
class TestApp {
value?: string;