fix(frontend): Correctly display small usage percentages

frontend/src/static/js/components/test/webstatus-feature-usage-chart-panel.test.ts

@@ -122,6 +122,36 @@ describe('WebstatusFeatureUsageChartPanel', () => {
       'Chrome: 0.0%',
     );
 
+    // Test value between 0.01% and 0.1%
+    const chromeTestDataPoint5: ChromeUsageStat = {
+      timestamp: '2024-01-01',
+      usage: 0.0009, // 0.09%
+    };
+    expect(chromeConfig.valueExtractor(chromeTestDataPoint5)).to.equal(0.09);
+    expect(chromeConfig.tooltipExtractor!(chromeTestDataPoint5)).to.equal(
+      'Chrome: 0.09%',
+    );
+
+    // Test value of 0.01%
+    const chromeTestDataPoint6: ChromeUsageStat = {
+      timestamp: '2024-01-01',
+      usage: 0.0001, // 0.01%
+    };
+    expect(chromeConfig.valueExtractor(chromeTestDataPoint6)).to.equal(0.01);
+    expect(chromeConfig.tooltipExtractor!(chromeTestDataPoint6)).to.equal(
+      'Chrome: 0.01%',
+    );
+
+    // Test value less than 0.01%
+    const chromeTestDataPoint7: ChromeUsageStat = {
+      timestamp: '2024-01-01',
+      usage: 0.00005, // 0.005%
+    };
+    expect(chromeConfig.valueExtractor(chromeTestDataPoint7)).to.equal(0.005);
+    expect(chromeConfig.tooltipExtractor!(chromeTestDataPoint7)).to.equal(
+      'Chrome: 0.005%',
+    );
+
     // Assert that there are no additional series configurations
     expect(additionalSeriesConfigs).to.be.undefined;
   });

frontend/src/static/js/components/webstatus-feature-usage-chart-panel.ts

@@ -43,14 +43,26 @@ export class WebstatusFeatureUsageChartPanel extends WebstatusLineChartPanel<Bro
     if (percentage >= 100) {
       return 100;
     }
-    // Round to one decimal place.
+    // If percentage is very small, pass it through without rounding.
+    if (percentage > 0 && percentage < 0.1) {
+      return percentage;
+    }
+    // Otherwise, round to one decimal place.
     return Math.round(percentage * 10) / 10;
   }
 
   private formatPercentageForDisplay(percentage: number): string {
     if (percentage === 100) {
       return '100';
     }
+    // For very small values, show the raw value.
+    if (percentage > 0 && percentage < 0.01) {
+      return String(percentage);
+    }
+    // For other small values, show 2 decimal places.
+    if (percentage > 0 && percentage < 0.1) {
+      return percentage.toFixed(2);
+    }
     return percentage.toFixed(1);
   }