Changeset 275559 in webkit

Timestamp:

Apr 6, 2021 3:09:25 PM (3 years ago)

Author:

Patrick Angle

Message:

Web Inspector: Grid overlay track size labels should show implicit auto value and no computed size
​https://bugs.webkit.org/show_bug.cgi?id=224199

Reviewed by BJ Burg.

Previously, implicit auto track sizes were only shown if there were some number of explicit track sizes for
that track direction (rows/columns). To resolve this, authoredGridTrackSizes now only returns explicit
authored track sizes, and buildGridOverlay then infers auto for all remaining tracks. This will also help
resolve bug 224200 by providing a way to distinguish explicit and implicit tracks.

After discussion, this patch also removes the computed size of tracks from labels, as that information is
available in the box model diagram for children elements and having that information in these labels further
cramped often limited space for overlay labels.

• inspector/InspectorOverlay.cpp:

(WebCore::authoredGridTrackSizes):
(WebCore::InspectorOverlay::buildGridOverlay):

Location:

trunk/Source/WebCore

Files:

• ChangeLog (modified) (1 diff)
• inspector/InspectorOverlay.cpp (modified) (3 diffs)

trunk/Source/WebCore/ChangeLog

@@ +1 @@
+2021-04-06  Patrick Angle  <pangle@apple.com>
+
+        Web Inspector: Grid overlay track size labels should show implicit `auto` value and no computed size
+        https://bugs.webkit.org/show_bug.cgi?id=224199
+
+        Reviewed by BJ Burg.
+
+        Previously, implicit `auto` track sizes were only shown if there were some number of explicit track sizes for
+        that track direction (rows/columns). To resolve this, `authoredGridTrackSizes` now only returns explicit
+        authored track sizes, and buildGridOverlay then infers `auto` for all remaining tracks. This will also help
+        resolve bug 224200 by providing a way to distinguish explicit and implicit tracks.
+
+        After discussion, this patch also removes the computed size of tracks from labels, as that information is
+        available in the box model diagram for children elements and having that information in these labels further
+        cramped often limited space for overlay labels.
+
+        * inspector/InspectorOverlay.cpp:
+        (WebCore::authoredGridTrackSizes):
+        (WebCore::InspectorOverlay::buildGridOverlay):
+
 2021-04-06  Patrick Angle  <pangle@apple.com>
 

trunk/Source/WebCore/inspector/InspectorOverlay.cpp

@@ -1552 +1552 @@
         handleValueIgnoringLineNames(currentValue);
     }
-
-    // Remaining tracks will be `auto`.
-    while (trackSizes.size() < expectedTrackCount)
-        trackSizes.append("auto"_s);
     
     return trackSizes;
@@ -1787 +1783 @@
             
             if (gridOverlay.config.showTrackSizes) {
-                auto trackSizeLabel = String::number(roundf(width));
-                trackSizeLabel.append("px"_s);
-
-                String authoredTrackSize;
-                if (i < authoredTrackColumnSizes.size()) {
-                    auto authoredTrackSize = authoredTrackColumnSizes[i];
-                    if (authoredTrackSize.length() && authoredTrackSize != trackSizeLabel) {
-                        trackSizeLabel.append(thinSpace);
-                        trackSizeLabel.append(bullet);
-                        trackSizeLabel.append(thinSpace);
-                        trackSizeLabel.append(authoredTrackSize);
-                    }
-                }
-
+                auto authoredTrackSize = i < authoredTrackColumnSizes.size() ? authoredTrackColumnSizes[i] : "auto"_s;
                 FloatLine trackTopLine = { columnStartLine.start(), columnEndLine.start() };
-                gridHighlightOverlay.labels.append(buildLabel(trackSizeLabel, trackTopLine.pointAtRelativeDistance(0.5), translucentLabelBackgroundColor, correctedArrowDirection(LabelArrowDirection::Up, GridTrackSizingDirection::ForColumns), LabelArrowEdgePosition::Middle));
+                gridHighlightOverlay.labels.append(buildLabel(authoredTrackSize, trackTopLine.pointAtRelativeDistance(0.5), translucentLabelBackgroundColor, correctedArrowDirection(LabelArrowDirection::Up, GridTrackSizingDirection::ForColumns), LabelArrowEdgePosition::Middle));
             }
         } else
@@ -1884 +1867 @@
 
             if (gridOverlay.config.showTrackSizes) {
-                auto trackSizeLabel = String::number(roundf(height));
-                trackSizeLabel.append("px"_s);
-
-                String authoredTrackSize;
-                if (i < authoredTrackRowSizes.size()) {
-                    auto authoredTrackSize = authoredTrackRowSizes[i];
-                    if (authoredTrackSize.length() && authoredTrackSize != trackSizeLabel) {
-                        trackSizeLabel.append(thinSpace);
-                        trackSizeLabel.append(bullet);
-                        trackSizeLabel.append(thinSpace);
-                        trackSizeLabel.append(authoredTrackSize);
-                    }
-                }
-
+                auto authoredTrackSize = i < authoredTrackRowSizes.size() ? authoredTrackRowSizes[i] : "auto"_s;
                 FloatLine trackLeftLine = { rowStartLine.start(), rowEndLine.start() };
-                gridHighlightOverlay.labels.append(buildLabel(trackSizeLabel, trackLeftLine.pointAtRelativeDistance(0.5), translucentLabelBackgroundColor, correctedArrowDirection(LabelArrowDirection::Left, GridTrackSizingDirection::ForRows), LabelArrowEdgePosition::Middle));
+                gridHighlightOverlay.labels.append(buildLabel(authoredTrackSize, trackLeftLine.pointAtRelativeDistance(0.5), translucentLabelBackgroundColor, correctedArrowDirection(LabelArrowDirection::Left, GridTrackSizingDirection::ForRows), LabelArrowEdgePosition::Middle));
             }
         } else