fix(browserbase): install DejaVu Sans so overlay text renders in production (#2659)

The node:*-slim base images ship with zero fonts installed, so
librsvg falls back to .notdef glyphs and the overlay rendered as
□ □ □ boxes in production. Install fontconfig + fonts-dejavu-core
in both Dockerfiles and use "DejaVu Sans" explicitly in the SVG.

Co-authored-by: Mariano <marfuen98@gmail.com>
Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

Author: 3 people

apps/api/Dockerfile

@@ -1,8 +1,13 @@
 # Use Node.js runtime for production
 FROM node:20-slim
 
-# Install required packages (wget for healthcheck, curl/bash for bun install, libc compat for prisma)
-RUN apt-get update && apt-get install -y --no-install-recommends wget curl openssl && rm -rf /var/lib/apt/lists/*
+# Install required packages:
+# - wget for healthcheck, curl/bash for bun install, openssl for prisma
+# - fontconfig + fonts-dejavu-core so sharp/librsvg can render text in the
+#   browser-automation screenshot overlay (node:*-slim ships with zero fonts)
+RUN apt-get update && apt-get install -y --no-install-recommends \
+    wget curl openssl fontconfig fonts-dejavu-core \
+  && rm -rf /var/lib/apt/lists/*
 
 WORKDIR /app
 

apps/api/Dockerfile.multistage

@@ -84,8 +84,11 @@ RUN groupadd --system nestjs && useradd --system --gid nestjs --create-home nest
 WORKDIR /app
 RUN chown nestjs:nestjs /app
 
-# Install runtime dependencies + AWS RDS CA certificate bundle
-RUN apt-get update && apt-get install -y --no-install-recommends wget ca-certificates \
+# Install runtime dependencies + AWS RDS CA certificate bundle.
+# fontconfig + fonts-dejavu-core are needed so sharp/librsvg can render text
+# in the browser-automation screenshot overlay (node:*-slim has no fonts).
+RUN apt-get update && apt-get install -y --no-install-recommends \
+    wget ca-certificates fontconfig fonts-dejavu-core \
   && wget -q -O /usr/local/share/aws-rds-ca-bundle.pem https://truststore.pki.rds.amazonaws.com/global/global-bundle.pem \
   && apt-get clean && rm -rf /var/lib/apt/lists/*
 

apps/api/src/browserbase/screenshot-overlay.ts

@@ -115,8 +115,10 @@ function buildBannerSvg(args: BannerArgs): string {
   const { width, height, instruction, sourceUrl, timestamp } = args;
   const rowFontSize = 12;
   const labelFontSize = 9;
-  const fontFamily =
-    '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif';
+  // Explicit Linux-safe font stack. The production container only ships
+  // DejaVu Sans (via fonts-dejavu-core); Apple/Segoe/Roboto aren't available
+  // so librsvg would render .notdef glyphs ("□ □ □") on servers.
+  const fontFamily = '"DejaVu Sans", sans-serif';
 
   const w = Math.floor(width);
   const h = Math.floor(height);