Fix bandwidth chart growing infinitely

Use container.clientWidth/clientHeight instead of getBoundingClientRect
and stop overriding canvas style dimensions. CSS 100% handles display
sizing, canvas.width/height handles DPR-scaled render resolution.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Sucukdeluxe 2026-03-02 19:04:06 +01:00
parent 3c510fc265
commit ba673b9e53
2 changed files with 6 additions and 10 deletions

View File

@ -1,6 +1,6 @@
{ {
"name": "real-debrid-downloader", "name": "real-debrid-downloader",
"version": "1.4.99", "version": "1.5.0",
"description": "Real-Debrid Downloader Desktop (Electron + React + TypeScript)", "description": "Real-Debrid Downloader Desktop (Electron + React + TypeScript)",
"main": "build/main/main/main.js", "main": "build/main/main/main.js",
"author": "Sucukdeluxe", "author": "Sucukdeluxe",

View File

@ -155,17 +155,13 @@ const BandwidthChart = memo(function BandwidthChart({ items, running, paused }:
if (!ctx) return; if (!ctx) return;
const dpr = window.devicePixelRatio || 1; const dpr = window.devicePixelRatio || 1;
const rect = container.getBoundingClientRect(); const width = container.clientWidth;
if (rect.width <= 0 || rect.height <= 0) return; const height = container.clientHeight;
if (width <= 0 || height <= 0) return;
canvas.width = rect.width * dpr; canvas.width = width * dpr;
canvas.height = rect.height * dpr; canvas.height = height * dpr;
canvas.style.width = `${rect.width}px`;
canvas.style.height = `${rect.height}px`;
ctx.scale(dpr, dpr); ctx.scale(dpr, dpr);
const width = rect.width;
const height = rect.height;
const padding = { top: 20, right: 20, bottom: 30, left: 60 }; const padding = { top: 20, right: 20, bottom: 30, left: 60 };
const chartWidth = width - padding.left - padding.right; const chartWidth = width - padding.left - padding.right;
const chartHeight = height - padding.top - padding.bottom; const chartHeight = height - padding.top - padding.bottom;