diff --git a/tests/_output/bootstrap/notification/notification.png b/tests/_output/bootstrap/notification/notification.png
index c48ed365351..19082d01680 100644
Binary files a/tests/_output/bootstrap/notification/notification.png and b/tests/_output/bootstrap/notification/notification.png differ
diff --git a/tests/_output/classic/notification/notification.png b/tests/_output/classic/notification/notification.png
index fe6c428b0f3..942fb6e52c9 100644
Binary files a/tests/_output/classic/notification/notification.png and b/tests/_output/classic/notification/notification.png differ
diff --git a/tests/_output/default/notification/notification.png b/tests/_output/default/notification/notification.png
index ed3da635ba2..09275c5a754 100644
Binary files a/tests/_output/default/notification/notification.png and b/tests/_output/default/notification/notification.png differ
diff --git a/tests/_output/fluent/notification/notification.png b/tests/_output/fluent/notification/notification.png
index 0976bcba3bf..e267af2ce6f 100644
Binary files a/tests/_output/fluent/notification/notification.png and b/tests/_output/fluent/notification/notification.png differ
diff --git a/tests/_output/material/notification/notification.png b/tests/_output/material/notification/notification.png
index 7c9665ff3b3..c11f0880d32 100644
Binary files a/tests/_output/material/notification/notification.png and b/tests/_output/material/notification/notification.png differ
diff --git a/tests/notification/notification.html b/tests/notification/notification.html
index 6a7666403fc..6951793005f 100644
--- a/tests/notification/notification.html
+++ b/tests/notification/notification.html
@@ -20,7 +20,7 @@
         }
 
     </style>
-    <div id="test-area" class="k-d-grid k-grid-cols-4">
+    <div id="test-area" class="k-d-grid k-grid-cols-5">
         <span class="k-colspan-all k-col-span-full">LTR</span>
         <div>
             <div class="k-animation-container k-animation-container-shown">
@@ -86,6 +86,29 @@
                 </div>
             </div>
         </div>
+        <div>
+            <div class="k-animation-container k-animation-container-shown">
+                <div class="k-child-animation-container">
+                    <div class="k-notification k-notification-base k-notification-closable">
+                        <span class="k-notification-status k-icon k-svg-icon k-svg-i-exclamation-circle">
+                            <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+                                <path d="M224 128h64v160h-64zm0 256h64v-64h-64zm256-128c0 123.7-100.3 224-224 224S32 379.7 32 256 132.3 32 256 32s224 100.3 224 224m-32 0c0-106-86-192-192-192S64 150 64 256s86 192 192 192 192-86 192-192"></path>
+                            </svg>
+                        </span>
+                        <div class="k-notification-content">Closable notification with icon and very long text start ............. ............ .................... .......... ............ end</div>
+                        <span class="k-notification-actions">
+                            <span class="k-notification-action k-notification-close-action">
+                                <span class="k-icon k-svg-icon k-svg-i-x">
+                                    <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+                                        <path d="M416 141.3 301.3 256 416 370.7 370.7 416 256 301.3 141.3 416 96 370.7 210.7 256 96 141.3 141.3 96 256 210.7 370.7 96z"></path>
+                                    </svg>
+                                </span>
+                            </span>
+                        </span>
+                    </div>
+                </div>
+            </div>
+        </div>
         <span class="k-colspan-all k-col-span-full">RTL</span>
         <div dir="rtl">
             <div class="k-animation-container k-animation-container-shown">
@@ -151,6 +174,29 @@
                 </div>
             </div>
         </div>
+        <div dir="rtl">
+            <div class="k-animation-container k-animation-container-shown">
+                <div class="k-child-animation-container">
+                    <div class="k-notification k-notification-base k-notification-closable">
+                        <span class="k-notification-status k-icon k-svg-icon k-svg-i-exclamation-circle">
+                            <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+                                <path d="M224 128h64v160h-64zm0 256h64v-64h-64zm256-128c0 123.7-100.3 224-224 224S32 379.7 32 256 132.3 32 256 32s224 100.3 224 224m-32 0c0-106-86-192-192-192S64 150 64 256s86 192 192 192 192-86 192-192"></path>
+                            </svg>
+                        </span>
+                        <div class="k-notification-content">Closable notification with icon and very long text start ............. ............ .................... .......... ............ end</div>
+                        <span class="k-notification-actions">
+                            <span class="k-notification-action k-notification-close-action">
+                                <span class="k-icon k-svg-icon k-svg-i-x">
+                                    <svg aria-hidden="true" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+                                        <path d="M416 141.3 301.3 256 416 370.7 370.7 416 256 301.3 141.3 416 96 370.7 210.7 256 96 141.3 141.3 96 256 210.7 370.7 96z"></path>
+                                    </svg>
+                                </span>
+                            </span>
+                        </span>
+                    </div>
+                </div>
+            </div>
+        </div>
     </div>
 </body>
 </html>