tor-browser

commit a47d39273b6ef4834e5351ef28be836e0a86d9a2
parent 4844f05e2c814809ce84333d7cb90caa71289dcf
Author: GopiRK <gopi030506@gmail.com>
Date:   Thu, 16 Oct 2025 07:52:19 +0000

Bug 1940198 - Align malformed grid-template-areas in the inspector. r=devtools-reviewers,jdescottes.

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

Diffstat:
M
devtools/client/inspector/rules/test/browser_rules_grid-template-areas.js
 | 
8
++++----
M
devtools/client/inspector/rules/views/text-property-editor.js
 | 
3
+--

2 files changed, 5 insertions(+), 6 deletions(-)
diff --git a/devtools/client/inspector/rules/test/browser_rules_grid-template-areas.js b/devtools/client/inspector/rules/test/browser_rules_grid-template-areas.js
@@ -142,8 +142,8 @@ add_task(async function () {
     "the quotes strings values are all displayed on the same single line"
   );
 
-  // test that when invalid strings values do not get formatted
-  info("testing it does not try to format invalid values");
+  // test that invalid string values are now formatted to help with debugging
+  info("testing that it DOES try to format invalid values");
   await selectNode("#testid-invalid-strings", inspector);
   const invalidGridRuleProperty = await getRuleViewProperty(
     view,
@@ -152,8 +152,8 @@ add_task(async function () {
   ).valueSpan;
   is(
     invalidGridRuleProperty.innerText,
-    '"a a b" "a a"',
-    "the invalid strings values do not get formatted"
+    '\n"a a b" \n"a a"',
+    "the invalid strings values are now formatted to help debugging"
   );
 
   // test that when a valid value without quotes such as `inherit` it does not get formatted
diff --git a/devtools/client/inspector/rules/views/text-property-editor.js b/devtools/client/inspector/rules/views/text-property-editor.js
@@ -639,7 +639,6 @@ class TextPropertyEditor {
     this.valueSpan.appendChild(frag);
     if (
       this.valueSpan.textProperty?.name === "grid-template-areas" &&
-      this.isValid() &&
       (this.valueSpan.innerText.includes(`"`) ||
         this.valueSpan.innerText.includes(`'`))
     ) {
@@ -1898,7 +1897,7 @@ class TextPropertyEditor {
       .map(line => line.split(" "))
       .map((line, i, lines) =>
         line.map((col, j) =>
-          col.padEnd(Math.max(...lines.map(l => l[j].length)), " ")
+          col.padEnd(Math.max(...lines.map(l => l[j]?.length || 0)), " ")
         )
       )
       .map(