Skip to content

Commit 1ab85f0

Browse files
warmshaowarmshao
authored
Merge pull request #76 from vvincent1234/fix/update_readme
add keep browser open and docker setup to readme
2 parents 48659b4 + 1d8b29d commit 1ab85f0

File tree

1 file changed

+73
-110
lines changed

1 file changed

+73
-110
lines changed

‎README.md‎

Lines changed: 73 additions & 110 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,37 @@ We would like to officially thank [WarmShao](https://github.com/warmshao) for hi
2323

2424
## Installation Options
2525

26-
### Option 1: Docker Installation (Recommended)
26+
### Option 1: Local Installation
27+
28+
Read the [quickstart guide](https://docs.browser-use.com/quickstart#prepare-the-environment) or follow the steps below to get started.
29+
30+
> Python 3.11 or higher is required.
31+
32+
First, we recommend using [uv](https://docs.astral.sh/uv/) to setup the Python environment.
33+
34+
```bash
35+
uv venv --python 3.11
36+
```
37+
38+
and activate it with:
39+
40+
```bash
41+
source .venv/bin/activate
42+
```
43+
44+
Install the dependencies:
45+
46+
```bash
47+
uv pip install -r requirements.txt
48+
```
49+
50+
Then install playwright:
51+
52+
```bash
53+
playwright install
54+
```
55+
56+
### Option 2: Docker Installation
2757

2858
1. **Prerequisites:**
2959
- Docker and Docker Compose installed on your system
@@ -32,8 +62,8 @@ We would like to officially thank [WarmShao](https://github.com/warmshao) for hi
3262
2. **Setup:**
3363
```bash
3464
# Clone the repository
35-
git clone <repository-url>
36-
cd browser-use-webui
65+
git clone https://github.com/browser-use/web-ui.git
66+
cd web-ui
3767

3868
# Copy and configure environment variables
3969
cp .env.example .env
@@ -55,38 +85,47 @@ We would like to officially thank [WarmShao](https://github.com/warmshao) for hi
5585

5686
Default VNC password is "vncpassword". You can change it by setting the `VNC_PASSWORD` environment variable in your `.env` file.
5787

58-
### Option 2: Local Installation
59-
60-
Read the [quickstart guide](https://docs.browser-use.com/quickstart#prepare-the-environment) or follow the steps below to get started.
61-
62-
> Python 3.11 or higher is required.
63-
64-
First, we recommend using [uv](https://docs.astral.sh/uv/) to setup the Python environment.
65-
66-
```bash
67-
uv venv --python 3.11
68-
```
69-
70-
and activate it with:
71-
72-
```bash
73-
source .venv/bin/activate
74-
```
75-
76-
Install the dependencies:
77-
78-
```bash
79-
uv pip install -r requirements.txt
80-
```
81-
82-
Then install playwright:
83-
84-
```bash
85-
playwright install
86-
```
8788

8889
## Usage
8990

91+
### Local Setup
92+
1. Copy `.env.example` to `.env` and set your environment variables, including API keys for the LLM. `cp .env.example .env`
93+
2. **Run the WebUI:**
94+
```bash
95+
python webui.py --ip 127.0.0.1 --port 7788
96+
```
97+
4. WebUI options:
98+
- `--ip`: The IP address to bind the WebUI to. Default is `127.0.0.1`.
99+
- `--port`: The port to bind the WebUI to. Default is `7788`.
100+
- `--theme`: The theme for the user interface. Default is `Ocean`.
101+
- **Default**: The standard theme with a balanced design.
102+
- **Soft**: A gentle, muted color scheme for a relaxed viewing experience.
103+
- **Monochrome**: A grayscale theme with minimal color for simplicity and focus.
104+
- **Glass**: A sleek, semi-transparent design for a modern appearance.
105+
- **Origin**: A classic, retro-inspired theme for a nostalgic feel.
106+
- **Citrus**: A vibrant, citrus-inspired palette with bright and fresh colors.
107+
- **Ocean** (default): A blue, ocean-inspired theme providing a calming effect.
108+
- `--dark-mode`: Enables dark mode for the user interface.
109+
3. **Access the WebUI:** Open your web browser and navigate to `http://127.0.0.1:7788`.
110+
4. **Using Your Own Browser(Optional):**
111+
- Set `CHROME_PATH` to the executable path of your browser and `CHROME_USER_DATA` to the user data directory of your browser.
112+
- Windows
113+
```env
114+
CHROME_PATH="C:\Program Files\Google\Chrome\Application\chrome.exe"
115+
CHROME_USER_DATA="C:\Users\YourUsername\AppData\Local\Google\Chrome\User Data"
116+
```
117+
> Note: Replace `YourUsername` with your actual Windows username for Windows systems.
118+
- Mac
119+
```env
120+
CHROME_PATH="/Applications/Google Chrome.app/Contents/MacOS/Google Chrome"
121+
CHROME_USER_DATA="~/Library/Application Support/Google/Chrome/Profile 1"
122+
```
123+
- Close all Chrome windows
124+
- Open the WebUI in a non-Chrome browser, such as Firefox or Edge. This is important because the persistent browser context will use the Chrome data when running the agent.
125+
- Check the "Use Own Browser" option within the Browser Settings.
126+
5. **Keep Browser Open(Optional):**
127+
- Set `CHROME_PERSISTENT_SESSION=true` in the `.env` file.
128+
90129
### Docker Setup
91130
1. **Environment Variables:**
92131
- All configuration is done through the `.env` file
@@ -139,83 +178,7 @@ playwright install
139178
docker compose down
140179
```
141180

142-
### Local Setup
143-
1. **Run the WebUI:**
144-
```bash
145-
python webui.py --ip 127.0.0.1 --port 7788
146-
```
147-
2. **Access the WebUI:** Open your web browser and navigate to `http://127.0.0.1:7788`.
148-
3. **Using Your Own Browser:**
149-
- Close all chrome windows
150-
- Open the WebUI in a non-Chrome browser, such as Firefox or Edge. This is important because the persistent browser context will use the Chrome data when running the agent.
151-
- Check the "Use Own Browser" option within the Browser Settings.
152-
153-
### Options:
154-
155-
### `--theme`
156-
157-
- **Type**: `str`
158-
- **Default**: `Ocean`
159-
- **Description**: Specifies the theme for the user interface.
160-
- **Options**:
161-
The available themes are defined in the `theme_map` dictionary. Below are the options you can choose from:
162-
- **Default**: The standard theme with a balanced design.
163-
- **Soft**: A gentle, muted color scheme for a relaxed viewing experience.
164-
- **Monochrome**: A grayscale theme with minimal color for simplicity and focus.
165-
- **Glass**: A sleek, semi-transparent design for a modern appearance.
166-
- **Origin**: A classic, retro-inspired theme for a nostalgic feel.
167-
- **Citrus**: A vibrant, citrus-inspired palette with bright and fresh colors.
168-
- **Ocean** (default): A blue, ocean-inspired theme providing a calming effect.
169-
170-
**Example**:
171-
172-
```bash
173-
python webui.py --ip 127.0.0.1 --port 7788 --theme Glass
174-
```
175-
176-
### `--dark-mode`
177-
178-
- **Type**: `boolean`
179-
- **Default**: Disabled
180-
- **Description**: Enables dark mode for the user interface. This is a simple toggle; including the flag activates dark mode, while omitting it keeps the interface in light mode.
181-
- **Options**:
182-
- **Enabled (`--dark-mode`)**: Activates dark mode, switching the interface to a dark color scheme for better visibility in low-light environments.
183-
- **Disabled (default)**: Keeps the interface in the default light mode.
184-
185-
**Example**:
186-
187-
```bash
188-
python webui.py --ip 127.0.0.1 --port 7788 --dark-mode
189-
```
190-
191-
## (Optional) Configure Environment Variables
192-
193-
Copy `.env.example` to `.env` and set your environment variables, including API keys for the LLM. With
194-
195-
```bash
196-
cp .env.example .env
197-
```
198-
199-
**If using your own browser:** - Set `CHROME_PATH` to the executable path of your browser and `CHROME_USER_DATA` to the user data directory of your browser.
200-
201-
You can just copy examples down below to your `.env` file.
202-
203-
### Windows
204-
205-
```env
206-
CHROME_PATH="C:\Program Files\Google\Chrome\Application\chrome.exe"
207-
CHROME_USER_DATA="C:\Users\YourUsername\AppData\Local\Google\Chrome\User Data"
208-
```
209-
210-
> Note: Replace `YourUsername` with your actual Windows username for Windows systems.
211-
212-
### Mac
213-
214-
```env
215-
CHROME_PATH="/Applications/Google Chrome.app/Contents/MacOS/Google Chrome"
216-
CHROME_USER_DATA="~/Library/Application Support/Google/Chrome/Profile 1"
217-
```
218-
219181
## Changelog
220182

221-
- [x] **2025/01/06:** Thanks to @richard-devbot, a New and Well-Designed WebUI is released. [Video tutorial demo](https://github.com/warmshao/browser-use-webui/issues/1#issuecomment-2573393113).
183+
- [x] **2025/01/10:** Thanks to @casistack. Now we have Docker Setup option and also Support keep browser open between tasks.[Video tutorial demo](https://github.com/browser-use/web-ui/issues/1#issuecomment-2582511750).
184+
- [x] **2025/01/06:** Thanks to @richard-devbot. A New and Well-Designed WebUI is released. [Video tutorial demo](https://github.com/warmshao/browser-use-webui/issues/1#issuecomment-2573393113).

0 commit comments

Comments
 (0)