feat(test): add event bus tests

resources/assets/js/utils/alerts.ts

@@ -1,6 +1,6 @@
 import alertify from 'alertify.js'
 
-type logType = 'success' | 'error' | 'log'
+type LogType = 'success' | 'error' | 'log'
 
 const encodeEntities = (str: string) => str.replace(/&/g, '&')
   .replace(/</g, '&lt;')
@@ -13,7 +13,7 @@ export const alerts = {
     alertify.confirm(msg, okFunc, cancelFunc)
   },
 
-  log: (msg: string, type: logType = 'log', cb?: Closure) => {
+  log: (msg: string, type: LogType = 'log', cb?: Closure) => {
     alertify.logPosition('top right')
     alertify.closeLogOnClick(true)
     alertify[type](encodeEntities(msg), cb)

resources/assets/js/utils/eventBus.spec.ts

@@ -0,0 +1,57 @@
+import UnitTestCase from '@/__tests__/UnitTestCase'
+import { expect, it, vi } from 'vitest'
+import { eventBus } from './eventBus'
+
+new class extends UnitTestCase {
+  protected beforeEach () {
+    super.beforeEach(() => eventBus.all = new Map());
+  }
+
+  protected test () {
+    it('listens on a single event', () => {
+      const mock = vi.fn()
+      eventBus.on('KOEL_READY', mock)
+
+      eventBus.emit('KOEL_READY')
+
+      expect(mock).toHaveBeenCalledOnce()
+    })
+
+    it('listens with parameters', () => {
+      const mock = vi.fn()
+      eventBus.on('KOEL_READY', mock)
+
+      eventBus.emit('KOEL_READY', 'foo', 'bar')
+
+      expect(mock).toHaveBeenNthCalledWith(1, 'foo', 'bar')
+    })
+
+    it('registers multiple listeners at once', () => {
+      const mock1 = vi.fn()
+      const mock2 = vi.fn()
+
+      eventBus.on({
+        KOEL_READY: mock1,
+        MODAL_SHOW_ABOUT_KOEL: mock2
+      })
+
+      eventBus.emit('KOEL_READY')
+      expect(mock1).toHaveBeenCalledOnce()
+
+      eventBus.emit('MODAL_SHOW_ABOUT_KOEL')
+      expect(mock2).toHaveBeenCalledOnce()
+    })
+
+    it('queue up listeners on same event', () => {
+      const mock1 = vi.fn()
+      const mock2 = vi.fn()
+      eventBus.on('KOEL_READY', mock1)
+      eventBus.on('KOEL_READY', mock2)
+
+      eventBus.emit('KOEL_READY')
+
+      expect(mock1).toHaveBeenCalledOnce()
+      expect(mock2).toHaveBeenCalledOnce()
+    })
+  }
+}

resources/assets/js/utils/eventBus.ts

@@ -16,12 +16,7 @@ export const eventBus = {
       return
     }
 
-    if (this.all.has(name)) {
-      this.all.get(name).push(callback)
-      return
-    }
-
-    this.all.set(name, [callback])
+    this.all.has(name) ? this.all.get(name).push(callback) : this.all.set(name, [callback])
   },
 
   emit (name: EventName, ...args: any) {

resources/assets/js/utils/filters.ts

@@ -1,4 +0,0 @@
-export const limitBy = <T> (arr: T[], n: number, offset: number = 0): T[] => arr.slice(offset, offset + n)
-
-export const pluralize = (count: number, singular: string): string =>
-  count === 1 ? `${count} ${singular}` : `${count.toLocaleString()} ${singular}s`

resources/assets/js/utils/formatters.ts

@@ -2,7 +2,7 @@
  * Convert a duration in seconds into H:i:s format.
  * If H is 0, it will be omitted.
  */
-export const secondsToHis = (d: number): string => {
+export const secondsToHis = (d: number) => {
   d = ~~d
 
   const s = d % 60
@@ -24,11 +24,11 @@ export type ServerValidationError = {
 /**
  * Parse the validation error from the server into a flattened array of messages.
  */
-export const parseValidationError = (serverError: ServerValidationError): string[] => {
-  let messages = [] as string[]
+export const parseValidationError = (error: ServerValidationError) => {
+  let messages: string[] = []
 
-  Object.keys(serverError.errors).forEach(key => {
-    messages = messages.concat(...serverError.errors[key])
+  Object.keys(error.errors).forEach(key => {
+    messages = messages.concat(...error.errors[key])
   })
 
   return messages
@@ -37,7 +37,10 @@ export const parseValidationError = (serverError: ServerValidationError): string
 /**
  * Turn <br> into new line characters.
  */
-export const br2nl = (str: string): string => str ? str.replace(/<br\s*[/]?>/gi, '\n') : ''
+export const br2nl = (str: string) => str ? str.replace(/<br\s*[/]?>/gi, '\n') : ''
 
-export const slugToTitle = (slug: string, separator = '-'): string =>
+export const slugToTitle = (slug: string, separator = '-') =>
   slug.split(separator).map(w => w.charAt(0).toUpperCase() + w.substring(1).toLowerCase()).join(' ')
+
+export const pluralize = (count: number, singular: string) =>
+  count === 1 ? `${count} ${singular}` : `${count.toLocaleString()} ${singular}s`

resources/assets/js/utils/helpers.ts

@@ -9,4 +9,7 @@ export const use = <T> (value: T, cb: (arg: T) => void) => {
 export const arrayify = <T> (maybeArray: T | Array<T>) => ([] as Array<T>).concat(maybeArray)
 
 // @ts-ignore
-export const noop = () => {}
+export const noop = () => {
+}
+
+export const limitBy = <T> (arr: T[], n: number, offset: number = 0): T[] => arr.slice(offset, offset + n)

resources/assets/js/utils/index.ts

@@ -1,6 +1,5 @@
-export * from './event'
+export * from './eventBus'
 export * from './alerts'
-export * from './filters'
 export * from './formatters'
 export * from './supports'
 export * from './common'

resources/assets/js/utils/supports.ts

@@ -3,7 +3,7 @@ import isMobile from 'ismobilejs'
 /**
  * Check if AudioContext is supported by the current browser.
  */
-export const isAudioContextSupported: boolean = (() => {
+export const isAudioContextSupported = (() => {
   if (process.env.NODE_ENV === 'test') {
     return false
   }
@@ -31,10 +31,10 @@ export const isAudioContextSupported: boolean = (() => {
 /**
  * Checks if HTML5 clipboard can be used.
  */
-export const isClipboardSupported: boolean = 'execCommand' in document
+export const isClipboardSupported = 'execCommand' in document
 
 /**
  * Checks if the browser supports reading (and thus uploading) a whole directory.
  */
-export const isDirectoryReadingSupported: boolean = window.DataTransferItem &&
+export const isDirectoryReadingSupported = window.DataTransferItem &&
   typeof window.DataTransferItem.prototype.webkitGetAsEntry === 'function'

resources/assets/js/utils/visualizer.ts

@@ -157,7 +157,7 @@ class Particle {
   }
 }
 
-export default (container: HTMLElement): void => {
+export default (container: HTMLElement) => {
   Sketch.create({
     container,
     particles: [],