Upload 7 files

Dockerfile

@@ -0,0 +1,51 @@
+FROM python:3.10-slim
+
+RUN apt-get update && apt-get install -y \
+    libnss3 \
+    libnspr4 \
+    libatk1.0-0 \
+    libatk-bridge2.0-0 \
+    libcups2 \
+    libatspi2.0-0 \
+    libxcomposite1 \
+    libxdamage1 \
+    libxrandr2 \
+    libgbm-dev \
+    libgtk-3-0 \
+    xdg-utils \
+    libasound2 \
+    mc \
+    && rm -rf /var/lib/apt/lists/*
+
+WORKDIR /code
+
+COPY ./requirements.txt /code/requirements.txt
+
+RUN pip install --no-cache-dir --upgrade -r /code/requirements.txt
+
+RUN pip install playwright
+RUN playwright install --with-deps
+
+
+RUN useradd -m -u 1000 user
+USER user
+
+ENV HOME=/home/user \
+	PATH=/home/user/.local/bin:$PATH \
+    PYTHONPATH=$HOME/app \
+	PYTHONUNBUFFERED=1 \
+	GRADIO_ALLOW_FLAGGING=never \
+	GRADIO_NUM_PORTS=1 \
+	GRADIO_SERVER_NAME=0.0.0.0 \
+	GRADIO_THEME=huggingface \
+	SYSTEM=spaces
+ 
+# Set the working directory to the user's home directory
+WORKDIR $HOME/app
+
+RUN playwright install firefox 
+
+# Copy the current directory contents into the container at $HOME/app setting the owner to the user
+COPY --chown=user . $HOME/app
+
+CMD ["python", "app.py"]

README.md

@@ -1,12 +1,13 @@
 ---
 title: Fake App Scraper
-emoji: 😻
-colorFrom: yellow
-colorTo: blue
+emoji: 📈
+colorFrom: green
+colorTo: pink
 sdk: docker
+app_file: app.py
 pinned: false
 license: mit
-short_description: use playwright to scrape a fake app
+short_description: uses playwright to scrape a fake app hosted on vercel
+tag: "mcp-server-track"
 ---
 
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

app.py

@@ -0,0 +1,90 @@
+import gradio as gr
+from scrape_fake_app import get_homework,get_timetable
+import subprocess
+import os
+from dotenv import load_dotenv
+
+if os.getenv('ENVIRONMENT')=="PROD":
+    print("installing playwright firefox")
+    subprocess.run(["playwright","install","firefox"])
+
+def fetch_homework(date:str='today') -> str:
+    """
+    description:
+        fetch the homeworks.
+    Args: 
+        date: any string, default "today"
+    Returns:
+        The string describing the homeworks    
+    """
+    return get_homework()
+
+
+def fetch_timetable(date:str='today') -> str:
+    """
+    description:
+        fetch the timetable
+    Args: 
+        date: any string, default "today"
+    Returns:
+        The string describing the timetable    
+    """
+    return get_timetable()
+
+
+title="<h2>Gradio MCP Hackathon: fake-app-scraper</h2>"
+description="""<div style="font-family: sans-serif; line-height: 1.6;">
+  <p>
+    This app uses Playwright to log in and scrape the content of the dashboard of the fake app
+    <a href="https://fake-app-omega.vercel.app" target="_blank">fake-app-omega.vercel.app</a>.
+  </p>    
+  <p>
+    The starting point was to provide an LLM-friendly, API-fied version of a real app that does not provide any API. Used as an MCP server, any user of the app could simply ask their AI assistant to fetch information from their dashboard.
+  </p>
+  <h3>Problem</h3>
+  <p>
+    When run locally, the app can take the credentials as environment variables to log into the user's dashboard. However, when hosted as a Hugging Face Space, I couldn't find a way to send the credentials securely—i.e., without explicitly providing them to the LLM.
+  </p>
+  <p>
+    In conclusion, as it stands, this app together with the fake Next.js app only serves demonstration or educational purposes and does not solve a real-life problem.
+  </p>
+  <p><strong>I’d be happy to get any suggestions on how to send credentials in the context of a Gradio HF Space–hosted app.</strong></p>
+</div>
+"""
+
+images="""<img src="gradio_api/file=login.png" alt="login" style="max-width: 35%; margin-right: 10px;" />
+        <img src="gradio_api/file=dashboard.png" alt="dashboard" style="max-width: 35%;" />
+"""
+
+with gr.Blocks() as demo:
+    
+        # Add title and markdown
+    with gr.Row():
+        gr.HTML(title)    
+    
+    with gr.Row():
+        with gr.Column():
+            homeworks_btn = gr.Button("Homeworks")
+            homeworks_output = gr.Textbox(label="Homeworks Result", lines=5)
+        
+        with gr.Column():
+            timetable_btn = gr.Button("Timetable")
+            timetable_output = gr.Textbox(label="Timetable Result", lines=5)
+    
+    with gr.Row():
+        date = gr.Textbox(label="date",visible=False)
+
+    with gr.Row():
+        gr.HTML(description)
+        gr.HTML(images)
+
+    homeworks_btn.click(fn=fetch_homework,
+                        inputs=[date],
+                        outputs=homeworks_output)
+
+
+    timetable_btn.click(fn=fetch_timetable,
+                        inputs=[date],
+                        outputs=timetable_output)
+
+demo.launch(mcp_server=True,allowed_paths=["/"])

requirements.txt

@@ -0,0 +1,4 @@
+gradio[mcp]
+python-dotenv
+# pytest-playwright
+# playwright

scrape_fake_app.py

@@ -0,0 +1,93 @@
+from playwright.sync_api import sync_playwright
+import os
+from dotenv import load_dotenv
+import json
+
+def load_credentials()-> dict:
+    load_dotenv()
+    URL = os.getenv('FAKE_APP_URL')
+    USERNAME = os.getenv('FAKE_APP_USERNAME')
+    PASSWORD = os.getenv('FAKE_APP_PASSWORD')
+    return (URL,USERNAME,PASSWORD)
+
+def extract_homework_text(page) -> str:
+    card = page.get_by_title("homework")
+    content = card.locator("[data-slot='card-content'] section > div").all()
+
+    output = ["Homework:\n"]
+    for section in content:
+        heading = section.locator("h3").inner_text()
+        output.append(heading)
+        items = section.locator("ul > li").all()
+        for item in items:
+            # Extract full inner text including formatting
+            inner = item.inner_text().strip()
+            output.append(f"  {inner}")
+        output.append("")  # Add a blank line between sections
+        
+    return "\n".join(output).strip()
+
+def extract_timetable_text(page):
+    card = page.get_by_title("timetable")
+    items = card.locator("[data-slot='card-content'] ul > li").all()
+
+    output = ["Timetable:\n"]
+    for item in items:
+        # Check if it's a plain text item like "Lunch break"
+        if item.locator("span").count() == 0:
+            output.append(item.inner_text().strip())
+        else:
+            parts = item.locator("span").all()
+            line = " ".join([part.inner_text().strip() for part in parts])
+            output.append(line)
+
+    return "\n".join(output).strip()
+
+
+# print(URL,USERNAME,PASSWORD)
+def get_homework() -> str:
+    try:
+        URL,USERNAME,PASSWORD=load_credentials()
+        
+        with sync_playwright() as playwright:
+            browser = playwright.firefox.launch(headless=True)
+            page = browser.new_page()
+            page.goto(URL,wait_until="domcontentloaded")
+            
+            page.get_by_role('textbox',name='username').fill(USERNAME)
+            page.get_by_role('textbox',name='password').fill(PASSWORD)
+            page.get_by_role('button',name='login').click()
+            page.wait_for_url("**/dashboard")
+            # page.wait_for_timeout(1000)         
+            homework = extract_homework_text(page)
+            browser.close()        
+        return homework
+    
+    except Exception as e:
+        return json.dumps(e)
+
+def get_timetable() -> str:
+    try:
+        URL,USERNAME,PASSWORD=load_credentials()
+        
+        with sync_playwright() as playwright:
+            browser = playwright.firefox.launch(headless=True)
+            page = browser.new_page()
+            page.goto(URL,wait_until="domcontentloaded")
+            
+            page.get_by_role('textbox',name='username').fill(USERNAME)
+            page.get_by_role('textbox',name='password').fill(PASSWORD)
+            page.get_by_role('button',name='login').click()
+            page.wait_for_url("**/dashboard")
+            # page.wait_for_timeout(1000)        
+            timetable = extract_timetable_text(page)
+            browser.close()
+        return timetable
+    
+    except Exception as e:
+        return json.dumps(e)
+
+if __name__=="__main__":
+    print(get_homework())
+    print()
+    print(get_timetable())