test(toaster): add a test for deteting an updateable toast

ithaka · Mar 19, 2024 · 65f8abd · 65f8abd
1 parent 0977c2f
commit 65f8abd
Showing 1 changed file with 39 additions and 0 deletions.
diff --git a/packages/pharos/src/components/toast/pharos-toaster.test.ts b/packages/pharos/src/components/toast/pharos-toaster.test.ts
@@ -26,6 +26,17 @@ describe('pharos-toaster', () => {
     document.dispatchEvent(event);
   };
 
+  const fireCloseToastEvent = () => {
+    const event = new CustomEvent('pharos-toast-close', {
+      detail: {
+        bubbles: true,
+        composed: true,
+        id: 'my-updateable-toast',
+      },
+    });
+    document.dispatchEvent(event);
+  };
+
   const fireUpdateToastEvent = () => {
     const event = new CustomEvent('pharos-toast-update', {
       detail: {
@@ -143,6 +154,7 @@ describe('pharos-toaster', () => {
     trigger.click();
     await component.updateComplete;
     await nextFrame();
+
     const triggerUpdate = document.createElement('button');
     triggerUpdate.addEventListener('click', fireUpdateToastEvent);
     document.body.appendChild(triggerUpdate);
@@ -160,6 +172,33 @@ describe('pharos-toaster', () => {
     `);
   });
 
+  it('can close an updateable toast', async () => {
+    const trigger = document.createElement('button');
+    trigger.addEventListener('click', fireOpenUpdateableToastEvent);
+    document.body.appendChild(trigger);
+    trigger.click();
+    await component.updateComplete;
+    await nextFrame();
+
+    const triggerUpdate = document.createElement('button');
+    triggerUpdate.addEventListener('click', fireUpdateToastEvent);
+    document.body.appendChild(triggerUpdate);
+    triggerUpdate.click();
+    await component.updateComplete;
+
+    const triggerClose = document.createElement('button');
+    triggerClose.addEventListener('click', fireCloseToastEvent);
+    document.body.appendChild(triggerClose);
+    triggerClose.click();
+    await component.updateComplete;
+    await nextFrame();
+
+    expect(component).shadowDom.to.equal(`
+      <div class="toaster__container">
+      </div>
+    `);
+  });
+
   it('can return focus to a specific element', async () => {
     let activeElement = null;
     const onFocusIn = (event: Event): void => {