OpenHands icon indicating copy to clipboard operation
OpenHands copied to clipboard

Add playwright to show the browse screenshoot on frontend UI

Open universea opened this issue 1 year ago • 3 comments

Add Playwright Integration for Enhanced Web Scraping and Screenshot Capture

Description: This Pull Request introduces significant improvements to OpenDevin's web scraping capabilities by integrating Playwright. The key motivation behind this change is to replace the existing request-based approach, which is limited to fetching HTML content without rendering JavaScript. Playwright allows us to execute and render JavaScript, enabling a more comprehensive web scraping experience that mirrors actual browser behavior.

Key Changes: Playwright Integration: Implemented Playwright for web navigation and interaction, enabling dynamic content rendering which was not possible with the request library. Screenshot Capture: Added functionality to capture and display webpage screenshots in the UI. This feature is particularly useful for visual verification and debugging of scraped web pages. Code Refactoring: Refactored browse.py to utilize Playwright, enhancing its capabilities to interact with web elements and execute JS code within the context of the page. UI Updates: Modified Browser.tsx component to display the captured screenshots, improving the overall user experience by providing visual feedback of the scraping results.

bdee6426ee59d761370030ac65c8388 12e57b084a5fb3ab29be5f92a616d35

universea avatar Mar 30 '24 21:03 universea

This is awesome!

Only concern is that, as it is today, we'll start passing the b64 code to the LLMs, which will make its responses worse and more expensive.

To fix that, can you add if "screenshot" in event: del event['screenshot'] to:

rbren avatar Mar 30 '24 23:03 rbren

This is awesome!

Only concern is that, as it is today, we'll start passing the b64 code to the LLMs, which will make its responses worse and more expensive.

To fix that, can you add if "screenshot" in event: del event['screenshot'] to:

Many thanks! I was wondering why my OpenAI API usage ran out today; I've fixed the issue now.

universea avatar Mar 31 '24 03:03 universea

I tested it and successfully displayed the browser screenshot.

sssuperindex avatar Apr 01 '24 22:04 sssuperindex

Looking good! If you fix the conflicts we can get this in

rbren avatar Apr 02 '24 03:04 rbren

Looking good! If you fix the conflicts we can get this in

Sorry, I made a mistake in the operation, can I revert it?

universea avatar Apr 02 '24 04:04 universea