small fix to make the alert test more readable (#85)

This commit is contained in:
Erik Jan de Wit 2020-09-11 20:34:43 +02:00 committed by GitHub
parent 1297c9f391
commit 55a0f443ed
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 72 additions and 70 deletions

View file

@ -18,10 +18,12 @@ const WithButton = () => {
); );
}; };
it("renders global alerts", () => { it("renders empty alert panel", () => {
const empty = mount(<AlertPanel alerts={[]} onCloseAlert={() => {}} />); const empty = mount(<AlertPanel alerts={[]} onCloseAlert={() => {}} />);
expect(empty).toMatchSnapshot(); expect(empty).toMatchSnapshot();
});
it("remove alert after timeout", () => {
const tree = mount(<WithButton />); const tree = mount(<WithButton />);
const button = tree.find("button"); const button = tree.find("button");
expect(button).not.toBeNull(); expect(button).not.toBeNull();
@ -29,10 +31,10 @@ it("renders global alerts", () => {
act(() => { act(() => {
button!.simulate("click"); button!.simulate("click");
}); });
expect(tree).toMatchSnapshot(); expect(tree).toMatchSnapshot("with alert");
act(() => { act(() => {
jest.runAllTimers(); jest.runAllTimers();
}); });
expect(tree).toMatchSnapshot(); expect(tree).toMatchSnapshot("cleared alert");
}); });

View file

@ -1,35 +1,54 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP // Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`renders global alerts 1`] = ` exports[`remove alert after timeout: cleared alert 1`] = `
<AlertPanel <WithButton>
alerts={Array []} <AlertPanel
onCloseAlert={[Function]} alerts={Array []}
> onCloseAlert={[Function]}
<AlertGroup
isToast={true}
> >
<Portal <AlertGroup
containerInfo={ isToast={true}
<div>
<ul
class="pf-c-alert-group pf-m-toast"
/>
</div>
}
> >
<AlertGroupInline <Portal
isToast={true} containerInfo={
<div>
<ul
class="pf-c-alert-group pf-m-toast"
/>
</div>
}
> >
<ul <AlertGroupInline
className="pf-c-alert-group pf-m-toast" isToast={true}
/> >
</AlertGroupInline> <ul
</Portal> className="pf-c-alert-group pf-m-toast"
</AlertGroup> />
</AlertPanel> </AlertGroupInline>
</Portal>
</AlertGroup>
</AlertPanel>
<Button
onClick={[Function]}
>
<button
aria-disabled={false}
aria-label={null}
className="pf-c-button pf-m-primary"
data-ouia-component-id={0}
data-ouia-component-type="PF4/Button"
data-ouia-safe={true}
disabled={false}
onClick={[Function]}
type="button"
>
Add
</button>
</Button>
</WithButton>
`; `;
exports[`renders global alerts 2`] = ` exports[`remove alert after timeout: with alert 1`] = `
<WithButton> <WithButton>
<AlertPanel <AlertPanel
alerts={Array []} alerts={Array []}
@ -146,50 +165,31 @@ exports[`renders global alerts 2`] = `
</WithButton> </WithButton>
`; `;
exports[`renders global alerts 3`] = ` exports[`renders empty alert panel 1`] = `
<WithButton> <AlertPanel
<AlertPanel alerts={Array []}
alerts={Array []} onCloseAlert={[Function]}
onCloseAlert={[Function]} >
<AlertGroup
isToast={true}
> >
<AlertGroup <Portal
isToast={true} containerInfo={
> <div>
<Portal
containerInfo={
<div>
<ul
class="pf-c-alert-group pf-m-toast"
/>
</div>
}
>
<AlertGroupInline
isToast={true}
>
<ul <ul
className="pf-c-alert-group pf-m-toast" class="pf-c-alert-group pf-m-toast"
/> />
</AlertGroupInline> </div>
</Portal> }
</AlertGroup>
</AlertPanel>
<Button
onClick={[Function]}
>
<button
aria-disabled={false}
aria-label={null}
className="pf-c-button pf-m-primary"
data-ouia-component-id={0}
data-ouia-component-type="PF4/Button"
data-ouia-safe={true}
disabled={false}
onClick={[Function]}
type="button"
> >
Add <AlertGroupInline
</button> isToast={true}
</Button> >
</WithButton> <ul
className="pf-c-alert-group pf-m-toast"
/>
</AlertGroupInline>
</Portal>
</AlertGroup>
</AlertPanel>
`; `;