Auto tunneling support doc

docs/smartui-layout-comparison.md

@@ -182,7 +182,7 @@ describe('Layout Structure Test', () => {
 
     // Configure options to focus only on layout structure
     let options = {
-      ignoreType: "layout"
+      ignoreType: ["layout"]
     };
 
     // Take screenshot with layout comparison

docs/smartui-sdk-tunnel.md

@@ -1,6 +1,6 @@
 ---
 id: smartui-sdk-tunnel
-title: Using LambdaTest Tunnel with SmartUI SDKs
+title: Using LambdaTest Tunnel with SmartUI SDK
 sidebar_label: Tunnel Configuration
 description: Learn how to use LambdaTest Tunnel with SmartUI SDK for testing internal, development, and staging environments
 keywords:
@@ -15,75 +15,148 @@ slug: smartui-sdk-tunnel/
 
 # Using LambdaTest Tunnel with SmartUI SDK
 
-LambdaTest Tunnel allows you to test your internal, development, or staging environments securely using SmartUI SDK. This guide explains how to configure and use LambdaTest Tunnel with SmartUI SDK.
+LambdaTest Tunnel enables secure testing of your local, development, or privately hosted environments using SmartUI SDK. This guide explains how to configure and use LambdaTest Tunnel with SmartUI SDK.
 
 :::warning Important
-Tunnel configuration is only supported with the `exec` mode of SmartUI SDK. It is not compatible with `capture`, `upload`, or `figma` commands. For more information about exec mode, refer to our [SmartUI CLI Exec documentation](/support/docs/smartui-cli-exec/).
+Tunnel configuration is only supported with the `exec` mode of SmartUI SDK. It is not compatible with 
+`capture`, `upload`, or `figma` commands. For more information about exec mode, refer to our [SmartUI CLI Exec 
+documentation](/support/docs/smartui-cli-exec/).
 :::
 
 ## Prerequisites
 
-1. The tunnel should be started by the same user who created the SmartUI project
-2. The tunnel must remain active throughout the entire SmartUI execution steps, from authentication to build completion
+- Working knowledge of npm CLI commands
+- Understanding of tunneling concepts for local testing
+- Valid LambdaTest credentials (username and access key)
+- Familiarity with SmartUI CLI configuration files
+- SmartUI CLI installed and configured
 
-## Configuration
+## Configuration Options
 
-To enable tunnel testing with SmartUI SDK, add the following configuration to your `.smartui.json` file:
+LambdaTest Tunnel supports two configuration modes:
+
+### 1. Automatic Tunnel Configuration
+
+For automatic tunnel setup, add the following configuration to your `.smartui.json` file:
 
 ```json
 {
-  "tunnel": true,
-  "tunnelName": "my-tunnel"
+  "tunnel": {
+    "type": "auto",
+    "user": "<lambdatest-user>",  // Optional: Overrides LT_USERNAME if present in env
+    "key": "<lambdatest-accesskey>",  // Optional: Overrides LT_ACCESS_KEY if present in env
+    "port": "<port>",  // Optional: Default port if not specified
+    "proxyHost": "127.0.0.1",  // Optional
+    "proxyPort": "8000",  // Optional
+    "proxyUser": "user",  // Optional: Proxy authentication
+    "proxyPass": "password",  // Optional: Proxy authentication
+    "dir": "<path-to-local-folder>",  // Optional: Directory to test
+    "v": true,  // Optional: Enable verbose logging
+    "logFile": "/path/to/logs.txt"  // Optional: Custom log file location
+  }
 }
 ```
 
-### Configuration Parameters
+### 2. Manual Tunnel Configuration
 
-- **tunnel**: Set to `true` to enable tunnel testing
-- **tunnelName**: Specify the name of your tunnel instance (must match the name used when starting the tunnel)
+For manual tunnel setup, add the following configuration:
 
-## Setting Up LambdaTest Tunnel
+```json
+{
+  "tunnel": {
+    "type": "manual",
+    "tunnelName": "my-tunnel-name"  // Required for manual mode 
+    //Add user and key in case LT_USERNAME and LT_ACCESSKEY not provided in env variables
+  }
+}
+```
 
-1. Download and install LambdaTest Tunnel by following the instructions in our [Tunnel documentation](/support/docs/advanced-tunnel-features/)
+:::note
+Configuration values take precedence over environment variables when both are present.
+:::
 
-2. Start the tunnel with a specific name:
-```bash
-./LT --user {user-name} --key {access-key} --tunnelName my-tunnel
-```
+## Environment Variables Support
 
-3. Wait for the "Tunnel is connected" message before running your SmartUI tests
+The tunnel configuration automatically uses the following environment variables if not specified in the config:
 
-:::warning Important
-- Ensure the tunnel remains active throughout your testing session
-- The tunnel name in your configuration must match the `tunnelName` used when starting the tunnel
-- Only the user who created the SmartUI project can start and use the tunnel for testing
-:::
+- `LT_USERNAME`: LambdaTest username
+- `LT_ACCESS_KEY`: LambdaTest access key
+
+## Example Configurations
+
+### Basic Automatic Setup
+```json
+{
+  "web": {
+    "browsers": ["chrome", "firefox"],
+    "viewports": [[1920, 1080], [1366, 768]]
+  },
+  "tunnel": {
+    "type": "auto"
+      //Add user and key in case LT_USERNAME and LT_ACCESSKEY not provided in env variables
 
-## Example Usage
+  }
+}
+```
 
-Here's a complete example of a SmartUI configuration file using tunnel:
+### Advanced Automatic Setup with Proxy
+```json
+{
+  "web": {
+    "browsers": ["chrome", "firefox"],
+    "viewports": [[1920, 1080], [1366, 768]]
+  },
+  "tunnel": {
+    "type": "auto",
+    "user": "<lambdatest-user>",  // Optional: Overrides LT_USERNAME if present in env
+    "key": "<lambdatest-accesskey>",  // Optional: Overrides LT_ACCESS_KEY if present in env
+    "proxyHost": "127.0.0.1",
+    "proxyPort": "8000",
+    "dir": "./src",
+    "v": true
+  }
+}
+```
 
+### Manual Tunnel Setup
 ```json
 {
   "web": {
     "browsers": ["chrome", "firefox"],
-    "viewports": [
-      [1920, 1080],
-      [1366, 768]
-    ]
+    "viewports": [[1920, 1080], [1366, 768]]
   },
-  "tunnel": true,
-  "tunnelName": "my-tunnel",
-  "waitForTimeout": 1000
+  "tunnel": {
+    "type": "manual",
+    "tunnelName": "my-tunnel",
+    "user": "<lambdatest-user>",  // Optional: Overrides LT_USERNAME if present in env
+    "key": "<lambdatest-accesskey>",  // Optional: Overrides LT_ACCESS_KEY if present in env
+  }
 }
 ```
 
-For more detailed information about LambdaTest Tunnel features and configurations, please refer to our [Advanced Tunnel Features documentation](/support/docs/advanced-tunnel-features/).
+
+## Best Practices
+
+1. **Automatic vs Manual Mode**
+   - Use automatic mode for simple setups and quick testing
+   - Use manual mode when you need more control over tunnel lifecycle
+
+2. **Credentials Management**
+   - Prefer environment variables for sensitive information
+   - Use config file for non-sensitive settings
+
+3. **Proxy Configuration**
+   - Specify proxy settings in config when using corporate networks
+   - Test proxy settings before running full test suite
+
+4. **Logging**
+   - Enable verbose logging (`"v": true`) for troubleshooting
+   - Specify custom log file location for persistent logs
+
+5. **Directory Testing**
+   - Always specify the directory to test when working with local files
+   - Ensure the directory path is accessible and contains the necessary files
 
 :::tip
-When testing with tunnel, make sure to:
-1. Start the tunnel before running your tests
-2. Use the correct tunnel name in your configuration
-3. Keep the tunnel running until all tests are complete
-4. Use the same user credentials for both tunnel and SmartUI project
+For more detailed information about LambdaTest Tunnel features and configurations, refer to our [Advanced Tunnel Features documentation](/support/docs/advanced-tunnel-features/).
 :::