From 177ebcef0c04f890872ee004a73b2f05b967da8d Mon Sep 17 00:00:00 2001
From: Nathan Leuz <nmleuz@gmail.com>
Date: Thu, 23 Jul 2026 21:05:22 -0400
Subject: [PATCH 1/3] fix(compat-table): simplify compat-support-flags fluent
 string

---
 components/compat-table/element.js | 21 ++++++++++++------
 l10n/locales/en-US.ftl             | 34 +++++++++++-------------------
 l10n/template.ftl                  | 28 +++++++-----------------
 3 files changed, 35 insertions(+), 48 deletions(-)

diff --git a/components/compat-table/element.js b/components/compat-table/element.js
index b89ea3284..d02071e9a 100644
--- a/components/compat-table/element.js
+++ b/components/compat-table/element.js
@@ -738,18 +738,27 @@ export class MDNCompatTable extends L10nMixin(LitElement) {
 
     if (item.flags) {
       for (const { type, name, value_to_set } of item.flags) {
+        const hasAdded =
+          typeof item.version_added === "string" &&
+          item.version_added !== "preview";
+        const hasLast = typeof item.version_last === "string";
+
+        const versionRange = hasAdded
+          ? hasLast
+            ? "range"
+            : "from"
+          : hasLast
+            ? "until"
+            : "none";
+
         supportNotes.push({
           iconName: "disabled",
           label: this.l10n.raw({
             id: "compat-support-flags",
             args: {
-              has_added: Number(
-                typeof item.version_added === "string" &&
-                  item.version_added !== "preview",
-              ),
+              version_range: versionRange,
               version_added: item.version_added,
-              has_last: Number(typeof item.version_last === "string"),
-              versionLast: item.version_last,
+              version_last: item.version_last,
               flag_type: type,
               flag_name: name,
               has_value: Number(typeof value_to_set === "string"),
diff --git a/l10n/locales/en-US.ftl b/l10n/locales/en-US.ftl
index a9d245c71..cb4d93523 100644
--- a/l10n/locales/en-US.ftl
+++ b/l10n/locales/en-US.ftl
@@ -92,33 +92,23 @@ compat-branch-prefix-altname = Prefix: <code data-l10n-name="prefix">{ $prefix }
 compat-support-removed = Removed in { $version } and later
 compat-support-see-impl-url = See <a data-l10n-name="impl_url">{ $label }</a>
 compat-support-flags =
-  { $has_added ->
-    [1] From version { $version_added }
-    *[0] {""}
-  }{ $has_last ->
-    [1] { $has_added ->
-          *[0] Until { $versionLast } users
-          [1] {" "}until { $versionLast } users
-      }
-    *[0] { $has_added ->
-          *[0] Users
-          [1] {" "}users
-      }
-  }
-  {" "}must explicitly set the <code data-l10n-name="name">{ $flag_name }</code>{" "}
-  { $flag_type ->
+  { $version_range ->
+    [range] From version { $version_added } until { $version_last }, users
+    [from] From version { $version_added }, users
+    [until] Until { $version_last }, users
+    *[none] Users
+  } must explicitly set the <code data-l10n-name="name">{ $flag_name }</code> { $flag_type ->
     *[preference] preference
     [runtime_flag] runtime flag
   }{ $has_value ->
-    [1] {" "}to <code data-l10n-name="value">{ $flag_value }</code>
-    *[0] {""}
-  }{"."}
-  { $has_pref_url ->
+    [1]{ " " }to <code data-l10n-name="value">{ $flag_value }</code>
+    *[0] { "" }
+  }.{ $has_pref_url ->
     [1] { $flag_type ->
-      [preference] To change preferences in { $browser_name }, visit { $browser_pref_url }.
-      *[other] {""}
+    [preference]{ " " }To change preferences in { $browser_name }, visit { $browser_pref_url }.
+    *[other] { "" }
     }
-    *[0] {""}
+    *[0] { "" }
   }
 
 compat-legend = Legend
diff --git a/l10n/template.ftl b/l10n/template.ftl
index 69fc98f87..43f3dea5a 100644
--- a/l10n/template.ftl
+++ b/l10n/template.ftl
@@ -57,33 +57,21 @@ compat-branch-prefix-altname = Prefix: <code data-l10n-name="prefix">{ $prefix }
 compat-support-removed = Removed in { $version } and later
 compat-support-see-impl-url = See <a data-l10n-name="impl_url">{ $label }</a>
 compat-support-flags =
-    { $has_added ->
-        [1] From version { $version_added }
-       *[0] { "" }
-    }{ $has_last ->
-        [1]
-            { $has_added ->
-               *[0] Until { $versionLast } users
-                [1] { " " }until { $versionLast } users
-            }
-       *[0]
-            { $has_added ->
-               *[0] Users
-                [1] { " " }users
-            }
-    }
-    { " " }must explicitly set the <code data-l10n-name="name">{ $flag_name }</code>{ " " }
-    { $flag_type ->
+    { $version_range ->
+        [range] From version { $version_added } until { $version_last }, users
+        [from] From version { $version_added }, users
+        [until] Until { $version_last }, users
+       *[none] Users
+    } must explicitly set the <code data-l10n-name="name">{ $flag_name }</code> { $flag_type ->
        *[preference] preference
         [runtime_flag] runtime flag
     }{ $has_value ->
         [1] { " " }to <code data-l10n-name="value">{ $flag_value }</code>
        *[0] { "" }
-    }{ "." }
-    { $has_pref_url ->
+    }.{ $has_pref_url ->
         [1]
             { $flag_type ->
-                [preference] To change preferences in { $browser_name }, visit { $browser_pref_url }.
+                [preference] { " " }To change preferences in { $browser_name }, visit { $browser_pref_url }.
                *[other] { "" }
             }
        *[0] { "" }

From 265f1155636a023578b7f512bfc2d009641e6ac7 Mon Sep 17 00:00:00 2001
From: Nathan Leuz <146740199+nmleuz@users.noreply.github.com>
Date: Wed, 29 Jul 2026 16:07:48 -0400
Subject: [PATCH 2/3] Change message id to invalidate older version in other
 locales

---
 components/compat-table/element.js | 2 +-
 l10n/locales/en-US.ftl             | 2 +-
 l10n/template.ftl                  | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/components/compat-table/element.js b/components/compat-table/element.js
index d02071e9a..ca11cbd63 100644
--- a/components/compat-table/element.js
+++ b/components/compat-table/element.js
@@ -754,7 +754,7 @@ export class MDNCompatTable extends L10nMixin(LitElement) {
         supportNotes.push({
           iconName: "disabled",
           label: this.l10n.raw({
-            id: "compat-support-flags",
+            id: "compat-support-flag-range",
             args: {
               version_range: versionRange,
               version_added: item.version_added,
diff --git a/l10n/locales/en-US.ftl b/l10n/locales/en-US.ftl
index cb4d93523..22a215a46 100644
--- a/l10n/locales/en-US.ftl
+++ b/l10n/locales/en-US.ftl
@@ -91,7 +91,7 @@ compat-branch-altname = Alternate name: <code data-l10n-name="altname">{ $altnam
 compat-branch-prefix-altname = Prefix: <code data-l10n-name="prefix">{ $prefix }</code>, alternate name: <code data-l10n-name="altname">{ $altname }</code>
 compat-support-removed = Removed in { $version } and later
 compat-support-see-impl-url = See <a data-l10n-name="impl_url">{ $label }</a>
-compat-support-flags =
+compat-support-flag-range =
   { $version_range ->
     [range] From version { $version_added } until { $version_last }, users
     [from] From version { $version_added }, users
diff --git a/l10n/template.ftl b/l10n/template.ftl
index 43f3dea5a..aed7ab5a3 100644
--- a/l10n/template.ftl
+++ b/l10n/template.ftl
@@ -56,7 +56,7 @@ compat-branch-altname = Alternate name: <code data-l10n-name="altname">{ $altnam
 compat-branch-prefix-altname = Prefix: <code data-l10n-name="prefix">{ $prefix }</code>, alternate name: <code data-l10n-name="altname">{ $altname }</code>
 compat-support-removed = Removed in { $version } and later
 compat-support-see-impl-url = See <a data-l10n-name="impl_url">{ $label }</a>
-compat-support-flags =
+compat-support-flag-range =
     { $version_range ->
         [range] From version { $version_added } until { $version_last }, users
         [from] From version { $version_added }, users

From 4e8b4b7420f91f2b3f8cee8d6a64099b83d6779d Mon Sep 17 00:00:00 2001
From: Nathan Leuz <nmleuz@gmail.com>
Date: Thu, 30 Jul 2026 15:03:01 -0400
Subject: [PATCH 3/3] Move block out of for loop and fix indents

---
 components/compat-table/element.js | 26 ++++++++++-----------
 l10n/locales/en-US.ftl             | 36 +++++++++++++++---------------
 2 files changed, 31 insertions(+), 31 deletions(-)

diff --git a/components/compat-table/element.js b/components/compat-table/element.js
index ca11cbd63..ec522552c 100644
--- a/components/compat-table/element.js
+++ b/components/compat-table/element.js
@@ -737,20 +737,20 @@ export class MDNCompatTable extends L10nMixin(LitElement) {
     // heading (see `_renderBranchHeading`), so they aren't pushed here.
 
     if (item.flags) {
-      for (const { type, name, value_to_set } of item.flags) {
-        const hasAdded =
-          typeof item.version_added === "string" &&
-          item.version_added !== "preview";
-        const hasLast = typeof item.version_last === "string";
-
-        const versionRange = hasAdded
-          ? hasLast
-            ? "range"
-            : "from"
-          : hasLast
-            ? "until"
-            : "none";
+      const hasAdded =
+        typeof item.version_added === "string" &&
+        item.version_added !== "preview";
+      const hasLast = typeof item.version_last === "string";
+
+      const versionRange = hasAdded
+        ? hasLast
+          ? "range"
+          : "from"
+        : hasLast
+          ? "until"
+          : "none";
 
+      for (const { type, name, value_to_set } of item.flags) {
         supportNotes.push({
           iconName: "disabled",
           label: this.l10n.raw({
diff --git a/l10n/locales/en-US.ftl b/l10n/locales/en-US.ftl
index 22a215a46..7ed0d15a6 100644
--- a/l10n/locales/en-US.ftl
+++ b/l10n/locales/en-US.ftl
@@ -92,25 +92,25 @@ compat-branch-prefix-altname = Prefix: <code data-l10n-name="prefix">{ $prefix }
 compat-support-removed = Removed in { $version } and later
 compat-support-see-impl-url = See <a data-l10n-name="impl_url">{ $label }</a>
 compat-support-flag-range =
-  { $version_range ->
-    [range] From version { $version_added } until { $version_last }, users
-    [from] From version { $version_added }, users
-    [until] Until { $version_last }, users
-    *[none] Users
-  } must explicitly set the <code data-l10n-name="name">{ $flag_name }</code> { $flag_type ->
-    *[preference] preference
-    [runtime_flag] runtime flag
-  }{ $has_value ->
-    [1]{ " " }to <code data-l10n-name="value">{ $flag_value }</code>
-    *[0] { "" }
-  }.{ $has_pref_url ->
-    [1] { $flag_type ->
-    [preference]{ " " }To change preferences in { $browser_name }, visit { $browser_pref_url }.
-    *[other] { "" }
+    { $version_range ->
+        [range] From version { $version_added } until { $version_last }, users
+        [from] From version { $version_added }, users
+        [until] Until { $version_last }, users
+       *[none] Users
+    } must explicitly set the <code data-l10n-name="name">{ $flag_name }</code> { $flag_type ->
+       *[preference] preference
+        [runtime_flag] runtime flag
+    }{ $has_value ->
+        [1] { " " }to <code data-l10n-name="value">{ $flag_value }</code>
+       *[0] { "" }
+    }.{ $has_pref_url ->
+        [1]
+            { $flag_type ->
+                [preference] { " " }To change preferences in { $browser_name }, visit { $browser_pref_url }.
+               *[other] { "" }
+            }
+       *[0] { "" }
     }
-    *[0] { "" }
-  }
-
 compat-legend = Legend
 compat-legend-tip = Tip: you can click/tap on a cell for more information.
 compat-legend-yes = { compat-support-full }