This test verifies the position and size of the highlight rectangles overlayed on an inspected CSS grid div.

paddedGrid{
  "paths": [
    {
      "path": [
        "M",
        173,
        1133,
        "L",
        173,
        133,
        "L",
        238,
        133,
        "L",
        238,
        1133,
        "Z"
      ],
      "fillColor": "rgba(255, 0, 0, 0)",
      "outlineColor": "rgba(128, 0, 0, 0)",
      "name": "content"
    },
    {
      "path": [
        "M",
        123,
        1193,
        "L",
        123,
        73,
        "L",
        288,
        73,
        "L",
        288,
        1193,
        "Z"
      ],
      "fillColor": "rgba(0, 255, 0, 0)",
      "name": "padding"
    },
    {
      "path": [
        "M",
        118,
        1198,
        "L",
        118,
        68,
        "L",
        293,
        68,
        "L",
        293,
        1198,
        "Z"
      ],
      "fillColor": "rgba(0, 0, 255, 0)",
      "name": "border"
    },
    {
      "path": [
        "M",
        108,
        1208,
        "L",
        108,
        58,
        "L",
        303,
        58,
        "L",
        303,
        1208,
        "Z"
      ],
      "fillColor": "rgba(255, 255, 255, 0)",
      "name": "margin"
    }
  ],
  "showRulers": true,
  "showExtensionLines": true,
  "showAccessibilityInfo": true,
  "colorFormat": "hex",
  "elementInfo": {
    "tagName": "div",
    "idValue": "paddedGrid",
    "className": ".grid.padded.fixed",
    "nodeWidth": "175",
    "nodeHeight": "1130",
    "isKeyboardFocusable": false,
    "accessibleName": "",
    "accessibleRole": "generic",
    "layoutObjectName": "LayoutGrid",
    "showAccessibilityInfo": true
  },
  "gridInfo": [
    {
      "rotationAngle": -90,
      "writingMode": "horizontal-tb",
      "columnTrackSizes": [
        {
          "x": 173,
          "y": 383,
          "computedSize": 50,
          "authoredSize": "50px"
        },
        {
          "x": 173,
          "y": 233,
          "computedSize": 200,
          "authoredSize": "20%"
        }
      ],
      "rowTrackSizes": [
        {
          "x": 185.5,
          "y": 408,
          "computedSize": 25
        },
        {
          "x": 225.5,
          "y": 408,
          "computedSize": 25
        }
      ],
      "rows": [
        "M",
        173,
        408,
        "L",
        173,
        133,
        "M",
        198,
        133,
        "L",
        198,
        408,
        "M",
        213,
        408,
        "L",
        213,
        133,
        "M",
        238,
        133,
        "L",
        238,
        408
      ],
      "rowGaps": [
        "M",
        198,
        408,
        "L",
        198,
        133,
        "L",
        213,
        133,
        "L",
        213,
        408,
        "Z"
      ],
      "columns": [
        "M",
        173,
        408,
        "L",
        238,
        408,
        "M",
        238,
        358,
        "L",
        173,
        358,
        "M",
        173,
        333,
        "L",
        238,
        333,
        "M",
        238,
        133,
        "L",
        173,
        133
      ],
      "columnGaps": [
        "M",
        173,
        358,
        "L",
        173,
        333,
        "L",
        238,
        333,
        "L",
        238,
        358,
        "Z"
      ],
      "positiveRowLineNumberPositions": [
        {
          "x": 173,
          "y": 408
        },
        {
          "x": 205.5,
          "y": 408
        },
        {
          "x": 238,
          "y": 408
        }
      ],
      "positiveColumnLineNumberPositions": [
        {
          "x": 173,
          "y": 408
        },
        {
          "x": 173,
          "y": 345.5
        },
        {
          "x": 173,
          "y": 133
        }
      ],
      "negativeRowLineNumberPositions": [
        {
          "x": 173,
          "y": 133
        }
      ],
      "negativeColumnLineNumberPositions": [
        {
          "x": 238,
          "y": 408
        },
        {
          "x": 238,
          "y": 345.5
        },
        {
          "x": 238,
          "y": 133
        }
      ],
      "areaNames": {},
      "rowLineNameOffsets": [],
      "columnLineNameOffsets": [],
      "gridBorder": [
        "M",
        173,
        408,
        "L",
        173,
        133,
        "L",
        238,
        133,
        "L",
        238,
        408,
        "Z"
      ],
      "gridHighlightConfig": {
        "gridBorderDash": false,
        "rowLineDash": true,
        "columnLineDash": true,
        "showGridExtensionLines": true,
        "showPositiveLineNumbers": true,
        "showNegativeLineNumbers": true,
        "showAreaNames": true,
        "showLineNames": true,
        "gridBorderColor": "rgba(255, 0, 0, 0)",
        "rowLineColor": "rgba(128, 0, 0, 0)",
        "columnLineColor": "rgba(128, 0, 0, 0)",
        "rowGapColor": "rgba(0, 255, 0, 0)",
        "columnGapColor": "rgba(0, 0, 255, 0)",
        "rowHatchColor": "rgba(255, 255, 255, 0)",
        "columnHatchColor": "rgba(128, 128, 128, 0)",
        "areaBorderColor": "rgba(255, 0, 0, 0)",
        "gridBackgroundColor": "rgba(255, 0, 0, 0)"
      },
      "isPrimaryGrid": true
    }
  ]
}
nestedGrid{
  "paths": [
    {
      "path": [
        "M",
        228,
        1108,
        "L",
        228,
        108,
        "L",
        328,
        108,
        "L",
        328,
        1108,
        "Z"
      ],
      "fillColor": "rgba(255, 0, 0, 0)",
      "outlineColor": "rgba(128, 0, 0, 0)",
      "name": "content"
    },
    {
      "path": [
        "M",
        228,
        1108,
        "L",
        228,
        108,
        "L",
        328,
        108,
        "L",
        328,
        1108,
        "Z"
      ],
      "fillColor": "rgba(0, 255, 0, 0)",
      "name": "padding"
    },
    {
      "path": [
        "M",
        228,
        1108,
        "L",
        228,
        108,
        "L",
        328,
        108,
        "L",
        328,
        1108,
        "Z"
      ],
      "fillColor": "rgba(0, 0, 255, 0)",
      "name": "border"
    },
    {
      "path": [
        "M",
        228,
        1108,
        "L",
        228,
        108,
        "L",
        328,
        108,
        "L",
        328,
        1108,
        "Z"
      ],
      "fillColor": "rgba(255, 255, 255, 0)",
      "name": "margin"
    }
  ],
  "showRulers": true,
  "showExtensionLines": true,
  "showAccessibilityInfo": true,
  "colorFormat": "hex",
  "elementInfo": {
    "tagName": "div",
    "idValue": "nestedGrid",
    "className": ".grid",
    "nodeWidth": "100",
    "nodeHeight": "1000",
    "isKeyboardFocusable": false,
    "accessibleName": "",
    "accessibleRole": "generic",
    "layoutObjectName": "LayoutGrid",
    "showAccessibilityInfo": true
  },
  "gridInfo": [
    {
      "rotationAngle": -90,
      "writingMode": "horizontal-tb",
      "columnTrackSizes": [
        {
          "x": 228,
          "y": 1083,
          "computedSize": 50,
          "authoredSize": "50px"
        },
        {
          "x": 228,
          "y": 958,
          "computedSize": 200,
          "authoredSize": "20%"
        }
      ],
      "rowTrackSizes": [
        {
          "x": 240.5,
          "y": 1108,
          "computedSize": 25
        },
        {
          "x": 265.5,
          "y": 1108,
          "computedSize": 25
        }
      ],
      "rows": [
        "M",
        228,
        1108,
        "L",
        228,
        858,
        "M",
        253,
        1108,
        "L",
        253,
        858,
        "M",
        278,
        858,
        "L",
        278,
        1108
      ],
      "rowGaps": [
        "M",
        253,
        1108,
        "L",
        253,
        858,
        "L",
        253,
        858,
        "L",
        253,
        1108,
        "Z"
      ],
      "columns": [
        "M",
        228,
        1108,
        "L",
        278,
        1108,
        "M",
        228,
        1058,
        "L",
        278,
        1058,
        "M",
        278,
        858,
        "L",
        228,
        858
      ],
      "columnGaps": [
        "M",
        228,
        1058,
        "L",
        228,
        1058,
        "L",
        278,
        1058,
        "L",
        278,
        1058,
        "Z"
      ],
      "positiveRowLineNumberPositions": [
        {
          "x": 228,
          "y": 1108
        },
        {
          "x": 253,
          "y": 1108
        },
        {
          "x": 278,
          "y": 1108
        }
      ],
      "positiveColumnLineNumberPositions": [
        {
          "x": 228,
          "y": 1108
        },
        {
          "x": 228,
          "y": 1058
        },
        {
          "x": 228,
          "y": 858
        }
      ],
      "negativeRowLineNumberPositions": [
        {
          "x": 228,
          "y": 858
        }
      ],
      "negativeColumnLineNumberPositions": [
        {
          "x": 278,
          "y": 1108
        },
        {
          "x": 278,
          "y": 1058
        },
        {
          "x": 278,
          "y": 858
        }
      ],
      "areaNames": {},
      "rowLineNameOffsets": [],
      "columnLineNameOffsets": [],
      "gridBorder": [
        "M",
        228,
        1108,
        "L",
        228,
        858,
        "L",
        278,
        858,
        "L",
        278,
        1108,
        "Z"
      ],
      "gridHighlightConfig": {
        "gridBorderDash": false,
        "rowLineDash": true,
        "columnLineDash": true,
        "showGridExtensionLines": true,
        "showPositiveLineNumbers": true,
        "showNegativeLineNumbers": true,
        "showAreaNames": true,
        "showLineNames": true,
        "gridBorderColor": "rgba(255, 0, 0, 0)",
        "rowLineColor": "rgba(128, 0, 0, 0)",
        "columnLineColor": "rgba(128, 0, 0, 0)",
        "rowGapColor": "rgba(0, 255, 0, 0)",
        "columnGapColor": "rgba(0, 0, 255, 0)",
        "rowHatchColor": "rgba(255, 255, 255, 0)",
        "columnHatchColor": "rgba(128, 128, 128, 0)",
        "areaBorderColor": "rgba(255, 0, 0, 0)",
        "gridBackgroundColor": "rgba(255, 0, 0, 0)"
      },
      "isPrimaryGrid": true
    }
  ]
}