Practical Examples
Real-world automation workflows and use cases for Record Flow
Example 1: Login Automation
Automate logging into a web application with credential validation.
Setup
Create Global Variables:
username: your.email@example.com password: your_password (mark as secret) appUrl: https://app.example.com
Flow Actions
- 1. Navigate to Login Page
Action: Navigate URL: {{appUrl}}/login - 2. Fill Username
Action: Input Text Selector: #email Text: {{username}} - 3. Fill Password
Action: Input Text Selector: #password Text: {{password}} - 4. Click Login Button
Action: Click Selector: button[type="submit"]
- 5. Wait for Dashboard
Action: Wait Mode: element_visible Selector: .dashboard-header
- 6. Verify Success
Action: Assert Operation: url_contains Value: /dashboard
- 7. Take Screenshot
Action: Screenshot Type: Full Page
Example 2: Contact Form Testing
Test a contact form with multiple field types and validation.
Flow Actions
- 1. Navigate to Form
Action: Navigate URL: https://example.com/contact
- 2. Fill Name Field
Action: Input Text Selector: input[name="name"] Text: John Doe
- 3. Fill Email Field
Action: Input Text Selector: input[name="email"] Text: john@example.com
- 4. Select Subject Dropdown
Action: Select Dropdown Selector: select[name="subject"] Value: Technical Support
- 5. Fill Message Textarea
Action: Input Text Selector: textarea[name="message"] Text: This is a test message from Record Flow automation.
- 6. Check Agreement Checkbox
Action: Checkbox Selector: input[name="agree"] Operation: check
- 7. Submit Form
Action: Click Selector: button[type="submit"]
- 8. Wait for Success Message
Action: Wait Mode: element_visible Selector: .success-message
- 9. Verify Success Text
Action: Assert Operation: contains Selector: .success-message Value: Thank you for your message
Example 3: Product Data Scraping
Extract product information from an e-commerce page.
Flow Actions
- 1. Navigate to Product Page
Action: Navigate URL: https://shop.example.com/products/laptop
- 2. Wait for Product to Load
Action: Wait Mode: element_visible Selector: .product-title
- 3. Extract Product Title
Action: Get Element Text Selector: .product-title Variable Name: productTitle
- 4. Extract Product Price
Action: Get Element Text Selector: .product-price Variable Name: productPrice
- 5. Extract Product Description
Action: Get Element Text Selector: .product-description Variable Name: productDescription
- 6. Extract Image URL
Action: Get Element Attribute Selector: .product-image img Attribute: src Variable Name: imageUrl
- 7. Extract Stock Status
Action: Get Element Text Selector: .stock-status Variable Name: stockStatus
- 8. Verify Data Extracted
Action: Assert Operation: visible Selector: .product-title
- 9. Take Screenshot of Product
Action: Screenshot Type: Full Page
Result Variables
After execution, these runtime variables will contain:
{{productTitle}} = "15-inch Laptop Pro"
{{productPrice}} = "$1,299.99"
{{productDescription}} = "High-performance laptop..."
{{imageUrl}} = "https://shop.example.com/images/laptop.jpg"
{{stockStatus}} = "In Stock" Example 4: E-commerce Checkout Flow
Automate adding products to cart and completing checkout process.
Setup Variables
storeUrl: https://shop.example.com testCardNumber: 4242424242424242 testCVV: 123
Flow Actions
- 1. Go to Product Page
Action: Navigate URL: {{storeUrl}}/products/widget - 2. Click Add to Cart
Action: Click Selector: button.add-to-cart
- 3. Wait for Cart Update
Action: Wait Mode: timeout Value: 2000
- 4. Go to Cart
Action: Click Selector: a.cart-link
- 5. Verify Product in Cart
Action: Assert Operation: visible Selector: .cart-item
- 6. Proceed to Checkout
Action: Click Selector: button.checkout
- 7. Fill Shipping Information
Multiple Input Text actions for: - Name, Email, Address, City, Zip Code
- 8. Continue to Payment
Action: Click Selector: button.continue-to-payment
- 9. Fill Card Details (Test Mode)
Action: Input Text Selector: input[name="cardNumber"] Text: {{testCardNumber}} - 10. Take Screenshot Before Submit
Action: Screenshot Type: Full Page
Important Note
This example uses test credit card numbers. Always use test/sandbox environments for checkout automation. Never use real payment information in automated tests.
Example 5: Multi-Tab Data Comparison
Compare data across multiple tabs.
Flow Actions
- 1. Open First Page
Action: Navigate URL: https://site1.example.com/data
- 2. Extract Data from First Page
Action: Get Element Text Selector: .data-value Variable Name: site1Value
- 3. Open New Tab
Action: Open New Tab URL: https://site2.example.com/data
- 4. Switch to New Tab
Action: Switch to Tab Tab Index: 1
- 5. Extract Data from Second Page
Action: Get Element Text Selector: .data-value Variable Name: site2Value
- 6. Compare Values
Action: Assert Operation: equals Value: {{site1Value}} should equal {{site2Value}} - 7. Switch Back to First Tab
Action: Switch to Tab Tab Index: 0
- 8. Close Second Tab
Action: Switch to Tab (1) Action: Close Tab
Example 6: Working with iFrames
Interact with content inside iframes.
Flow Actions
- 1. Navigate to Page with iframe
Action: Navigate URL: https://example.com/page-with-iframe
- 2. Switch to iframe Context
Action: Switch to Frame Selector: iframe#payment-frame
- 3. Interact with iframe Content
Action: Input Text Selector: #card-number Text: 4242424242424242
- 4. Click Button Inside iframe
Action: Click Selector: button.submit-payment
- 5. Switch Back to Main Frame
Action: Switch to Main Frame
- 6. Verify Success on Main Page
Action: Assert Operation: visible Selector: .success-message
Example 7: Responsive Design Testing
Test how a website looks on different screen sizes.
Flow Actions
- 1. Navigate to Website
Action: Navigate URL: https://example.com
- 2. Test Desktop View
Action: Set Viewport Width: 1920 Height: 1080
- 3. Screenshot Desktop
Action: Screenshot Type: Full Page
- 4. Test Tablet View
Action: Set Viewport Width: 768 Height: 1024
- 5. Screenshot Tablet
Action: Screenshot Type: Full Page
- 6. Test Mobile View
Action: Set Viewport Width: 375 Height: 667
- 7. Screenshot Mobile
Action: Screenshot Type: Full Page
- 8. Verify Mobile Menu Visible
Action: Assert Operation: visible Selector: .mobile-menu-button
Tips for Creating Effective Flows
Best Practices
- Add Wait Actions: Use waits between actions to ensure page elements are ready
- Use Assertions: Verify expected outcomes at key steps
- Take Screenshots: Capture evidence at important points
- Use Variables: Make flows reusable across environments
- Test Incrementally: Build and test one action at a time
Common Patterns
- Login → Action → Logout: Standard authenticated flow pattern
- Navigate → Wait → Extract → Verify: Data scraping pattern
- Fill Form → Submit → Verify Success: Form testing pattern
- Multiple viewports → Screenshot each: Responsive testing pattern