inspector_overlay/debug/main.html - devtools/devtools-frontend - Git at Google

 <!--
   Copyright 2020 The Chromium Authors
   Use of this source code is governed by a BSD-style license that can be
   found in the LICENSE file.
 -->
 <!DOCTYPE html>
 <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 test() {
       dispatch(["setOverlay", "paused"]);
       dispatch(["setPlatform", "mac"]);
       dispatch(["reset"]);
       dispatch(["drawPausedInDebuggerMessage", "test text"]);
       dispatch(["setOverlay", "viewportSize"]);
       dispatch(["reset"]);
       dispatch(["drawViewSize"]);
       dispatch(["setOverlay", "screenshot"]);
       dispatch(["setOverlay", "sourceOrder"]);
       dispatch(["reset"]);
       dispatch(["drawSourceOrder", {"paths":[{"path":["M",122,133.796875,"L",750,133.796875,"L",750,208.796875,"L",122,208.796875,"Z"], "outlineColor":"rgba(244, 90, 183, 1)","name":"content"},],
       "sourceOrder": 0, colorFormat: "hsl"}]);
       dispatch(["drawSourceOrder", {"paths":[{"path":["M",300,133.796875,"L",600,133.796875,"L",600,208.796875,"L",300,208.796875,"Z"], "outlineColor":"rgba(0, 120, 212, 1)","name":"content"},],
       "sourceOrder": 1, colorFormat: "hsl"}]);
       dispatch(["setOverlay", "highlight"]);
       dispatch(["reset"]);
       dispatch(["drawHighlight", {"paths":[{"path":["M",122,133.796875,"L",822,133.796875,"L",822,208.796875,"L",122,208.796875,"Z"], "fillColor":"rgba(111, 168, 220, 0.658823529411765)","name":"content"},
       {"path":["M",122,113.796875,"L",822,113.796875,"L",822,228.796875,"L",122,228.796875,"Z"],"fillColor":"rgba(246, 178, 107, 0.66)","name":"margin"}],"showRulers":false,"showExtensionLines":false,
       "elementInfo":{"tagName":"button","className":"class.name", "idValue":"download-hero","nodeWidth":"700","nodeHeight":"75","style":{"color":"#FFFFFFFF","font-family":"\"Product Sans\", \"Open Sans\", Roboto, Arial, \"Product Sans\", \"Open Sans\", Roboto, Arial","font-size":"20px","line-height":"25px","padding":"0px","margin":"20px 0px","background-color":"#00000000"},"contrast":{"fontSize":"20px","fontWeight":"400","backgroundColor":"#F9B826BF"},"isKeyboardFocusable":false,"accessibleName":"name","accessibleRole":"role","showAccessibilityInfo":true}, showExtensionLines: true, showRulers: true, colorFormat: "hsl"}]);

       const viewportWidth = document.documentElement.clientWidth;
       const viewportHeight = document.documentElement.clientHeight;

       dispatch(["reset", {
         viewportSize: {
           width: viewportWidth,
           height: viewportHeight,
         },
         deviceScaleFactor: 1,
         pageScaleFactor: 1,
         pageZoomFactor: 1,
         emulationScaleFactor: 1,
         scrollX: 0,
         scrollY: 0,
       }]);

       dispatch(["drawHighlight", { "paths": [ { "path": [ "M", 40, 314, "L", 182, 314, "L", 182, 564, "L", 40, 564, "Z" ], "fillColor": "rgba(255, 0, 0, 0)", "outlineColor": "rgba(128, 0, 0, 0)", "name": "content" }, { "path": [ "M", 40, 314, "L", 182, 314, "L", 182, 564, "L", 40, 564, "Z" ], "fillColor": "rgba(0, 255, 0, 0)", "name": "padding" }, { "path": [ "M", 40, 314, "L", 182, 314, "L", 182, 564, "L", 40, 564, "Z" ], "fillColor": "rgba(0, 0, 255, 0)", "name": "border" }, { "path": [ "M", 8, 282, "L", 1679.3333740234375, 282, "L", 1679.3333740234375, 596, "L", 8, 596, "Z" ], "fillColor": "rgba(255, 255, 255, 0)", "name": "margin" } ], "gridInfo": [ { "rotationAngle": 0, "writingMode": "vertical-rl", "columnTrackSizes": [ { "x": 118, "y": 314, "computedSize": 104, "authoredSize": "2fr" }, { "x": 251, "y": 314, "computedSize": 52, "authoredSize": "1fr" } ], "rowTrackSizes": [ { "x": 40, "y": 351.65625, "computedSize": 50.222225189208984 }, { "x": 40, "y": 430.65625, "computedSize": 33.77777862548828 } ], "rows": [ "M", 40, 314, "L", 290, 314, "M", 290, 389.3333435058594, "L", 40, 389.3333435058594, "M", 40, 405.3333435058594, "L", 290, 405.3333435058594, "M", 290, 456, "L", 40, 456 ], "rowGaps": [ "M", 40, 389.3333435058594, "L", 290, 389.3333435058594, "L", 290, 405.3333435058594, "L", 40, 405.3333435058594, "Z" ], "columns": [ "M", 40, 314, "L", 40, 456, "M", 196, 456, "L", 196, 314, "M", 212, 314, "L", 212, 456, "M", 290, 456, "L", 290, 314 ], "columnGaps": [ "M", 196, 314, "L", 212, 314, "L", 212, 456, "L", 196, 456, "Z" ], "positiveRowLineNumberPositions": [ { "x": 40, "y": 314 }, { "x": 40, "y": 397.328125 }, { "x": 40, "y": 456 } ], "positiveColumnLineNumberPositions": [ { "x": 40, "y": 314 }, { "x": 204, "y": 314 }, { "x": 290, "y": 314 } ], "negativeRowLineNumberPositions": [ { "x": 290, "y": 314 }, { "x": 290, "y": 397.328125 } ], "negativeColumnLineNumberPositions": [ { "x": 40, "y": 456 }, { "x": 204, "y": 456 }, { "x": 290, "y": 456 } ], "areaNames": { "foo": [ "M", 40, 314, "L", 290, 314, "L", 290, 389.3333435058594, "L", 40, 389.3333435058594, "Z" ] }, "rowLineNameOffsets": [], "columnLineNameOffsets": [ { "x": 204, "y": 314, "name": "middle" }, { "x": 204, "y": 314, "name": "center" }, { "x": 290, "y": 314, "name": "what" } ], "gridBorder": [ "M", 40, 314, "L", 290, 314, "L", 290, 456, "L", 40, 456, "Z" ], "gridHighlightConfig": { "gridBorderDash": false, "rowLineDash": true, "columnLineDash": true, "showGridExtensionLines": true, "showPositiveLineNumbers": true, "showNegativeLineNumbers": true, "showAreaNames": true, "showLineNames": false, "gridBorderColor": "rgba(255, 0, 0, 0.4)", "rowLineColor": "rgba(128, 0, 0, 0.4)", "columnLineColor": "rgba(128, 0, 0, 0.4)", "rowGapColor": "rgba(0, 255, 0, 0.4)", "columnGapColor": "rgba(0, 0, 255, 0.4)", "rowHatchColor": "rgba(255, 255, 255, 0.4)", "columnHatchColor": "rgba(128, 128, 128, 0.4)", "areaBorderColor": "rgba(255, 0, 0, 0.4)" }, "isPrimaryGrid": true } ] }]);
     }
     test();
   </script>
 </body>
 </html>
	<!--
	Copyright 2020 The Chromium Authors
	Use of this source code is governed by a BSD-style license that can be
	found in the LICENSE file.
	-->
	<!DOCTYPE html>
	<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 test() {
	dispatch(["setOverlay", "paused"]);
	dispatch(["setPlatform", "mac"]);
	dispatch(["reset"]);
	dispatch(["drawPausedInDebuggerMessage", "test text"]);
	dispatch(["setOverlay", "viewportSize"]);
	dispatch(["reset"]);
	dispatch(["drawViewSize"]);
	dispatch(["setOverlay", "screenshot"]);
	dispatch(["setOverlay", "sourceOrder"]);
	dispatch(["reset"]);
	dispatch(["drawSourceOrder", {"paths":[{"path":["M",122,133.796875,"L",750,133.796875,"L",750,208.796875,"L",122,208.796875,"Z"], "outlineColor":"rgba(244, 90, 183, 1)","name":"content"},],
	"sourceOrder": 0, colorFormat: "hsl"}]);
	dispatch(["drawSourceOrder", {"paths":[{"path":["M",300,133.796875,"L",600,133.796875,"L",600,208.796875,"L",300,208.796875,"Z"], "outlineColor":"rgba(0, 120, 212, 1)","name":"content"},],
	"sourceOrder": 1, colorFormat: "hsl"}]);
	dispatch(["setOverlay", "highlight"]);
	dispatch(["reset"]);
	dispatch(["drawHighlight", {"paths":[{"path":["M",122,133.796875,"L",822,133.796875,"L",822,208.796875,"L",122,208.796875,"Z"], "fillColor":"rgba(111, 168, 220, 0.658823529411765)","name":"content"},
	{"path":["M",122,113.796875,"L",822,113.796875,"L",822,228.796875,"L",122,228.796875,"Z"],"fillColor":"rgba(246, 178, 107, 0.66)","name":"margin"}],"showRulers":false,"showExtensionLines":false,
	"elementInfo":{"tagName":"button","className":"class.name", "idValue":"download-hero","nodeWidth":"700","nodeHeight":"75","style":{"color":"#FFFFFFFF","font-family":"\"Product Sans\", \"Open Sans\", Roboto, Arial, \"Product Sans\", \"Open Sans\", Roboto, Arial","font-size":"20px","line-height":"25px","padding":"0px","margin":"20px 0px","background-color":"#00000000"},"contrast":{"fontSize":"20px","fontWeight":"400","backgroundColor":"#F9B826BF"},"isKeyboardFocusable":false,"accessibleName":"name","accessibleRole":"role","showAccessibilityInfo":true}, showExtensionLines: true, showRulers: true, colorFormat: "hsl"}]);

	const viewportWidth = document.documentElement.clientWidth;
	const viewportHeight = document.documentElement.clientHeight;

	dispatch(["reset", {
	viewportSize: {
	width: viewportWidth,
	height: viewportHeight,
	},
	deviceScaleFactor: 1,
	pageScaleFactor: 1,
	pageZoomFactor: 1,
	emulationScaleFactor: 1,
	scrollX: 0,
	scrollY: 0,
	}]);

	dispatch(["drawHighlight", { "paths": [ { "path": [ "M", 40, 314, "L", 182, 314, "L", 182, 564, "L", 40, 564, "Z" ], "fillColor": "rgba(255, 0, 0, 0)", "outlineColor": "rgba(128, 0, 0, 0)", "name": "content" }, { "path": [ "M", 40, 314, "L", 182, 314, "L", 182, 564, "L", 40, 564, "Z" ], "fillColor": "rgba(0, 255, 0, 0)", "name": "padding" }, { "path": [ "M", 40, 314, "L", 182, 314, "L", 182, 564, "L", 40, 564, "Z" ], "fillColor": "rgba(0, 0, 255, 0)", "name": "border" }, { "path": [ "M", 8, 282, "L", 1679.3333740234375, 282, "L", 1679.3333740234375, 596, "L", 8, 596, "Z" ], "fillColor": "rgba(255, 255, 255, 0)", "name": "margin" } ], "gridInfo": [ { "rotationAngle": 0, "writingMode": "vertical-rl", "columnTrackSizes": [ { "x": 118, "y": 314, "computedSize": 104, "authoredSize": "2fr" }, { "x": 251, "y": 314, "computedSize": 52, "authoredSize": "1fr" } ], "rowTrackSizes": [ { "x": 40, "y": 351.65625, "computedSize": 50.222225189208984 }, { "x": 40, "y": 430.65625, "computedSize": 33.77777862548828 } ], "rows": [ "M", 40, 314, "L", 290, 314, "M", 290, 389.3333435058594, "L", 40, 389.3333435058594, "M", 40, 405.3333435058594, "L", 290, 405.3333435058594, "M", 290, 456, "L", 40, 456 ], "rowGaps": [ "M", 40, 389.3333435058594, "L", 290, 389.3333435058594, "L", 290, 405.3333435058594, "L", 40, 405.3333435058594, "Z" ], "columns": [ "M", 40, 314, "L", 40, 456, "M", 196, 456, "L", 196, 314, "M", 212, 314, "L", 212, 456, "M", 290, 456, "L", 290, 314 ], "columnGaps": [ "M", 196, 314, "L", 212, 314, "L", 212, 456, "L", 196, 456, "Z" ], "positiveRowLineNumberPositions": [ { "x": 40, "y": 314 }, { "x": 40, "y": 397.328125 }, { "x": 40, "y": 456 } ], "positiveColumnLineNumberPositions": [ { "x": 40, "y": 314 }, { "x": 204, "y": 314 }, { "x": 290, "y": 314 } ], "negativeRowLineNumberPositions": [ { "x": 290, "y": 314 }, { "x": 290, "y": 397.328125 } ], "negativeColumnLineNumberPositions": [ { "x": 40, "y": 456 }, { "x": 204, "y": 456 }, { "x": 290, "y": 456 } ], "areaNames": { "foo": [ "M", 40, 314, "L", 290, 314, "L", 290, 389.3333435058594, "L", 40, 389.3333435058594, "Z" ] }, "rowLineNameOffsets": [], "columnLineNameOffsets": [ { "x": 204, "y": 314, "name": "middle" }, { "x": 204, "y": 314, "name": "center" }, { "x": 290, "y": 314, "name": "what" } ], "gridBorder": [ "M", 40, 314, "L", 290, 314, "L", 290, 456, "L", 40, 456, "Z" ], "gridHighlightConfig": { "gridBorderDash": false, "rowLineDash": true, "columnLineDash": true, "showGridExtensionLines": true, "showPositiveLineNumbers": true, "showNegativeLineNumbers": true, "showAreaNames": true, "showLineNames": false, "gridBorderColor": "rgba(255, 0, 0, 0.4)", "rowLineColor": "rgba(128, 0, 0, 0.4)", "columnLineColor": "rgba(128, 0, 0, 0.4)", "rowGapColor": "rgba(0, 255, 0, 0.4)", "columnGapColor": "rgba(0, 0, 255, 0.4)", "rowHatchColor": "rgba(255, 255, 255, 0.4)", "columnHatchColor": "rgba(128, 128, 128, 0.4)", "areaBorderColor": "rgba(255, 0, 0, 0.4)" }, "isPrimaryGrid": true } ] }]);
	}
	test();
	</script>
	</body>
	</html>