Demo Exploring Computer Tools Playwright

!pip install playwright python-dotenv --quiet
!playwright install --quiet

from dotenv import load_dotenv
load_dotenv()

import os
import asyncio
import openai
from IPython.display import Image, display

openai.api_key = os.environ.get("OPENAI_API_KEY")

async def browse_and_display_then_summarize(user_agent: str, url: str, viewport: dict):
    """
    Launch Playwright Chromium, visit `url` with provided `user_agent` and `viewport`,
    take a screenshot, scrape the first three paragraphs under #mw-content-text,
    and generate a GPT-4 summary of the scraped text.
    """
    from playwright.async_api import async_playwright

    async with async_playwright() as p:
        browser = await p.chromium.launch(headless=True)
        context = await browser.new_context(
            user_agent=user_agent,
            viewport=viewport,
        )

        page = await context.new_page()
        await page.goto(url, wait_until="domcontentloaded")

        # Capture and display screenshot in the notebook
        screenshot_bytes = await page.screenshot(type="png", full_page=True)
        display(Image(data=screenshot_bytes))

        # Scrape the first three paragraph elements from Wikipedia content
        paragraphs = await page.query_selector_all("#mw-content-text p")
        text_content = ""
        for tag in paragraphs[:3]:
            text = await tag.inner_text()
            text_content += text.strip() + "\n\n"

        # Close resources
        await context.close()
        await browser.close()

    # Print a snippet of the extracted text for verification
    print("\nExtracted Wikipedia Text (first 800 chars):\n")
    print(text_content[:800] + ("..." if len(text_content) > 800 else "") + "\n")

    # Ask GPT-4 to summarize the scraped text
    print("\nGPT-4 Summary:\n")
    response = openai.ChatCompletion.create(
        model="gpt-4",
        messages=[
            {"role": "system", "content": "You are a helpful assistant. Summarize the given Wikipedia text in plain English."},
            {"role": "user", "content": text_content},
        ],
        temperature=0.5,
    )

    # Extract and print the model's summary
    summary_text = response["choices"][0]["message"]["content"]
    print(summary_text)

    return summary_text

# Example iPhone-style user agent string and viewport
iphone_user_agent = (
    "Mozilla/5.0 (iPhone; CPU iPhone OS 15_0 like Mac OS X) "
    "AppleWebKit/605.1.15 (KHTML, like Gecko) "
    "Version/15.0 Mobile/15E148 Safari/604.1"
)

viewport = {"width": 375, "height": 812}

# Example URL: OpenAI Wikipedia page
url = "https://en.wikipedia.org/wiki/OpenAI"

# Run the async agent
asyncio.run(browse_and_display_then_summarize(iphone_user_agent, url, viewport))