1
0
mirror of https://github.com/bitwarden/browser.git synced 2024-06-25 10:25:36 +02:00
bitwarden-browser/libs/components/src/banner/banner.component.spec.ts
Andreas Coroiu d666d66886
[EC-457] Component library icon buttons (#3372)
* [EC-457] feat: initial version of icon button

* [EC-457] feat: modify template and start adding inputs

* [EC-457] feat: implement all styles

* [EC-457] chore: cleanup

* [EC-457] feat: fix hover styles after discussions

* [EC-457] feat: add focus ring workaround

* [EC-457] chore: refactor stories a bit

* [EC-457] fix: button style attr name reserved word collision

* [EC-356] feat: match padding with figma

* [EC-457] feat: use icon button in banner

* [EC-457] chore: cleanup css classes

* [EC-457] feat: improve aria

* [EC-457] feat: use icon button in dialog

* [EC-457] fix: make focus and hover styles independent

* [EC-457] fix: remove primary 500 border

* [EC-457] chore: cleanup

* [EC-457] chore: move css class to common list

* [EC-457] fix: use focus-visible

* [EC-457] chore: expand on workaround fix

* [EC-457] fix: default sizing

* [EC-457] fix: align trash icon right

* [EC-457] fix: add missing aria labels

* [EC-457] fix: add i18n service to banner tests

* [EC-457] chore: rename size `default` to `button`

* [EC-457] feat: double padding

* [EC-457] feat: simplify sizes - update default

* [EC-457] fix: revert selector fix - gonna create separate pr

* [EC-457] chore: remove superfluous dependencies

* [EC-457] fix: remove non-working onClose handler

Removing this storybook action because we already test it as part of the dialog service stories.
It requries mocking the dialogRef to capture the close function which makes this story more complex
but adds very little value as we already test it elsewhere.
2022-09-15 07:38:29 +02:00

51 lines
1.5 KiB
TypeScript

import { ComponentFixture, TestBed } from "@angular/core/testing";
import { I18nService } from "@bitwarden/common/abstractions/i18n.service";
import { SharedModule } from "../shared/shared.module";
import { I18nMockService } from "../utils/i18n-mock.service";
import { BannerComponent } from "./banner.component";
describe("BannerComponent", () => {
let component: BannerComponent;
let fixture: ComponentFixture<BannerComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
imports: [SharedModule],
declarations: [BannerComponent],
providers: [
{
provide: I18nService,
useFactory: () =>
new I18nMockService({
close: "Close",
}),
},
],
}).compileComponents();
fixture = TestBed.createComponent(BannerComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it("should create with alert", () => {
expect(component.useAlertRole).toBe(true);
const el = fixture.nativeElement.children[0];
expect(el.getAttribute("role")).toEqual("status");
expect(el.getAttribute("aria-live")).toEqual("polite");
});
it("useAlertRole=false", () => {
component.useAlertRole = false;
fixture.autoDetectChanges();
expect(component.useAlertRole).toBe(false);
const el = fixture.nativeElement.children[0];
expect(el.getAttribute("role")).toBeNull();
expect(el.getAttribute("aria-live")).toBeNull();
});
});