coverage

bnjmnrsh · Oct 31, 2022 · 90b1cde · 90b1cde
1 parent b3f6413
commit 90b1cde
Show file tree

Hide file tree

Showing 2 changed files with 65 additions and 16 deletions.
diff --git a/coverage/coverage-summary.json b/coverage/coverage-summary.json
@@ -1,3 +1,3 @@
-{"total": {"lines":{"total":39,"covered":33,"skipped":0,"pct":84.61},"statements":{"total":43,"covered":33,"skipped":0,"pct":76.74},"functions":{"total":8,"covered":5,"skipped":0,"pct":62.5},"branches":{"total":22,"covered":16,"skipped":0,"pct":72.72},"branchesTrue":{"total":0,"covered":0,"skipped":0,"pct":"Unknown"}}
-,"/Users/anachronistic/Documents/WebDev/VanillaJs/Toast/src/Toast.js": {"lines":{"total":39,"covered":33,"skipped":0,"pct":84.61},"functions":{"total":8,"covered":5,"skipped":0,"pct":62.5},"statements":{"total":43,"covered":33,"skipped":0,"pct":76.74},"branches":{"total":22,"covered":16,"skipped":0,"pct":72.72}}
+{"total": {"lines":{"total":39,"covered":39,"skipped":0,"pct":100},"statements":{"total":43,"covered":42,"skipped":0,"pct":97.67},"functions":{"total":8,"covered":8,"skipped":0,"pct":100},"branches":{"total":22,"covered":20,"skipped":0,"pct":90.9},"branchesTrue":{"total":0,"covered":0,"skipped":0,"pct":"Unknown"}}
+,"/Users/anachronistic/Documents/WebDev/VanillaJs/Toast/src/Toast.js": {"lines":{"total":39,"covered":39,"skipped":0,"pct":100},"functions":{"total":8,"covered":8,"skipped":0,"pct":100},"statements":{"total":43,"covered":42,"skipped":0,"pct":97.67},"branches":{"total":22,"covered":20,"skipped":0,"pct":90.9}}
 }
diff --git a/tests/Toast.test.js b/tests/Toast.test.js
@@ -2,8 +2,8 @@ import { Toast } from '../src/Toast'
 import { expect, jest, test, describe } from '@jest/globals'
 
 describe('Toast.js test', () => {
+  const toaster = new Toast()
   test('new Toast to creat a toast intance', () => {
-    const toaster = new Toast()
     expect(toaster.className).toBe('toast')
   })
   test('Toast.create() will thow because no message was passed.', () => {
@@ -13,31 +13,80 @@ describe('Toast.js test', () => {
     )
   })
   test('Toast.create() returns an id of a new toast.', () => {
-    const toaster = new Toast()
-    expect(toaster.create('first toast!')).toBe('body-0')
-    expect(toaster.create('next toast!')).toBe('body-1')
-  })
+    const toast1 = toaster.create('first toast!')
+    const toast2 = toaster.create('second toast!')
+    expect(toast1).toBe('body-0')
+    expect(toast2).toBe('body-1')
 
+    toaster.destroy(toast1)
+    toaster.destroy(toast2)
+  })
   test('Toast.create() adds a toast to the body element.', () => {
+    const myToast = toaster.create('first toast!')
     const toastNode = document.createElement('template')
-    toastNode.innerHTML =
-      '<div class="toast" data-toast-id="body-0" role="alert">first toast!</div>'
-    const toaster = new Toast()
-    expect(toaster.create('first toast!')).toBe('body-0')
+    toastNode.innerHTML = `<div class="toast" data-toast-id="${myToast}" role="alert">first toast!</div>`
+    expect(myToast).toBe(`${myToast}`)
+    const body = document.querySelector('body')
+    expect(body.querySelector(`[data-toast-id="${myToast}"]`)).toStrictEqual(
+      toastNode.content.firstChild
+    )
+    toaster.destroy(myToast)
+  })
+  test('Toast.create() adds a toast with custom toast classes.', () => {
+    const myToast = toaster.create(
+      'first toast!',
+      0,
+      false,
+      false,
+      ['-is-error', '-is-urgent'],
+      'my-unique-ID'
+    )
+    const toastNode = document.createElement('template')
+    toastNode.innerHTML = `<div class="toast -is-error -is-urgent" data-toast-id="my-unique-ID" role="alert">first toast!</div>`
+    expect(myToast).toBe(`${myToast}`)
     const body = document.querySelector('body')
-    expect(body.querySelector('[data-toast-id="body-0"]')).toStrictEqual(
+    expect(body.querySelector(`[data-toast-id="${myToast}"]`)).toEqual(
       toastNode.content.firstChild
     )
+    toaster.destroy(myToast)
   })
+  test('Toast.create() with a dismiss button.', () => {
+    const myToast = toaster.create('first toast!', 0, true)
+    const toastNode = document.createElement('template')
+    toastNode.innerHTML = `<div class="toast" data-toast-id="${myToast}" role="alert">first toast! <button class="toast-close" arial-lable="close">✕</button></div>`
 
+    const body = document.querySelector('body')
+    // Now you see it
+    expect(body.querySelector(`[data-toast-id="${myToast}"]`)).toEqual(
+      toastNode.content.firstChild
+    )
+    const button = document.querySelector(`[data-toast-id="${myToast}"] button`)
+    button.click()
+    // Now you don't
+    expect(body.querySelector(`[data-toast-id="${myToast}"]`)).toEqual(null)
+  })
+  test('Toast.create() that auto hides.', () => {
+    jest.useFakeTimers()
+    const myToast = toaster.create('hide toast!', 3000)
+    const toastNode = document.createElement('template')
+    toastNode.innerHTML = `<div class="toast" data-toast-id="${myToast}" role="alert">hide toast!</div>`
+    // Now you see it
+    expect(document.querySelector(`[data-toast-id="${myToast}"]`)).toEqual(
+      toastNode.content.firstChild
+    )
+    jest.runAllTimers()
+    // Now you don't
+    expect(document.querySelector(`[data-toast-id="${myToast}"]`)).toBe(null)
+    toaster.destroy(myToast)
+  })
   test('Toast.destroy() finds and removes toast, and returns Toast() instance.', () => {
-    const toaster = new Toast()
     const myToast = toaster.create('a toast!')
-    expect(myToast).toBe('body-0')
     expect(toaster.destroy(myToast).className).toBe('toast')
   })
-  test('Toast.destroy() retuns false if no data-toast-id ID found.', () => {
-    const toaster = new Toast()
+  test('Toast.destroy() returns false if no string provided.', () => {
+    expect(toaster.destroy()).toBe(false)
+  })
+  test('Toast.destroy() returns false if no data-toast-id ID found.', () => {
     expect(toaster.destroy('no-toast')).toBe(false)
   })
 })