Feat: Notifications Banner (#184)

data/folder-by-parent.json

@@ -338,6 +338,7 @@
       "Mobile App (native-specific)",
       "Mobile V2",
       "Notification Test Tool",
+      "Notifications Banner",
       "Omnibus",
       "Playbooks",
       "Plugins",

data/folders.json

@@ -1575,6 +1575,15 @@
     "fullNames": ["Notification Test Tool"],
     "fullPath": "notification-test-tool"
   },
+  {
+    "id": 18508613,
+    "parentId": null,
+    "name": "Notifications Banner",
+    "index": 21,
+    "folderType": "TEST_CASE",
+    "fullNames": ["Notifications Banner"],
+    "fullPath": "notifications-banner"
+  },
   {
     "id": 821856,
     "parentId": null,

data/key-and-path.json

@@ -6309,5 +6309,7 @@
   { "key": "MM-T5637", "path": "mobile-v2/drafts", "id": 191284131 },
   { "key": "MM-T5638", "path": "mobile-v2/drafts", "id": 191284132 },
   { "key": "MM-T5639", "path": "mobile-v2/drafts", "id": 191284133 },
-  { "key": "MM-T5640", "path": "desktop-app--native-specific-/landing-page", "id": 193404883 }
+  { "key": "MM-T5640", "path": "desktop-app--native-specific-/landing-page", "id": 193404883 },
+  { "key": "MM-T5641", "path": "notifications-banner", "id": 195498645 },
+  { "key": "MM-T5642", "path": "notifications-banner", "id": 195498646 }
 ]

data/test-by-folder.json

@@ -3297,6 +3297,13 @@
       "iOS app | User can generate test notification from mobile app and verify on the Browser and Desktop and Mobile app"
     ]
   },
+  {
+    "folder": "notifications-banner",
+    "tests": [
+      "Enable Desktop notification on Window/Mac/Ubuntu Desktop app",
+      "Enable/Disable notification on Mobile app"
+    ]
+  },
   {
     "folder": "omnibus",
     "tests": [

data/test-cases-folders.json

@@ -173,6 +173,7 @@
   "mobile-v2/smoke-test": "Smoke Test",
   "mobile-v2/threads": "Threads",
   "notification-test-tool": "Notification Test Tool",
+  "notifications-banner": "Notifications Banner",
   "omnibus": "Omnibus",
   "playbooks": "Playbooks",
   "plugins": "Plugins",

data/test-cases-manifest.json

@@ -9207,6 +9207,20 @@
       }
     ]
   },
+  {
+    "name": "Notifications Banner",
+    "heading": true,
+    "routes": [
+      {
+        "name": "Enable Desktop notification on Window/Mac/Ubuntu Desktop app",
+        "file": "notifications-banner/MM-T5641.md"
+      },
+      {
+        "name": "Enable/Disable notification on Mobile app",
+        "file": "notifications-banner/MM-T5642.md"
+      }
+    ]
+  },
   {
     "name": "Omnibus",
     "heading": true,

data/test-cases-slugs.json

@@ -2596,6 +2596,8 @@
   "notification-test-tool/mm-t5632",
   "notification-test-tool/mm-t5633",
   "notification-test-tool/mm-t5634",
+  "notifications-banner/mm-t5641",
+  "notifications-banner/mm-t5642",
   "omnibus/mm-t3134",
   "omnibus/mm-t3135",
   "omnibus/mm-t3136",

data/test-cases-toc.json

@@ -4444,6 +4444,14 @@
     "name": "MM-16833 — Web: Scroll position is wrong when entering a permalink view with loaded messages > 120",
     "slug": "ticket-coverage/mm-t25"
   },
+  "notifications-banner/mm-t5642": {
+    "name": "Enable/Disable notification on Mobile app",
+    "slug": "notifications-banner/mm-t5642"
+  },
+  "notifications-banner/mm-t5641": {
+    "name": "Enable Desktop notification on Window/Mac/Ubuntu Desktop app",
+    "slug": "notifications-banner/mm-t5641"
+  },
   "smoke-tests/webapp/mm-t3053": {
     "name": "Open Add Members modal for channel, filter user list, select and add user",
     "slug": "smoke-tests/webapp/mm-t3053"

data/test-cases/notifications-banner/MM-T5641.md

@@ -0,0 +1,84 @@
+---
+# (Required) Ensure all values are filled up
+name: "Enable Desktop notification on Window/Mac/Ubuntu Desktop app"
+status: Active
+priority: Normal
+folder: Notifications Banner
+authors: "@yasserfaraazkhan"
+team_ownership:
+- ICU
+priority_p1_to_p4: P3 - Deep Functions (Do extensive scenarios work?)
+
+# (Optional)
+location: Notifications
+component: null
+tags: []
+labels: []
+tested_by_contributor: ""
+
+# (Optional) Test type and tools
+cypress: N/A
+detox: N/A
+mmctl: N/A
+playwright: N/A
+rainforest: []
+manual_test_environments: []
+
+# Do not change
+id: 195498645
+key: MM-T5641
+created_on: "2024-10-22T08:32:05Z"
+last_updated: "2024-10-22T14:02:04Z"
+case_hashed: 3b877cce34f8ee712d2006cae7bc6f9102eea877550b3aed0371e0f536f83175c09ff9112501d19deef635ef4b95b08c
+steps_hashed: 48b72a767dcde9d94ad926b1a767b5729b28a6152d051b6f1b3f0fedb81de4f423a843aa0d8a32474d5d914ad3d9a31a
+---
+
+<!-- (Auto-generated) Based on frontmatter's "key" and "name" -->
+
+## MM-T5641: Enable Desktop notification on Window/Mac/Ubuntu Desktop app
+
+---
+
+**Step 1**
+
+### Scenario: User Enables the desktop notifications
+
+Steps:
+
+1. Log into User's account.
+2. Verify desktop app shows the global blue banner with message "We need your permission to show desktop notifications." and the button "Enable desktop notification".
+3. Open Settings modal. Expand "Desktop and mobile notification section".
+4. In Notifications section, there should be a message "Desktop notifications aren’t enabled" and the button "Enable desktop notification".
+5. Click on "Enable desktop notification".
+6. Verify a confirmation pop up is shown with message `Mattermost(<Instance link>) would like to send you notifications.`.
+7. **Allow** the notifications permissions.
+8. Receive a notification ping from another user.
+9. Verify the notification pops up and also can be seen in the Notification tray or Notification centre on WINDOWS and MAC.
+10. Verify the Global banner is not visible anymore.
+11. Open Settings modal. Expand "Desktop and mobile notification section".
+12. Verify "Desktop notifications aren’t enabled" message is not visible anymore.
+
+### Scenario: User Denies the desktop notifications on WINDOWS / MAC / Ubuntu OS
+
+Steps:
+
+1. Log into User's account.
+2. Verify desktop app shows the global blue banner with message "We need your permission to show desktop notifications." and the button "Enable desktop notification".
+3. Open Settings modal. Expand "Desktop and mobile notification section".
+4. In Notifications section, there should be a message "Desktop notifications aren’t enabled" and the button "Enable desktop notification".
+5. Click on "Enable desktop notification".
+6. Verify a confirmation pop up is shown with message `Mattermost(<Instance link>) would like to send you notifications.`.
+7. **Deny** the notifications permissions.
+8. Receive a notification ping from another user.
+9. Verify the notification pop-up is not seen.
+10. Verify the Global banner is not visible anymore.
+11. Open Settings modal.
+12. Verify a Alert tag is visible, saying "Permission required".
+13. Expand "Desktop and mobile notification" section.
+14. Verify "Desktop notifications permission was denied" message is visible. A buttons with text "Enable desktop notifications" and "How to enable notifications" are visible.
+
+### Scenario: User Denies the desktop notifications on Browsers Chrome/Safari/Firefox/Edge
+
+Steps:
+
+1. In addition to above scenario, the only change to **Step 12** is that we will not see "Enable desktop notifications" button.

data/test-cases/notifications-banner/MM-T5642.md

@@ -0,0 +1,59 @@
+---
+# (Required) Ensure all values are filled up
+name: "Enable/Disable notification on Mobile app"
+status: Active
+priority: Normal
+folder: Notifications Banner
+authors: "@yasserfaraazkhan"
+team_ownership:
+- ICU
+priority_p1_to_p4: P3 - Deep Functions (Do extensive scenarios work?)
+
+# (Optional)
+location: Notifications
+component: null
+tags: []
+labels: []
+tested_by_contributor: ""
+
+# (Optional) Test type and tools
+cypress: N/A
+detox: N/A
+mmctl: N/A
+playwright: N/A
+rainforest: []
+manual_test_environments: []
+
+# Do not change
+id: 195498646
+key: MM-T5642
+created_on: "2024-10-22T08:32:05Z"
+last_updated: "2024-10-22T14:02:05Z"
+case_hashed: 37453bdaddd7ef05b1a04430111dccb23559d76c15677e0ef63bfa2fcfbf0735b616ae15437c2015b9c6319201a87a3e
+steps_hashed: 2efae7e549b335e54029efd3f47bc3af28f3444c6c45438e7b52d5700e017b2d0761220b5d6e79cd9be8e70cfb18ff7e
+---
+
+<!-- (Auto-generated) Based on frontmatter's "key" and "name" -->
+
+## MM-T5642: Enable/Disable notification on Mobile app
+
+---
+
+**Step 1**
+
+### Scenario: Enable notifications on mobile.
+
+Steps:
+
+1. Log into User's account on Mobile app.
+2. Deny the Notifications permission.
+3. Verify the banner is shown on the Channel list screen saying `Notifications disabled` and a `Settings` button.
+4. Click on Settings button.
+5. Verify the Settings page is opened. There should be an alert tag saying `Permission required`.
+6. Click on Notifications option.
+7. Verify a banner is shown with message `Notifications are not enabled`.
+8. Verify a button with text `Enable notifications` is visible.
+9. Click on the Enable notifications button.
+10. Allow the Notifications.
+11. Receive a message from other user.
+12. Verify push notification are received on the mobile.