update

Dockerfile

@@ -43,17 +43,28 @@ RUN poetry config virtualenvs.create false \
 RUN mkdir -p static templates screenshots /home/user/.cache && \
     chown -R user:user /app /home/user/.cache
 
-# Set HOME for the following Playwright install step
+# Set HOME for the browser
 ENV HOME=/home/user \
     PYTHONPATH=/app
 
-# Switch to non-root user for browser installation
-USER user
-
-# Install Playwright browsers under the non-root user HOME directory
-RUN playwright install chromium
-
-# Switch back to root to copy files
+# Install additional Chrome dependencies
+RUN apt-get update && apt-get install -y \
+    fonts-noto-color-emoji \
+    fonts-freefont-ttf \
+    libharfbuzz-icu0 \
+    # Chrome dependencies 
+    libglib2.0-0 \
+    unzip \
+    xvfb
+
+# Install Chrome - required for Helium
+RUN wget -q -O - https://dl-ssl.google.com/linux/linux_signing_key.pub | apt-key add - \
+    && echo "deb [arch=amd64] http://dl.google.com/linux/chrome/deb/ stable main" >> /etc/apt/sources.list.d/google.list \
+    && apt-get update \
+    && apt-get install -y google-chrome-stable \
+    && rm -rf /var/lib/apt/lists/*
+
+# Switch to non-root user to copy files
 USER root
 
 # Copy application code
@@ -61,9 +72,6 @@ COPY app /app/app
 COPY templates /app/templates
 COPY static /app/static
 
-# Install system dependencies for Playwright
-RUN apt-get update && apt-get install -y fonts-noto-color-emoji fonts-freefont-ttf libharfbuzz-icu0
-
 # Make sure all files are owned by user
 RUN chown -R user:user /app
 
@@ -78,4 +86,4 @@ USER user
 EXPOSE 7860
 
 # Start command
-CMD ["uvicorn", "app.server:app", "--host", "0.0.0.0", "--port", "7860"] 
+CMD ["uvicorn", "app.server:app", "--host", "0.0.0.0", "--port", "7860"]

README.md

@@ -8,72 +8,72 @@ app_file: app/server.py
 pinned: false
 ---
 
-# Minimal Browser Screenshot Experiment
+# Minimal Browser Screenshot Experiment avec Helium
 
-This web application allows taking screenshots of websites using a headless browser and displaying them directly in the user interface.
+Cette application web permet de prendre des captures d'écran de sites web en utilisant un navigateur headless et de les afficher directement dans l'interface utilisateur.
 
-## Features
+## Fonctionnalités
 
-- Simple and responsive web interface
-- URL input with default value pointing to Open LLM Leaderboard
-- Screenshot capture via Playwright (Chromium browser)
-- Display of results in the interface
+- Interface web simple et responsive
+- Saisie d'URL avec valeur par défaut pointant vers Open LLM Leaderboard
+- Capture d'écran via Helium (navigateur Chrome)
+- Affichage des résultats dans l'interface
 
-## Technologies Used
+## Technologies utilisées
 
-- **Backend**: FastAPI, Playwright
-- **Frontend**: HTML/JS with Tailwind CSS
-- **Dependency Management**: Poetry
-- **Deployment**: Docker, Hugging Face Spaces
+- **Backend**: FastAPI, Helium
+- **Frontend**: HTML/JS avec Tailwind CSS
+- **Gestion des dépendances**: Poetry
+- **Déploiement**: Docker, Hugging Face Spaces
 
-## Local Installation
+## Installation locale
 
-### Prerequisites
+### Prérequis
 
 - Python 3.10+
 - Poetry
-- Docker (optional)
+- Docker (optionnel)
 
-### Installation with Poetry
+### Installation avec Poetry
 
 ```bash
-# Clone the repository
+# Cloner le dépôt
 git clone [repo-url]
 cd minimal-browser-screenshot-experiment
 
-# Install dependencies
+# Installer les dépendances
 poetry install
 
-# Install Playwright browsers
-poetry run playwright install chromium
-poetry run playwright install-deps chromium
-
-# Launch the application
+# Lancer l'application
 poetry run uvicorn app.server:app --host 0.0.0.0 --port 7860
 ```
 
-### Using Docker
+### Utilisation de Docker
 
 ```bash
-# Build the Docker image
+# Construire l'image Docker
 docker build -t minimal-browser-screenshot .
 
-# Run the container
+# Lancer le conteneur
 docker run -p 7860:7860 minimal-browser-screenshot
 ```
 
-## Deployment on Hugging Face Spaces
+## Déploiement sur Hugging Face Spaces
+
+Cette application est conçue pour être facilement déployée sur un Hugging Face Space.
+
+1. Créer un nouveau Space de type Docker
+2. Associer ce dépôt GitHub à votre Space
+3. Le Space utilisera automatiquement le Dockerfile fourni pour construire et déployer l'application
 
-This application is designed to be easily deployed on a Hugging Face Space.
+## Utilisation
 
-1. Create a new Docker-type Space
-2. Associate this GitHub repository with your Space
-3. The Space will automatically use the provided Dockerfile to build and deploy the application
+1. Accéder à l'application via votre navigateur
+2. Saisir l'URL du site dont vous souhaitez prendre une capture d'écran (par défaut: Open LLM Leaderboard)
+3. Cliquer sur "Take a screenshot"
+4. Attendre quelques secondes que le navigateur headless charge la page et prenne la capture d'écran
+5. La capture d'écran apparaît dans l'interface
 
-## Usage
+## À propos d'Helium
 
-1. Access the application through your browser
-2. Enter the URL of the site you want to screenshot (default: Open LLM Leaderboard)
-3. Click "Take a screenshot"
-4. Wait a few seconds for the headless browser to load the page and take the screenshot
-5. The screenshot appears in the interface
+Helium est une bibliothèque Python qui simplifie l'automatisation des navigateurs. C'est une couche d'abstraction au-dessus de Selenium qui offre une API plus simple et plus intuitive. Helium a été choisi pour remplacer Playwright dans ce projet pour démontrer sa facilité d'utilisation.

app/server.py

@@ -4,7 +4,7 @@ from fastapi import FastAPI, Request, Form
 from fastapi.responses import HTMLResponse, JSONResponse, FileResponse
 from fastapi.staticfiles import StaticFiles
 from fastapi.templating import Jinja2Templates
-from playwright.async_api import async_playwright
+from helium import start_chrome, kill_browser, screenshot
 import uuid
 import logging
 import pathlib
@@ -46,43 +46,39 @@ async def take_screenshot(url: str = Form(...)):
         filename = f"{uuid.uuid4()}.png"
         filepath = str(screenshots_path / filename)
         
-        # Log browser executable paths
+        # Log environment info
         logger.info(f"HOME env: {os.environ.get('HOME')}")
         logger.info(f"Current working directory: {os.getcwd()}")
         
-        # Take the screenshot with Playwright
-        async with async_playwright() as p:
-            # Configuration adapted for Docker environment
-            browser = await p.chromium.launch(
-                headless=True,
-                args=[
-                    '--no-sandbox',
-                    '--disable-setuid-sandbox',
-                    '--disable-dev-shm-usage',
-                    '--disable-accelerated-2d-canvas',
-                    '--no-first-run',
-                    '--no-zygote',
-                    '--single-process',
-                    '--disable-gpu'
-                ],
-                executable_path=None  # Use default path
-            )
-            
-            logger.info("Browser launched successfully")
-            page = await browser.new_page(viewport={"width": 1280, "height": 720})
-            
-            try:
-                logger.info(f"Navigating to URL: {url}")
-                await page.goto(url, wait_until="networkidle", timeout=60000)
-                logger.info("Navigation complete, taking screenshot")
-                await page.screenshot(path=filepath)
-                logger.info(f"Screenshot saved to {filepath}")
-            except Exception as e:
-                logger.error(f"Error during page navigation or screenshot: {str(e)}")
-                raise
-            finally:
-                await browser.close()
-                logger.info("Browser closed")
+        # Configuration for Docker environment
+        chrome_options = {
+            "headless": True,
+            "options": [
+                '--no-sandbox',
+                '--disable-setuid-sandbox',
+                '--disable-dev-shm-usage',
+                '--disable-accelerated-2d-canvas',
+                '--no-first-run',
+                '--no-zygote',
+                '--single-process',
+                '--disable-gpu'
+            ]
+        }
+        
+        # Take the screenshot with Helium
+        logger.info("Launching Chrome browser")
+        driver = start_chrome(url, **chrome_options)
+        
+        logger.info("Browser launched successfully")
+        
+        try:
+            logger.info(f"Taking screenshot at {filepath}")
+            screenshot(filepath)
+            logger.info(f"Screenshot saved to {filepath}")
+        finally:
+            # Always kill the browser to free resources
+            kill_browser()
+            logger.info("Browser closed")
         
         return JSONResponse({
             "success": True,

pyproject.toml

@@ -11,7 +11,7 @@ fastapi = "^0.103.1"
 uvicorn = "^0.23.2"
 jinja2 = "^3.1.2"
 python-multipart = "^0.0.6"
-playwright = "^1.39.0"
+helium = "^3.2.7"
 aiofiles = "^23.2.1"
 
 [build-system]