1 files changed, 16 insertions, 12 deletions
diff --git a/toolkit/content/tests/widgets/test_moz_message_bar.html b/toolkit/content/tests/widgets/test_moz_message_bar.html
index 7ee6825ef3..9b48982962 100644
--- a/toolkit/content/tests/widgets/test_moz_message_bar.html
+++ b/toolkit/content/tests/widgets/test_moz_message_bar.html
@@ -1,27 +1,30 @@
 <!DOCTYPE HTML>
 <html>
+
 <head>
   <meta charset="utf-8">
   <title>MozMessageBar tests</title>
   <script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
   <script src="chrome://mochikit/content/tests/SimpleTest/EventUtils.js"></script>
-  <link rel="stylesheet" href="chrome://mochikit/content/tests/SimpleTest/test.css"/>
+  <link rel="stylesheet" href="chrome://mochikit/content/tests/SimpleTest/test.css" />
   <script type="module" src="chrome://global/content/elements/moz-message-bar.mjs"></script>
 </head>
+
 <body>
-<p id="display"></p>
-<div id="content">
-  <moz-message-bar id="infoMessage" heading="Heading" message="Test message"></moz-message-bar>
-  <moz-message-bar id="infoMessage2" dismissable message="Test message"></moz-message-bar>
-  <moz-message-bar id="warningMessage" type="warning" message="Test message"></moz-message-bar>
-  <moz-message-bar id="successMessage" type="success" message="Test message"></moz-message-bar>
-  <moz-message-bar id="errorMessage" type="error" message="Test message"></moz-message-bar>
-</div>
-<pre id="test">
+  <p id="display"></p>
+  <div id="content">
+    <moz-message-bar id="infoMessage" heading="Heading" message="Test message"></moz-message-bar>
+    <moz-message-bar id="infoMessage2" dismissable message="Test message"></moz-message-bar>
+    <moz-message-bar id="warningMessage" type="warning" message="Test message"></moz-message-bar>
+    <moz-message-bar id="successMessage" type="success" message="Test message"></moz-message-bar>
+    <moz-message-bar id="errorMessage" type="error" message="Test message"></moz-message-bar>
+  </div>
+  <pre id="test">
   <script class="testbody" type="application/javascript">
     add_task(async function test_component_declaration() {
       const mozMessageBar = document.querySelector("#infoMessage");
       ok(mozMessageBar, "moz-message-bar component is rendered.");
+      is(mozMessageBar.getAttribute("role"), "alert", "moz-message-bar component is marked up as alert.");
 
       const icon = mozMessageBar.shadowRoot.querySelector(".icon");
       const iconUrl = icon.src;
@@ -48,11 +51,11 @@
 
     add_task(async function test_close_button() {
       const notDismissableComponent = document.querySelector("#infoMessage");
-      let closeButton = notDismissableComponent.closeButtonEl;
+      let closeButton = notDismissableComponent.closeButton;
       ok(!closeButton, "Close button doesn't show when the message bar isn't dismissable.");
 
       let dismissableComponent = document.querySelector("#infoMessage2");
-      closeButton = dismissableComponent.closeButtonEl;
+      closeButton = dismissableComponent.closeButton;
       ok(closeButton, "Close button is shown when the message bar is dismissable.");
 
       closeButton.click();
@@ -89,4 +92,5 @@
   </script>
 </pre>
 </body>
+
 </html>