chrome-devtools-frontend
Version:
Chrome DevTools UI
41 lines (38 loc) • 8.03 kB
HTML
<!--
Copyright 2020 The Chromium Authors. All rights reserved.
Use of this source code is governed by a BSD-style license that can be
found in the LICENSE file.
-->
<html lang="en">
<head>
<meta charset="utf-8">
<title>Debug</title>
<meta name="viewport" content="width=device-width,initial-scale=1">
<script type="module" src="/out/Default/resources/inspector_overlay/main.js"></script>
</head>
<body>
<script type="module">
function getRGBA() {
const rc = () => Math.floor(Math.random() * 255);
return `rgba(${rc()}, ${rc()}, ${rc()}, 0.5)`;
}
const response = { "highlight": { "paths": [ { "path": [ "M", 0, 0, "L", 1433.3333740234375, 0, "L", 1433.3333740234375, 22409.57421875, "L", 0, 22409.57421875, "Z" ], "fillColor": "rgba(255, 0, 0, 0)", "outlineColor": "rgba(128, 0, 0, 0)", "name": "content" }, { "path": [ "M", 0, 0, "L", 1433.3333740234375, 0, "L", 1433.3333740234375, 22409.57421875, "L", 0, 22409.57421875, "Z" ], "fillColor": "rgba(0, 255, 0, 0)", "name": "padding" }, { "path": [ "M", 0, 0, "L", 1433.3333740234375, 0, "L", 1433.3333740234375, 22409.57421875, "L", 0, 22409.57421875, "Z" ], "fillColor": "rgba(0, 0, 255, 0)", "name": "border" }, { "path": [ "M", 0, 0, "L", 1433.3333740234375, 0, "L", 1433.3333740234375, 22409.57421875, "L", 0, 22409.57421875, "Z" ], "fillColor": "rgba(255, 255, 255, 0)", "name": "margin" } ], "gridInfo": [ { "rotationAngle": 0, "writingMode": "horizontal-tb", "columnTrackSizes": [ { "x": 52, "y": 0, "computedSize": 69.33333587646484, "authoredSize": "5em" }, { "x": 291.1875, "y": 0, "computedSize": 138.6666717529297, "authoredSize": "10em" }, { "x": 846.71875, "y": 0, "computedSize": 491.1111145019531, "authoredSize": "minmax(55ch, 65ch)" }, { "x": 1311.21875, "y": 0, "computedSize": 17.29166603088379, "authoredSize": "auto" }, { "x": 1420.359375, "y": 0, "computedSize": 17.29166603088379 } ], "rowTrackSizes": [ { "x": 0, "y": 19.875, "computedSize": 26.52083396911621 }, { "x": 0, "y": 138.5625, "computedSize": 76.25695037841797 }, { "x": 0, "y": 305.34375, "computedSize": 90.66666412353516 }, { "x": 0, "y": 3417.640625, "computedSize": 4003.604248046875 }, { "x": 0, "y": 6523.140625, "computedSize": 81.59722137451172 }, { "x": 0, "y": 13982.390625, "computedSize": 9808.611328125 }, { "x": 0, "y": 21641.5625, "computedSize": 348.1528015136719 }, { "x": 0, "y": 22120, "computedSize": 234.30555725097656 }, { "x": 0, "y": 22373.4375, "computedSize": 48.16666793823242 } ], "rows": [ "M", 0, 0, "L", 1433.3333740234375, 0, "M", 1433.3333740234375, 39.78125, "L", 0, 39.78125, "M", 0, 81.375, "L", 1433.3333740234375, 81.375, "M", 1433.3333740234375, 195.7604217529297, "L", 0, 195.7604217529297, "M", 0, 237.3541717529297, "L", 1433.3333740234375, 237.3541717529297, "M", 1433.3333740234375, 373.35418701171875, "L", 0, 373.35418701171875, "M", 0, 414.94793701171875, "L", 1433.3333740234375, 414.94793701171875, "M", 1433.3333740234375, 6420.3544921875, "L", 0, 6420.3544921875, "M", 0, 6461.9482421875, "L", 1433.3333740234375, 6461.9482421875, "M", 1433.3333740234375, 6584.34375, "L", 0, 6584.34375, "M", 0, 6625.9375, "L", 1433.3333740234375, 6625.9375, "M", 1433.3333740234375, 21338.85546875, "L", 0, 21338.85546875, "M", 0, 21380.44921875, "L", 1433.3333740234375, 21380.44921875, "M", 1433.3333740234375, 21902.677734375, "L", 0, 21902.677734375, "M", 0, 21944.271484375, "L", 1433.3333740234375, 21944.271484375, "M", 1433.3333740234375, 22295.73046875, "L", 0, 22295.73046875, "M", 0, 22337.32421875, "L", 1433.3333740234375, 22337.32421875, "M", 1433.3333740234375, 22409.57421875, "L", 0, 22409.57421875 ], "rowGaps": [ "M", 0, 39.78125, "L", 1433.3333740234375, 39.78125, "L", 1433.3333740234375, 81.375, "L", 0, 81.375, "Z", "M", 0, 195.7604217529297, "L", 1433.3333740234375, 195.7604217529297, "L", 1433.3333740234375, 237.3541717529297, "L", 0, 237.3541717529297, "Z", "M", 0, 373.35418701171875, "L", 1433.3333740234375, 373.35418701171875, "L", 1433.3333740234375, 414.94793701171875, "L", 0, 414.94793701171875, "Z", "M", 0, 6420.3544921875, "L", 1433.3333740234375, 6420.3544921875, "L", 1433.3333740234375, 6461.9482421875, "L", 0, 6461.9482421875, "Z", "M", 0, 6584.34375, "L", 1433.3333740234375, 6584.34375, "L", 1433.3333740234375, 6625.9375, "L", 0, 6625.9375, "Z", "M", 0, 21338.85546875, "L", 1433.3333740234375, 21338.85546875, "L", 1433.3333740234375, 21380.44921875, "L", 0, 21380.44921875, "Z", "M", 0, 21902.677734375, "L", 1433.3333740234375, 21902.677734375, "L", 1433.3333740234375, 21944.271484375, "L", 0, 21944.271484375, "Z", "M", 0, 22295.73046875, "L", 1433.3333740234375, 22295.73046875, "L", 1433.3333740234375, 22337.32421875, "L", 0, 22337.32421875, "Z" ], "columns": [ "M", 0, 0, "L", 0, 22409.57421875, "M", 104, 22409.57421875, "L", 104, 0, "M", 187.1979217529297, 0, "L", 187.1979217529297, 22409.57421875, "M", 395.19793701171875, 22409.57421875, "L", 395.19793701171875, 0, "M", 478.3958435058594, 0, "L", 478.3958435058594, 22409.57421875, "M", 1215.0625, 22409.57421875, "L", 1215.0625, 0, "M", 1298.260498046875, 0, "L", 1298.260498046875, 22409.57421875, "M", 1324.197998046875, 22409.57421875, "L", 1324.197998046875, 0, "M", 1407.3958740234375, 0, "L", 1407.3958740234375, 22409.57421875, "M", 1433.3333740234375, 22409.57421875, "L", 1433.3333740234375, 0 ], "columnGaps": [ "M", 104, 0, "L", 187.1979217529297, 0, "L", 187.1979217529297, 22409.57421875, "L", 104, 22409.57421875, "Z", "M", 395.19793701171875, 0, "L", 478.3958435058594, 0, "L", 478.3958435058594, 22409.57421875, "L", 395.19793701171875, 22409.57421875, "Z", "M", 1215.0625, 0, "L", 1298.260498046875, 0, "L", 1298.260498046875, 22409.57421875, "L", 1215.0625, 22409.57421875, "Z", "M", 1324.197998046875, 0, "L", 1407.3958740234375, 0, "L", 1407.3958740234375, 22409.57421875, "L", 1324.197998046875, 22409.57421875, "Z" ], "positiveRowLineNumberPositions": [ { "x": 0, "y": 0 }, { "x": 0, "y": 60.578125 }, { "x": 0, "y": 216.5625 }, { "x": 0, "y": 394.15625 }, { "x": 0, "y": 6441.15625 }, { "x": 0, "y": 6605.140625 }, { "x": 0, "y": 21359.65625 }, { "x": 0, "y": 21923.46875 }, { "x": 0, "y": 22316.53125 }, { "x": 0, "y": 22409.5625 } ], "positiveColumnLineNumberPositions": [ { "x": 0, "y": 0 }, { "x": 145.59375, "y": 0 }, { "x": 436.796875, "y": 0 }, { "x": 1256.65625, "y": 0 }, { "x": 1365.796875, "y": 0 }, { "x": 1433.328125, "y": 0 } ], "negativeRowLineNumberPositions": [ { "x": 1433.328125, "y": 0 } ], "negativeColumnLineNumberPositions": [ { "x": 0, "y": 22409.5625 }, { "x": 145.59375, "y": 22409.5625 }, { "x": 436.796875, "y": 22409.5625 }, { "x": 1256.65625, "y": 22409.5625 }, { "x": 1365.796875, "y": 22409.5625 } ], "areaNames": {}, "rowLineNameOffsets": [], "columnLineNameOffsets": [ { "x": 436.796875, "y": 0, "name": "main-content-start" }, { "x": 1256.65625, "y": 0, "name": "main-content-end" } ], "gridBorder": [ "M", 0, 0, "L", 1433.3333740234375, 0, "L", 1433.3333740234375, 22409.57421875, "L", 0, 22409.57421875, "Z" ], "gridHighlightConfig": { "gridBorderDash": false, "rowLineDash": true, "columnLineDash": true, "showGridExtensionLines": true, "showPositiveLineNumbers": true, "showNegativeLineNumbers": true, "showAreaNames": true, "showLineNames": true, "gridBorderColor": getRGBA(), "rowLineColor": getRGBA(), "columnLineColor": getRGBA(), "rowGapColor": getRGBA(), "columnGapColor": getRGBA(), "rowHatchColor": getRGBA(), "columnHatchColor": getRGBA(), "areaBorderColor": getRGBA(), "gridBackgroundColor": getRGBA() }, "isPrimaryGrid": true } ] } }
dispatch(["setPlatform", "mac"]);
dispatch(["setOverlay", "highlight"]);
dispatch(["reset", {
viewportSize: {
width: document.documentElement.clientWidth,
height: document.documentElement.clientHeight,
},
deviceScaleFactor: 1,
pageScaleFactor: 1,
pageZoomFactor: 1,
emulationScaleFactor: 1,
scrollX: 0,
scrollY: 0,
}]);
dispatch(["drawHighlight", response.highlight]);
</script>
</body>
</html>