From 7d35480152db0f5dab5aaf8a3e15706479792467 Mon Sep 17 00:00:00 2001 From: Catherine Lee <55311782+c298lee@users.noreply.github.com> Date: Thu, 13 Jun 2024 17:33:15 -0400 Subject: [PATCH 1/2] improve screenshot quality for retina displays --- .../src/screenshot/components/ScreenshotEditor.tsx | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/packages/feedback/src/screenshot/components/ScreenshotEditor.tsx b/packages/feedback/src/screenshot/components/ScreenshotEditor.tsx index 08bbdb780f45..5b65f7d43e2a 100644 --- a/packages/feedback/src/screenshot/components/ScreenshotEditor.tsx +++ b/packages/feedback/src/screenshot/components/ScreenshotEditor.tsx @@ -187,8 +187,8 @@ export function makeScreenshotEditorComponent({ imageBuffer, dialog, options }: const cutoutCanvas = DOCUMENT.createElement('canvas'); const imageBox = constructRect(getContainedSize(imageBuffer)); const croppingBox = constructRect(croppingRect); - cutoutCanvas.width = croppingBox.width; - cutoutCanvas.height = croppingBox.height; + cutoutCanvas.width = croppingBox.width * DPI; + cutoutCanvas.height = croppingBox.height * DPI; const cutoutCtx = cutoutCanvas.getContext('2d'); if (cutoutCtx && imageBuffer) { @@ -200,8 +200,8 @@ export function makeScreenshotEditorComponent({ imageBuffer, dialog, options }: (croppingBox.height / imageBox.height) * imageBuffer.height, 0, 0, - croppingBox.width, - croppingBox.height, + croppingBox.width * DPI, + croppingBox.height * DPI, ); } @@ -210,8 +210,8 @@ export function makeScreenshotEditorComponent({ imageBuffer, dialog, options }: ctx.clearRect(0, 0, imageBuffer.width, imageBuffer.height); imageBuffer.width = cutoutCanvas.width; imageBuffer.height = cutoutCanvas.height; - imageBuffer.style.width = `${cutoutCanvas.width}px`; - imageBuffer.style.height = `${cutoutCanvas.height}px`; + imageBuffer.style.width = `${croppingBox.width}px`; + imageBuffer.style.height = `${croppingBox.height}px`; ctx.drawImage(cutoutCanvas, 0, 0); resizeCropper(); } From bcb1ecfc455f1b175de16ed12e6749be1af2bbd4 Mon Sep 17 00:00:00 2001 From: Catherine Lee <55311782+c298lee@users.noreply.github.com> Date: Mon, 17 Jun 2024 11:17:43 -0400 Subject: [PATCH 2/2] Update packages/feedback/src/screenshot/components/ScreenshotEditor.tsx Co-authored-by: Billy Vong --- .../feedback/src/screenshot/components/ScreenshotEditor.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/feedback/src/screenshot/components/ScreenshotEditor.tsx b/packages/feedback/src/screenshot/components/ScreenshotEditor.tsx index 5b65f7d43e2a..155cfac8e527 100644 --- a/packages/feedback/src/screenshot/components/ScreenshotEditor.tsx +++ b/packages/feedback/src/screenshot/components/ScreenshotEditor.tsx @@ -200,8 +200,8 @@ export function makeScreenshotEditorComponent({ imageBuffer, dialog, options }: (croppingBox.height / imageBox.height) * imageBuffer.height, 0, 0, - croppingBox.width * DPI, - croppingBox.height * DPI, + cutoutCanvas.width, + cutoutCanvas.height, ); }