diff --git a/templates/misc/status-messages--alerts.html.twig b/templates/misc/status-messages--alerts.html.twig
index e158785176283a9d05d6a7c9eac3f1c61afd14ef..ef1f899c0415c7f42bb7b9777540037cc2bef9de 100644
--- a/templates/misc/status-messages--alerts.html.twig
+++ b/templates/misc/status-messages--alerts.html.twig
@@ -25,7 +25,7 @@
  * @ingroup themeable
  */
 #}
-<div class="alert-wrapper">
+<div class="alert-wrapper" data-drupal-messages>
 {% for type, messages in message_list %}
   {%
     set classes = [
diff --git a/templates/misc/status-messages--toasts.html.twig b/templates/misc/status-messages--toasts.html.twig
index 91560fe8cdf1ba649bcfe372e207bbaa837d258c..92bfdd1f4aac789a0bfb952ba76f6ac8acc4d1d1 100644
--- a/templates/misc/status-messages--toasts.html.twig
+++ b/templates/misc/status-messages--toasts.html.twig
@@ -27,7 +27,7 @@
 #}
 {{ attach_library('bootstrap_barrio/toast') }}
 
-<div class="toast-wrapper" aria-live="polite" aria-atomic="true">
+<div class="toast-wrapper" aria-live="polite" aria-atomic="true" data-drupal-messages>
 
   {% for type, messages in message_list %}
     {%
diff --git a/templates/misc/status-messages.html.twig b/templates/misc/status-messages.html.twig
index 2ef678fa3ab706d30d1e62637cef52676e063212..e1f69b8f9b04c62d36be5ede4a92c7617c9a6a0e 100644
--- a/templates/misc/status-messages.html.twig
+++ b/templates/misc/status-messages.html.twig
@@ -25,6 +25,7 @@
  * @ingroup themeable
  */
 #}
+<div data-drupal-messages>
 {% for type, messages in message_list %}
   {%
     set classes = [
@@ -68,4 +69,4 @@
     {% endfor %}
   </div>
 {% endfor %}
-
+</div>