From aa090cd6ef215a2ae4b97f220e32a4ea1e9a3e99 Mon Sep 17 00:00:00 2001
From: 07akioni <07akioni2@gmail.com>
Date: Mon, 20 Sep 2021 23:36:49 +0800
Subject: [PATCH] test(message, dialog, notification): reactive object is
 mutable

---
 src/dialog/tests/Dialog.spec.tsx             | 23 +++++++++++++++-----
 src/message/tests/Message.spec.tsx           |  7 ++++--
 src/notification/tests/Notification.spec.tsx |  3 ++-
 3 files changed, 24 insertions(+), 9 deletions(-)

diff --git a/src/dialog/tests/Dialog.spec.tsx b/src/dialog/tests/Dialog.spec.tsx
index 69d243ba1..7dbc2400b 100644
--- a/src/dialog/tests/Dialog.spec.tsx
+++ b/src/dialog/tests/Dialog.spec.tsx
@@ -17,10 +17,11 @@ describe('n-dialog', () => {
     const Test = defineComponent({
       setup () {
         const dialog = useDialog()
-        dialog.success({
+        const dialogReactive = dialog.success({
           title: 'Test success',
           content: 'Content'
         })
+        dialogReactive.style = 'color: red;'
       },
       render () {
         return null
@@ -66,7 +67,9 @@ describe('n-dialog', () => {
         return null
       }
     })
-    const wrapper = await mount(() => <Provider>{{ default: () => <Test /> }}</Provider>)
+    const wrapper = await mount(() => (
+      <Provider>{{ default: () => <Test /> }}</Provider>
+    ))
     expect(document.querySelector('.n-button__icon')).not.toEqual(null)
     wrapper.unmount()
   })
@@ -87,7 +90,9 @@ describe('n-dialog', () => {
         return null
       }
     })
-    const wrapper = mount(() => <Provider>{{ default: () => <Test /> }}</Provider>)
+    const wrapper = mount(() => (
+      <Provider>{{ default: () => <Test /> }}</Provider>
+    ))
     document.body.dispatchEvent(mousedownEvent)
     document.body.dispatchEvent(mouseupEvent)
     await nextTick(() => {
@@ -113,7 +118,9 @@ describe('n-dialog', () => {
         return null
       }
     })
-    const wrapper = await mount(() => <Provider>{{ default: () => <Test /> }}</Provider>)
+    const wrapper = await mount(() => (
+      <Provider>{{ default: () => <Test /> }}</Provider>
+    ))
     document.body.dispatchEvent(mousedownEvent)
     document.body.dispatchEvent(mouseupEvent)
     expect(onMaskClick).toHaveBeenCalled()
@@ -136,8 +143,12 @@ describe('n-dialog', () => {
         return null
       }
     })
-    const wrapper = await mount(() => <Provider>{{ default: () => <Test /> }}</Provider>)
-    expect(document.querySelector('.n-dialog')?.getAttribute('style')).toContain('color: rgb(79, 178, 51);')
+    const wrapper = await mount(() => (
+      <Provider>{{ default: () => <Test /> }}</Provider>
+    ))
+    expect(
+      document.querySelector('.n-dialog')?.getAttribute('style')
+    ).toContain('color: rgb(79, 178, 51);')
     wrapper.unmount()
   })
 })
diff --git a/src/message/tests/Message.spec.tsx b/src/message/tests/Message.spec.tsx
index 2324980e5..b76930152 100644
--- a/src/message/tests/Message.spec.tsx
+++ b/src/message/tests/Message.spec.tsx
@@ -17,7 +17,8 @@ describe('n-message', () => {
       setup () {
         const message = useMessage()
         message.info('string')
-        message.info(() => 'string')
+        const messageReactive = message.info(() => 'string')
+        messageReactive.content = '123'
       },
       render () {
         return null
@@ -133,7 +134,9 @@ describe('message-provider', () => {
     void nextTick(() => {
       const container = document.querySelector('.n-message-container')
       expect(container).not.toBe(null)
-      expect(container.attributes.style.value).toContain('padding: 24px')
+      expect((container as HTMLElement).style.cssText).toContain(
+        'padding: 24px'
+      )
       wrapper.unmount()
       done()
     })
diff --git a/src/notification/tests/Notification.spec.tsx b/src/notification/tests/Notification.spec.tsx
index 6bfc85e38..0ef3de513 100644
--- a/src/notification/tests/Notification.spec.tsx
+++ b/src/notification/tests/Notification.spec.tsx
@@ -23,9 +23,10 @@ describe('n-notification', () => {
         notification.info({
           title: 'info'
         })
-        notification.success({
+        const notificationReactive = notification.success({
           title: 'success'
         })
+        notificationReactive.title = 'cool'
       },
       render () {
         return null