Bug 1845123 - Use moz-message-bar to show extension shortcut warnings…

… in about:addons. r=tgiles,fluent-reviewers,extension-reviewers,flod,rpl

Differential Revision: https://phabricator.services.mozilla.com/D186173

python/l10n/fluent_migrations/bug_1845123_mozMessageBar_aboutAddons_shortcutWarnings.py

@@ -0,0 +1,21 @@
+# Any copyright is dedicated to the Public Domain.
+# http://creativecommons.org/publicdomain/zero/1.0/
+
+import fluent.syntax.ast as FTL
+from fluent.migrate.helpers import transforms_from
+
+
+def migrate(ctx):
+    """Bug 1845123 - Use moz-message-bar to show extension shortcut warnings in about:addons, part {index}."""
+    aboutAddons_ftl = "toolkit/toolkit/about/aboutAddons.ftl"
+    ctx.add_transforms(
+        aboutAddons_ftl,
+        aboutAddons_ftl,
+        transforms_from(
+            """
+shortcuts-duplicate-warning-message2 =
+    .message = {COPY_PATTERN(from_path, "shortcuts-duplicate-warning-message")}
+""",
+            from_path=aboutAddons_ftl,
+        ),
+    )

toolkit/locales/en-US/toolkit/about/aboutAddons.ftl

@@ -283,7 +283,8 @@ shortcuts-duplicate = Duplicate shortcut
 # String displayed when a keyboard shortcut is already assigned to more than one add-on
 # Variables:
 #   $shortcut (string) - Shortcut string for the add-on
-shortcuts-duplicate-warning-message = { $shortcut } is being used as a shortcut in more than one case. Duplicate shortcuts may cause unexpected behavior.
+shortcuts-duplicate-warning-message2 =
+    .message = { $shortcut } is being used as a shortcut in more than one case. Duplicate shortcuts may cause unexpected behavior.
 
 # String displayed when a keyboard shortcut is already used by another add-on
 # Variables:

toolkit/mozapps/extensions/content/shortcuts.js

@@ -332,17 +332,16 @@ ChromeUtils.defineESModuleGetters(this, {
   }
 
   function createDuplicateWarningBar(shortcut) {
-    let messagebar = document.createElement("message-bar");
+    let messagebar = document.createElement("moz-message-bar");
     messagebar.setAttribute("type", "warning");
 
-    let message = document.createElement("span");
     document.l10n.setAttributes(
-      message,
-      "shortcuts-duplicate-warning-message",
+      messagebar,
+      "shortcuts-duplicate-warning-message2",
       { shortcut }
     );
+    messagebar.setAttribute("data-l10n-attrs", "message");
 
-    messagebar.append(message);
     return messagebar;
   }
 

toolkit/mozapps/extensions/test/browser/browser_shortcuts_duplicate_check.js

@@ -68,7 +68,7 @@ add_task(async function testDuplicateShortcutsWarnings() {
   let win = await loadShortcutsView();
   let doc = win.document;
 
-  let warningBars = doc.querySelectorAll("message-bar");
+  let warningBars = doc.querySelectorAll("moz-message-bar");
   // Ensure warning messages are shown for each duplicate shorctut.
   is(
     warningBars.length,
@@ -79,12 +79,13 @@ add_task(async function testDuplicateShortcutsWarnings() {
   // Ensure warning messages are correct with correct shortcuts.
   let count = 1;
   for (let warning of warningBars) {
-    let warningMsg = warning.querySelector("span");
-    let l10nAttrs = doc.l10n.getAttributes(warningMsg);
+    let l10nAttrs = doc.l10n.getAttributes(warning);
+    await TestUtils.waitForCondition(() => warning.message !== "");
+    ok(warning.message !== "", "Warning message attribute is set");
     is(
       l10nAttrs.id,
-      "shortcuts-duplicate-warning-message",
-      "Warning message is shown"
+      "shortcuts-duplicate-warning-message2",
+      "Warning message l10nId is correct"
     );
     Assert.deepEqual(
       l10nAttrs.args,
@@ -97,12 +98,12 @@ add_task(async function testDuplicateShortcutsWarnings() {
   ["Shift+Alt+1", "Shift+Alt+2"].forEach((shortcut, index) => {
     // Ensure warning messages are correct with correct shortcuts.
     let warning = warningBars[index];
-    let warningMsg = warning.querySelector("span");
-    let l10nAttrs = doc.l10n.getAttributes(warningMsg);
+    let l10nAttrs = doc.l10n.getAttributes(warning);
+    ok(warning.message !== "", "Warning message attribute is set");
     is(
       l10nAttrs.id,
-      "shortcuts-duplicate-warning-message",
-      "Warning message is shown"
+      "shortcuts-duplicate-warning-message2",
+      "Warning message l10nId is correct"
     );
     Assert.deepEqual(
       l10nAttrs.args,