From 145956b464316821e7da0f3fd1ea22b56d3bb568 Mon Sep 17 00:00:00 2001
From: Catherine Lee <55311782+c298lee@users.noreply.github.com>
Date: Thu, 21 Mar 2024 16:23:13 -0400
Subject: [PATCH] fix black bars in safari

---
 .../src/screenshot/components/ScreenshotEditor.tsx        | 8 +++-----
 .../src/screenshot/components/useTakeScreenshot.tsx       | 4 ++--
 2 files changed, 5 insertions(+), 7 deletions(-)

diff --git a/packages/feedback/src/screenshot/components/ScreenshotEditor.tsx b/packages/feedback/src/screenshot/components/ScreenshotEditor.tsx
index e8f0feb32a02..826d7ecb1947 100644
--- a/packages/feedback/src/screenshot/components/ScreenshotEditor.tsx
+++ b/packages/feedback/src/screenshot/components/ScreenshotEditor.tsx
@@ -217,11 +217,9 @@ export function makeScreenshotEditorComponent({ h, imageBuffer, dialog }: Factor
           if (!context) {
             throw new Error('Could not get canvas context');
           }
-          const sourceWidth = imageSource.videoWidth;
-          const sourceHeight = imageSource.videoHeight;
-          imageBuffer.width = sourceWidth;
-          imageBuffer.height = sourceHeight;
-          context.drawImage(imageSource, 0, 0, sourceWidth, sourceHeight);
+          imageBuffer.width = imageSource.videoWidth;
+          imageBuffer.height = imageSource.videoHeight;
+          context.drawImage(imageSource, 0, 0);
         },
         [imageBuffer],
       ),
diff --git a/packages/feedback/src/screenshot/components/useTakeScreenshot.tsx b/packages/feedback/src/screenshot/components/useTakeScreenshot.tsx
index af59edfc9d42..bf50eab24283 100644
--- a/packages/feedback/src/screenshot/components/useTakeScreenshot.tsx
+++ b/packages/feedback/src/screenshot/components/useTakeScreenshot.tsx
@@ -16,8 +16,8 @@ export const useTakeScreenshot = ({ onBeforeScreenshot, onScreenshot, onAfterScr
       onBeforeScreenshot();
       const stream = await NAVIGATOR.mediaDevices.getDisplayMedia({
         video: {
-          width: WINDOW.innerWidth,
-          height: WINDOW.innerHeight,
+          width: WINDOW.innerWidth * WINDOW.devicePixelRatio,
+          height: WINDOW.innerHeight * WINDOW.devicePixelRatio,
         },
         audio: false,
         // @ts-expect-error experimental flags: https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getDisplayMedia#prefercurrenttab