fix(feedback): Fix screenshot black bars in Safari (#11233)

Fixes issue where screenshotting in Safari results in black bars on the
right and bottom of the image.

Before:
<img width="1278" alt="image"
src="https://github.com/getsentry/sentry-javascript/assets/55311782/b2c174ad-8403-459a-b24b-7e055da3d657">

After:
<img width="1278" alt="image"
src="https://github.com/getsentry/sentry-javascript/assets/55311782/85fb850d-6c01-48cd-9fe0-21a860114b9d">

Relates to getsentry/sentry#63749

Author: c298lee

packages/feedback/src/screenshot/components/ScreenshotEditor.tsx

@@ -222,11 +222,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],
       ),

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