diff --git a/src/css-raw/perf-cascade.css b/src/css-raw/perf-cascade.css index 29dc153a..729f4288 100755 --- a/src/css-raw/perf-cascade.css +++ b/src/css-raw/perf-cascade.css @@ -166,9 +166,9 @@ .info-overlay-holder button:hover {border-color: rgba(255,255,255, 0.6);} .info-overlay-holder button.active {border-color: #fff; cursor: default;} .info-overlay-holder button.active:focus {border-color: rgba(255,255,255, 0.8);} -.info-overlay-holder button.copy-raw-data {position: absolute; top:0.5em; right: 0.5em; border: 0; margin: 0; border-radius: 1em; background: #e0e0e0;} -.info-overlay-holder button.copy-raw-data:focus, -.info-overlay-holder button.copy-raw-data:hover { background: #ccc; } +.info-overlay-holder button.copy-tab-data {position: absolute; top:0.5em; right: 0.5em; border: 0; margin: 0; border-radius: 1em; background: #e0e0e0;} +.info-overlay-holder button.copy-tab-data:focus, +.info-overlay-holder button.copy-tab-data:hover { background: #ccc; } /* Info overlay HTML - content */ .info-overlay-holder dt {float: left; clear: both; margin-top: 0.5em; width: 25%; text-align: right; font-weight: bold; } diff --git a/src/ts/transformers/har-tabs.ts b/src/ts/transformers/har-tabs.ts index 440943e7..2d733cbb 100644 --- a/src/ts/transformers/har-tabs.ts +++ b/src/ts/transformers/har-tabs.ts @@ -132,7 +132,10 @@ function makeContentTab(entry: Entry) { const lineCount = newLines ? newLines.length : 1; return makeLazyWaterfallEntryTab( `Content (${lineCount} Line${lineCount > 1 ? "s" : ""})`, - () => `
${escapeHtml(unescapedText)}
`,
+ () => `
+
+ ${escapeHtml(unescapedText)}
+ `,
"content rendered-data",
);
}
@@ -143,7 +146,7 @@ function makeRawData(entry: Entry) {
() => {
// class `copy` needed to catch bubbled up click event in `details-overlay/html-details-body.ts`
return `
-
+
${escapeHtml(JSON.stringify(entry, null, 2))}
`;
},
diff --git a/src/ts/waterfall/details-overlay/svg-details-overlay.ts b/src/ts/waterfall/details-overlay/svg-details-overlay.ts
index bcc7d8af..cb4507e3 100644
--- a/src/ts/waterfall/details-overlay/svg-details-overlay.ts
+++ b/src/ts/waterfall/details-overlay/svg-details-overlay.ts
@@ -40,10 +40,10 @@ function createHolder(y: number, detailsHeight: number) {
return holder;
}
-/** Shared function to copy raw data */
-const onRawDataCopyClick = (event: MouseEvent) => {
+/** Shared function to copy the tabs data */
+const onTabDataCopyClick = (event: MouseEvent) => {
const btn = event.target as HTMLButtonElement;
- if (btn.tagName.toLowerCase() === "button" && btn.classList.contains("copy-raw-data")) {
+ if (btn.tagName.toLowerCase() === "button" && btn.classList.contains("copy-tab-data")) {
const el = document.createElement("textarea");
el.value = btn.nextElementSibling ? (btn.nextElementSibling as HTMLElement).innerText : "";
document.body.appendChild(el);
@@ -69,9 +69,9 @@ export function createRowInfoOverlay(overlay: OpenOverlay, y: number, detailsHei
const closeBtn = createCloseButtonSvg(y);
closeBtn.addEventListener("click", () => {
overlay.onClose(overlay.index);
- body.removeEventListener("click", onRawDataCopyClick);
+ body.removeEventListener("click", onTabDataCopyClick);
});
- body.addEventListener("click", onRawDataCopyClick);
+ body.addEventListener("click", onTabDataCopyClick);
// need to re-fetch the elements to fix Edge "Invalid Calling Object" bug
const getButtons = () => body.getElementsByClassName("tab-button") as NodeListOf