DEV Community

Nathan Araújo
Nathan Araújo

Posted on

Exploring Azure Functions for Synthetic Monitoring with Playwright: A Complete Guide - Part 3

Running Synthetic Monitoring with Azurite and Local Testing

Developing and testing synthetic monitoring solutions locally is crucial for rapid development cycles and debugging. This article demonstrates how to run your Azure Functions + Playwright synthetic monitoring solution locally using Azurite (Azure Storage Emulator) for blob storage and local Application Insights configuration.

This setup allows you to:

  • Test your monitoring solution without Azure costs
  • Debug issues in a controlled environment
  • Validate changes before deploying to production
  • Develop offline or with limited internet connectivity

Local Development Architecture

┌─────────────────┐    ┌─────────────────┐    ┌─────────────────┐
│   Azure Timer   │    │  Azure Function │    │   Playwright    │
│   Trigger       │───▶│   (Runtime)     │───▶│   Test Runner   │
│  (Azurite)      │    │                 │    │                 │
└─────────────────┘    └─────────────────┘    └─────────────────┘
                                                        │
                                                        ▼
                                              ┌─────────────────┐
                                              │  Test Results   │
                                              │   Processing    │
                                              └─────────────────┘
                                                        │
                                              ┌─────────┴─────────┐
                                              ▼                   ▼
                                     ┌─────────────────┐ ┌─────────────────┐
                                     │ Application     │ │   Azure Blob    │
                                     │ Insights        │ │   Storage       │
                                     │ (Telemetry)     │ │ (Artifacts)     │
                                     └─────────────────┘ └─────────────────┘
Enter fullscreen mode Exit fullscreen mode

Prerequisites

Before starting, ensure you have installed:

  • Node.js 18+
  • Azure Functions Core Tools v4
  • Azurite (Azure Storage Emulator)
  • Azure Storage Explorer (optional, for GUI access)
# Install Azure Functions Core Tools
npm install -g azure-functions-core-tools@4 --unsafe-perm true

# Install Azurite globally
npm install -g azurite

# Or install as dev dependency in your project
npm install -D azurite
Enter fullscreen mode Exit fullscreen mode

Setting Up Azurite for Local Blob Storage

1. Azurite Installation and Configuration

Azurite emulates Azure Blob Storage, Queue Storage, and Table Storage locally.

Global Installation Method:

# Install globally
npm install -g azurite

# Start Azurite with default settings
azurite --silent --location ./azurite --debug ./azurite/debug.log
Enter fullscreen mode Exit fullscreen mode

2. Azurite Configuration Options

Create an azurite configuration for your project:

# Start Azurite with custom configuration
azurite \
  --blobHost 127.0.0.1 \
  --blobPort 10000 \
  --queueHost 127.0.0.1 \
  --queuePort 10001 \
  --tableHost 127.0.0.1 \
  --tablePort 10002 \
  --location ./azurite \
  --debug ./azurite/debug.log \
  --silent
Enter fullscreen mode Exit fullscreen mode

Configuration Parameters:

  • --location: Directory where Azurite stores data
  • --debug: Debug log file location
  • --silent: Reduces console output
  • --blobPort: Port for blob storage (default: 10000)
  • --loose: Enables loose mode for compatibility

Local Environment Configuration

1. Local Settings Configuration

Create or update your local.settings.json file:

{
  "IsEncrypted": false,
  "Values": {
    "AzureWebJobsStorage": "DefaultEndpointsProtocol=http;AccountName=devstoreaccount1;AccountKey=Eby8vdM02xNOcqFlqUwJPLlmEtlCDXJ1OUzFT50uSRZ6IFsuFq2UVErCz4I6tq/K1SZFPTOtr/KBHBeksoGMGw==;BlobEndpoint=http://127.0.0.1:10000/devstoreaccount1;",
    "FUNCTIONS_WORKER_RUNTIME": "node",
    "AZURE_STORAGE_CONNECTION_STRING": "your-storage-account-connection-string",
    "BLOB_CONTAINER_NAME": "test-artifacts",
    "APPLICATIONINSIGHTS_CONNECTION_STRING": "your-appinsights-connection-string",
    "baseUrl": "https://example.com",
    "SYNTHETIC_MONITOR_SCHEDULE": "0 */5 * * * *"
  }
}
Enter fullscreen mode Exit fullscreen mode

Key Configuration Points:

  • AzureWebJobsStorage: Required by Azure Functions runtime
  • AZURE_STORAGE_CONNECTION_STRING: Used by your blob storage functions
  • APPLICATIONINSIGHTS_CONNECTION_STRIN: Used by your appInsights functions to report the test status
  • BLOB_CONTAINER_NAME: Container for storing test artifacts
  • SYNTHETIC_MONITOR_SCHEDULE: Set to run every minute for local testing

2. Complete Local Development Workflow

Terminal 1 - Start Azurite:

# manually:
azurite --silent --location ./azurite --debug ./azurite/debug.log
Enter fullscreen mode Exit fullscreen mode

Terminal 2 - Build and Start Azure Functions:

# Build TypeScript
npm run build

# Start Azure Functions locally
func start --typescript
Enter fullscreen mode Exit fullscreen mode

Terminal 3 - Run Tests Manually (Optional):

# Run Playwright tests directly
npx playwright test
Enter fullscreen mode Exit fullscreen mode

Conclusion

Setting up a local development environment with Azurite enables rapid development and testing of your synthetic monitoring solution. This approach provides:

  • Fast Development Cycles: No need to deploy to Azure for every change
  • Cost Savings: No Azure storage costs during development
  • Debugging Capabilities: Full control over the local environment

The combination of Azurite for storage emulation and local Azure Functions runtime creates a robust development environment that closely mirrors production behavior while providing the flexibility needed for effective development and testing.

Additional Resources

Top comments (0)