v1.4.1

package.json

@@ -1,6 +1,6 @@
 {
    "name": "notivue-monorepo",
-   "version": "1.4.0",
+   "version": "1.4.1",
    "private": true,
    "workspaces": [
       "packages/*",
@@ -14,12 +14,13 @@
       "build:demo": "bun run build && bun install && cd demo && bun run build",
       "test": "bun run build && bun install && cd tests && bun run test",
       "test:gui": "bun run build && concurrently \"cd packages/notivue && bun run watch\" \"bun install && cd tests && bun run test:gui\"",
-      "prepare": "bunx husky install"
+      "prepare": "bun x husky install"
    },
    "devDependencies": {
       "concurrently": "^8.2.1",
       "lint-staged": "^14.0.1",
-      "prettier": "^2.8.8"
+      "prettier": "^2.8.8",
+      "husky": "^8.0.3"
    },
    "trustedDependencies": [
       "husky"

packages/notivue/core/useStore.ts

@@ -21,7 +21,7 @@ export function useStore() {
  * for the fact that each property is a [shallowRef](https://vuejs.org/api/reactivity-advanced.html#shallowref)
  * that allows for reactive updates and side effects.
  *
- * Documentation: https://notivue.netlify.app/api/use-notivue
+ * Documentation: https://notivuedocs.netlify.app/api/use-notivue
  */
 export function useNotivue(): ConfigSlice {
    if (isSSR) {
@@ -36,7 +36,7 @@ export function useNotivue(): ConfigSlice {
  *
  * Portion of the store matching the actions to create notifications.
  *
- * Documentation: https://notivue.netlify.app/api/use-push
+ * Documentation: https://notivuedocs.netlify.app/api/use-push
  */
 export function usePush() {
    if (isSSR) return createPushSSR()
@@ -52,7 +52,7 @@ export function usePush() {
  * - `entries` - read-only reactive array of all the current displayed notifications
  * - `queue` - read-only reactive array of all the notifications waiting to be displayed
  *
- * Documentation: https://notivue.netlify.app/api/use-notifications
+ * Documentation: https://notivuedocs.netlify.app/api/use-notifications
  */
 export function useNotifications(): NotivueComputedEntries {
    if (isSSR) {

packages/notivue/core/utils.ts

@@ -46,5 +46,6 @@ export function mergeNotificationOptions<T extends Obj = Obj>(
       ...(mergedConfigOptions[optionsFromPush.type] ?? mergedConfigOptions.success),
       ...mergedConfigOptions.global,
       ...optionsFromPush,
+      ...(optionsFromPush.type === 'promise' ? { duration: Infinity } : {}), // Force duration infinity
    }
 }

packages/notivue/nuxt/module.json

@@ -1,5 +1,5 @@
 {
    "name": "notivue/nuxt",
    "configKey": "notivue",
-   "version": "1.4.0"
+   "version": "1.4.1"
 }

packages/notivue/package.json

@@ -1,6 +1,6 @@
 {
    "name": "notivue",
-   "version": "1.4.0",
+   "version": "1.4.1",
    "private": false,
    "description": "Fully-featured toast notification system for Vue and Nuxt",
    "keywords": [

tests/Notivue/components/Notivue.vue

@@ -10,7 +10,7 @@ import {
    type Push,
 } from 'notivue'
 
-import { GENERIC_UPDATE_DELAY, RESOLVE_REJECT_DELAY } from '@/support/utils'
+import { RESOLVE_REJECT_DELAY } from '@/support/utils'
 
 export type CyNotivueProps = {
    class?: string
@@ -35,22 +35,9 @@ watchEffect(() => {
    if (enqueue?.value) config.enqueue.value = enqueue.value
 })
 
-async function randomPromise() {
-   const promise = push.promise(cyProps.options ?? {})
-
-   try {
-      await new Promise((resolve, reject) =>
-         setTimeout(Math.random() > 0.5 ? resolve : reject, GENERIC_UPDATE_DELAY)
-      )
-      promise.resolve(cyProps.options ?? {})
-   } catch (error) {
-      promise.reject(cyProps.options ?? {})
-   }
-}
-
 function pushAndClear() {
    const notification = push.success(cyProps.options ?? {})
-   setTimeout(() => notification.clear(), GENERIC_UPDATE_DELAY)
+   setTimeout(() => notification.clear(), RESOLVE_REJECT_DELAY)
 }
 
 function pushAriaLiveOnly() {
@@ -95,22 +82,22 @@ function pushAndRenderClear() {
 
 function pushAndDestroy() {
    const notification = push.success(cyProps.options ?? {})
-   setTimeout(() => notification.destroy(), GENERIC_UPDATE_DELAY)
+   setTimeout(() => notification.destroy(), RESOLVE_REJECT_DELAY)
 }
 
 function pushSkipQueue() {
    push.success(cyProps.options ?? { skipQueue: true })
 }
 
 async function pushPromiseAndResolve() {
-   const promise = push.promise({ ...cyProps.options, duration: Infinity } ?? {})
+   const promise = push.promise(cyProps.options ?? {})
    await new Promise((resolve) => setTimeout(resolve, RESOLVE_REJECT_DELAY))
 
    promise.resolve(cyProps.newOptions ?? cyProps.options ?? {})
 }
 
 async function pushPromiseAndReject() {
-   const promise = push.promise({ ...cyProps.options, duration: Infinity } ?? {})
+   const promise = push.promise(cyProps.options ?? {})
    await new Promise((resolve) => setTimeout(resolve, RESOLVE_REJECT_DELAY))
 
    promise.reject(cyProps.newOptions ?? cyProps.options ?? {})
@@ -143,7 +130,6 @@ async function pushPromiseAndReject() {
       <button class="PushAndRenderClear" @click="pushAndRenderClear">Push and Render Clear</button>
       <button v-if="toBeCleared" class="RenderedClear" @click="toBeCleared.clear">Clear</button>
 
-      <button class="RandomPromise" @click="randomPromise">Push and Resolve/Reject Promise</button>
       <button class="PushPromiseAndResolve" @click="pushPromiseAndResolve">
          Push Promise and Resolve
       </button>

tests/Notivue/config-animations.cy.ts

@@ -1,5 +1,3 @@
-import Notivue from './components/Notivue.vue'
-
 import type { VueWrapper } from '@vue/test-utils'
 
 // In cypress/support/styles.css
@@ -19,14 +17,14 @@ describe('Animations', () => {
    })
 
    it('Custom animations are merged properly with defaults', () => {
-      const _customAnimations = { ...customAnims } as Partial<typeof customAnims>
-      delete _customAnimations.enter
-
-      cy.mountNotivue({ config: { animations: _customAnimations } }).checkAnimations(
-         '.Notivue__enter',
-         '.fade-out',
-         '.fade-all'
-      )
+      cy.mountNotivue({
+         config: {
+            animations: {
+               leave: customAnims.leave,
+               clearAll: customAnims.clearAll,
+            },
+         },
+      }).checkAnimations('.Notivue__enter', '.fade-out', '.fade-all')
    })
 
    it('Should update animations config dynamically', () => {

tests/Notivue/push-methods.cy.ts

@@ -1,4 +1,5 @@
 import { DEFAULT_DURATION } from '@/core/constants'
+import { DEFAULT_ENTER_LEAVE_ANIM_DURATION, RESOLVE_REJECT_DELAY } from '@/support/utils'
 
 describe('Push', () => {
    it('Can push any type of notification', () => {
@@ -25,9 +26,17 @@ describe('Push', () => {
    it('Updates and dismisses promises', () => {
       cy.mountNotivue()
 
-         .get('.RandomPromise')
+         .get('.PushPromiseAndResolve')
          .click()
+         .wait(RESOLVE_REJECT_DELAY)
+         .wait(DEFAULT_DURATION)
 
+         .getNotifications()
+         .should('have.length', 0)
+
+         .get('.PushPromiseAndReject')
+         .click()
+         .wait(RESOLVE_REJECT_DELAY)
          .wait(DEFAULT_DURATION)
 
          .getNotifications()
@@ -61,6 +70,8 @@ describe('Push', () => {
 
          .get('.PushAndClear')
          .click()
+         .wait(RESOLVE_REJECT_DELAY)
+         .wait(DEFAULT_ENTER_LEAVE_ANIM_DURATION)
 
          .getNotifications()
          .should('have.length', 0)
@@ -71,6 +82,7 @@ describe('Push', () => {
 
          .get('.PushAndDestroy')
          .click()
+         .wait(RESOLVE_REJECT_DELAY)
 
          .getNotifications()
          .should('have.length', 0)

tests/Notivue/slot-custom-push-options.cy.ts

@@ -50,12 +50,12 @@ describe('Push notification options have higher priority over config', () => {
          .checkSlotAgainst(options)
    })
 
-   it('Promise', () => {
+   it('Promise - Besides duration', () => {
       cy.mountNotivue(componentConf)
 
          .get('.Promise')
          .click()
-         .checkSlotAgainst(options)
+         .checkSlotAgainst({ ...options, duration: null })
    })
 
    it('Promise - Resolve', () => {
@@ -141,12 +141,12 @@ describe('Push notification options are merged properly with config', () => {
             .checkSlotAgainst(expectedOptions)
       })
 
-      it('Promise', () => {
+      it('Promise - Besides duration', () => {
          cy.mountNotivue(componentConf)
 
             .get('.Promise')
             .click()
-            .checkSlotAgainst(expectedOptions)
+            .checkSlotAgainst({ ...expectedOptions, duration: null })
       })
    })
 

tests/Notivue/slot-default-options.cy.ts

@@ -2,7 +2,10 @@ import { DEFAULT_NOTIFICATION_OPTIONS as DEFAULT_OPTIONS } from '@/core/constant
 import { RESOLVE_REJECT_DELAY } from '@/support/utils'
 
 describe('Default options match the slot content', () => {
-   const { success, error, warning, info, promise } = DEFAULT_OPTIONS
+   const { success, error, warning, info, promise } = DEFAULT_OPTIONS as Record<
+      keyof typeof DEFAULT_OPTIONS,
+      Record<string, unknown>
+   >
 
    describe('First-level notifications', () => {
       it('Success', () => {
@@ -47,8 +50,8 @@ describe('Default options match the slot content', () => {
    })
 
    describe('Promise - Resolve / Reject', () => {
-      const promiseResolve = DEFAULT_OPTIONS['promise-resolve']
-      const promiseReject = DEFAULT_OPTIONS['promise-reject']
+      const promiseResolve = DEFAULT_OPTIONS['promise-resolve'] as Record<string, unknown>
+      const promiseReject = DEFAULT_OPTIONS['promise-reject'] as Record<string, unknown>
 
       it('Promise - Resolve', () => {
          cy.mountNotivue()

tests/Notivue/slot-global-options.cy.ts

@@ -55,12 +55,12 @@ describe('Global options have higher priority over defaults', () => {
             .checkSlotAgainst(globalOptions)
       })
 
-      it('Promise', () => {
+      it('Promise - Should not override duration', () => {
          cy.mountNotivue(customConfig)
 
             .get('.Promise')
             .click()
-            .checkSlotAgainst(globalOptions)
+            .checkSlotAgainst({ ...globalOptions, duration: null })
       })
    })
 
@@ -128,12 +128,12 @@ describe('Push options have higher priority over globals', () => {
             .checkSlotAgainst(options)
       })
 
-      it('Promise', () => {
+      it('Promise - Besides duration', () => {
          cy.mountNotivue(componentConf)
 
             .get('.Promise')
             .click()
-            .checkSlotAgainst(options)
+            .checkSlotAgainst({ ...options, duration: null })
       })
    })
 

tests/cypress/support/utils.ts

@@ -22,7 +22,6 @@ export const RESOLVE_REJECT_DELAY = 2000
  *
  * Needed just to see the change in the UI
  */
-export const GENERIC_UPDATE_DELAY = 1000
 
 export const SWIPE_NOTIFICATION_WIDTH = 300