Bug 1369585 - Explicitly identify the row and columns in cell infobar. r=gl
authorMicah Tigley <tigleym@gmail.com>
Sat, 03 Jun 2017 22:24:24 -0600
changeset 412718 5e9c3d9dd68e04f11da55fb3a85b99cbebb44dc7
parent 412717 22108a33acd5ce6ecbf0ca5f696a01591c5c0ca1
child 412719 1002aa75bf5df4820646ddc76e39752ef2116d34
push id1490
push usermtabara@mozilla.com
push dateMon, 31 Jul 2017 14:08:16 +0000
treeherdermozilla-release@70e32e6bf15e [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersgl
bugs1369585
milestone55.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1369585 - Explicitly identify the row and columns in cell infobar. r=gl MozReview-Commit-ID: F4oKtM3IEbg
devtools/client/locales/en-US/layout.properties
devtools/server/actors/highlighters/css-grid.js
--- a/devtools/client/locales/en-US/layout.properties
+++ b/devtools/client/locales/en-US/layout.properties
@@ -37,8 +37,12 @@ layout.noGrids=No grids
 
 # LOCALIZATION NOTE (layout.overlayMultipleGrids): The header for the list of grid
 # container elements that can be highlighted in the CSS Grid pane.
 layout.overlayMultipleGrids=Overlay Multiple Grids
 
 # LOCALIZATION NOTE (layout.overlayGrid): Alternate header for the list of grid container
 # elements if only one item can be selected.
 layout.overlayGrid=Overlay Grid
+
+# LOCALIZATION NOTE (layout.rowColumnPositions): The row and column position of a grid
+# cell shown in the grid cell infobar when hovering over the CSS grid outline.
+layout.rowColumnPositions=Row %S \/ Column %S
--- a/devtools/server/actors/highlighters/css-grid.js
+++ b/devtools/server/actors/highlighters/css-grid.js
@@ -25,16 +25,20 @@ const {
   apply,
   translate,
   multiply,
   scale,
   getNodeTransformationMatrix,
   getNodeTransformOrigin
 } = require("devtools/shared/layout/dom-matrix-2d");
 const { stringifyGridFragments } = require("devtools/server/actors/utils/css-grid-utils");
+const { LocalizationHelper } = require("devtools/shared/l10n");
+
+const LAYOUT_STRINGS_URI = "devtools/client/locales/layout.properties";
+const LAYOUT_L10N = new LocalizationHelper(LAYOUT_STRINGS_URI);
 
 const CSS_GRID_ENABLED_PREF = "layout.css.grid.enabled";
 
 const DEFAULT_GRID_COLOR = "#4B0082";
 
 const COLUMNS = "cols";
 const ROWS = "rows";
 
@@ -824,17 +828,18 @@ CssGridHighlighter.prototype = extend(Au
   },
 
   _updateGridCellInfobar(rowNumber, columnNumber, x1, x2, y1, y2) {
     let width = x2 - x1;
     let height = y2 - y1;
     let dim = parseFloat(width.toPrecision(6)) +
               " \u00D7 " +
               parseFloat(height.toPrecision(6));
-    let position = `${rowNumber}\/${columnNumber}`;
+    let position = LAYOUT_L10N.getFormatStr("layout.rowColumnPositions",
+                   rowNumber, columnNumber);
 
     this.getElement("cell-infobar-position").setTextContent(position);
     this.getElement("cell-infobar-dimensions").setTextContent(dim);
 
     let container = this.getElement("cell-infobar-container");
     this._moveInfobar(container, x1, x2, y1, y2, {
       position: "top",
       hideIfOffscreen: true