Adding Remote MCP setup instructions with screenshots

Author: pushkarbw

README.md

@@ -189,6 +189,10 @@ Generate test cases from PRDs, convert manual tests to low-code automation, and
      }
    }
    ```
+   - To setup Remote BrowserStack MCP instead of local BrowserStack MCP you can add the following JSON content instead :
+     <div align="center">
+     <img src="assets/remotemcp_json_file.png" alt="Remote MCP JSON file" height="100" width="100">
+     </div>
 
    - In VSCode, make sure to click on `Start` button in the MCP Server to start the server.
      ![Start MCP Server](assets/vscode_install.png)
@@ -456,7 +460,57 @@ As of now we support 20 tools.
   ```text
   Upload PRD from /Users/xyz/Desktop/login-flow.pdf and use BrowserStack AI to generate test cases
   ```
+##  Remote MCP Setup
 
+   - VSCode (Copilot - Agent Mode): `.vscode/mcp.json`:
+    
+      - Locate or Create the Configuration File:
+      - In the root directory of your project, look for a folder named .vscode. This folder is usually hidden so you will need to find it as            mentioned in the expand.
+      - If this folder doesn't exist, create it.
+      - Inside the .vscode folder, create a new file named mcp.json
+      - To setup Remote BrowserStack MCP instead of local BrowserStack MCP you can add the following JSON content :
+         <div align="center">
+         <img src="assets/remotemcp_json_file.png" alt="Remote MCP JSON file" height="100" width="100">
+         </div>
+         
+### Alternative way to Setup Remote MCP
+      -  Step 1.Click on the gear icon to Select Tools
+          <div align="center">
+          <img src="assets/select_tools.png" alt="Select Tools" height="100"> 
+          </div>
+          
+      -  Step 2. A tool menu would appear at the top-centre, scroll down on the menu at the top and then Click on Add MCP Server
+        <div align="center">
+        <img src="assets/add_mcp_server.png" alt="Add MCP Server" height="100"> 
+        </div>
+
+      - Step 3. Click on HTTP option
+         <div align="center">
+         <img src="assets/http_option.png" alt="HTTP Option" height="100" width="100">
+         </div>
+         
+      - Step 4. Paste Remote MCP Server URL
+         <div align="center">
+         <img src="assets/server_url.png" alt="Remote MCP Server URL" height="100" width="100">
+         </div>
+         
+      - Step 5. Give server id as browserstack
+          <div align="center">
+          <img src="assets/server_id.png" alt="Remote MCP Server ID" height="100" width="100">
+          </div>
+          
+      - Step 6. In VSCode Click on start MCP Server and then click on "Allow"
+          <div align="center">
+          <img src="assets/authentication1.png" alt="authentication1" height="100" width="100">
+          </div>
+          <div align="center">
+          <img src="assets/authentication2.png" alt="authentication2" height="100" width="100">
+          </div>
+          <div align="center">
+          <img src="assets/signin_success.png" alt="Sign_in_success" height="100" width="100">
+          </div>
+
+     
 
 ## 🤝 Recommended MCP Clients