Repository: zauberzeug/nicegui
Pull request #2380 (2024-01-15 03:51:00)

Ability to dismiss notifications
This PR solves #2379 from @zilch42 by introducing a `.dismiss()` method for `ui.notification`.


Patch:
diff --git a/nicegui/elements/notification.js b/nicegui/elements/notification.js
index 01b2fd61..036a15b0 100644
--- a/nicegui/elements/notification.js
+++ b/nicegui/elements/notification.js
@@ -5,6 +5,11 @@ export default {
   updated() {
     this.notification(this.options);
   },
+  methods: {
+    dismiss() {
+      this.notification();
+    },
+  },
   props: {
     options: Object,
   },
diff --git a/nicegui/elements/notification.py b/nicegui/elements/notification.py
index c76a3d6f..dfdeffa3 100644
--- a/nicegui/elements/notification.py
+++ b/nicegui/elements/notification.py
@@ -43,6 +43,7 @@ class Notification(Element, component='notification.js'):
 
         Displays a notification on the screen.
         In contrast to `ui.notify`, this element allows to update the notification message and other properties once the notification is displayed.
+        The notification can be removed with `dismiss()`.
 
         :param message: content of the notification
         :param position: position on the screen ("top-left", "top-right", "bottom-left", "bottom-right", "top", "bottom", "left", "right" or "center", default: "bottom")
@@ -163,3 +164,7 @@ class Notification(Element, component='notification.js'):
     def close_button(self, value: Union[bool, str]) -> None:
         self._props['options']['closeBtn'] = value
         self.update()
+
+    def dismiss(self) -> None:
+        """Dismiss the notification."""
+        self.run_method('dismiss')
diff --git a/website/documentation/content/notification_documentation.py b/website/documentation/content/notification_documentation.py
index f1f5b032..0878091b 100644
--- a/website/documentation/content/notification_documentation.py
+++ b/website/documentation/content/notification_documentation.py
@@ -8,13 +8,15 @@ def main_demo() -> None:
     import asyncio
 
     async def compute():
-        n = ui.notification()
+        n = ui.notification(timeout=None)
         for i in range(10):
             n.message = f'Computing {i/10:.0%}'
             n.spinner = True
             await asyncio.sleep(0.2)
         n.message = 'Done!'
         n.spinner = False
+        await asyncio.sleep(1)
+        n.dismiss()
 
     ui.button('Compute', on_click=compute)
 


Test patch:
diff --git a/tests/test_notification.py b/tests/test_notification.py
index f0343753..22c538a3 100644
--- a/tests/test_notification.py
+++ b/tests/test_notification.py
@@ -21,3 +21,17 @@ def test_close_button(screen: Screen):
     screen.wait(1.5)
     screen.should_not_contain('Hi!')
     assert len(b.client.layout.default_slot.children) == 1
+
+
+def test_dismiss(screen: Screen):
+    n = ui.notification('Hi!', timeout=None)
+    b = ui.button('Dismiss', on_click=n.dismiss)
+
+    screen.open('/')
+    screen.should_contain('Hi!')
+    assert len(b.client.layout.default_slot.children) == 2
+    screen.wait(1)
+    screen.click('Dismiss')
+    screen.wait(1.5)
+    screen.should_not_contain('Hi!')
+    assert len(b.client.layout.default_slot.children) == 1