Preview Reports with AI-generated Test Data (Web Report Designer)

• Jun 27, 2025
• 3 minutes to read

Follow instructions in this help topic to use AI-generated Test Data when you preview reports in the Web Report Designer. This tutorial uses Azure OpenAI.

Once this functionality is integrated, you can click the Smart Preview button in the Report Designer Toolbar next to Design/Preview commands to see a report preview with AI-generated Test Data:

Run Demo: Report Designer AI Extensions

This functionality allows you to leverage LLMs and generate a test JSON data source based on the schema of an existing report data source. If the report doesn’t specify a data source, the schema is derived from data-bound expressions and text properties.

The generated test data source is used to populate a report with meaningful test data for preview. Use this functionality to design reports without a live connection to a data source. It also allows you to share report documents without including actual data.

Note

This functionality is not supported in the Web Report Designer control for ASP.NET MVC and ASP.NET Web Forms.

Install NuGet Packages

Install the following NuGet packages to use Azure OpenAI:

• DevExpress.AIIntegration.AspNetCore.Reporting
• Microsoft.Extensions.AI (Version=”9.5.0”)
• Microsoft.Extensions.AI.OpenAI (Version=”9.5.0-preview.1.25265.7”)
• Azure.AI.OpenAI (Version=”2.2.0-beta.4”)

For the list of supported AI services and their corresponding prerequisites, refer to the Supported AI Services section of the following help topic: AI-powered Extensions for DevExpress Reporting.

Note

DevExpress AI-powered extensions follow the “bring your own key” principle. DevExpress does not offer a REST API and does not ship any built-in LLMs/SLMs. You need an active Azure/Open AI subscription to obtain the REST API endpoint, key, and model deployment name. These variables must be specified at application startup to register AI clients and enable DevExpress AI-powered Extensions in your application.

Register AI Service and Activate Extension

Call the following methods on application startup:

AddDevExpressAI

Adds DevExpress AI-related services to the application service collection.

AddWebReportingAIIntegration

Adds AI-powered functionality to the Web Document Viewer and Web Report Designer.

AddTestDataSource()

Activates AI-powered Test Data functionality in the Web Report Designer.

Use the following methods to specify test data source options:

• SetRowCount

  Specifies the number of data rows in the generated test data source.

• SetTemperature

  Specifies output randomness. Lower temperatures yield more predictable and focused outputs, while higher temperatures produce more diverse and creative responses.

The following snippet registers an Azure OpenAI service and activates the AI-powered Report Preview in the Web Report Designer:

Program.cs

using Azure.AI.OpenAI;
using Microsoft.Extensions.AI;
using System;
// ...
string azureOpenAIEndpoint = Environment.GetEnvironmentVariable("AZURE_OPENAI_ENDPOINT");
string azureOpenAIKey = Environment.GetEnvironmentVariable("AZURE_OPENAI_API_KEY");
string deploymentName = "MODEL_NAME"

IChatClient chatClient = new AzureOpenAIClient(new Uri(azureOpenAIEndpoint),
     new System.ClientModel.ApiKeyCredential(azureOpenAIKey))
.GetChatClient(deploymentName).AsIChatClient();

builder.Services.AddSingleton(chatClient);
builder.Services.AddDevExpressAI(config => {
    config.AddWebReportingAIIntegration(options => {
        options.AddTestDataSource(tdsOptions => 
            tdsOptions.SetRowCount(8));
    });    
});

Disable AI-powered Functionality for a Specific Control

AI-powered functionality configured within AIReportingConfigurationBuilder is available for all Report Viewer and Report Designer components in the application. If you need to disable this AI-powered functionality for a specific Web Report Designer control, set the client AIServicesEnabled property to false in the BeforeRender event handler. The following snippet disables AI-powered functionality for a Report Designer in an ASP.NET Core application:

<script type="text/javascript">
    function onBeforeRender(e, s) {
           DevExpress.Reporting.Designer.Settings.AIServicesEnabled(false);
    }
</script>
@{
    var designerRender = Html.DevExpress().ReportDesigner("reportDesigner")
        .Height("100%")
        .ClientSideEvents(configure => configure.BeforeRender("onBeforeRender"))
        .Bind(Model);
    @designerRender.RenderHtml()
}

Report Preview with AI-generated Test Data

Click the Smart Preview button in the Report Designer toolbar to see a report preview with AI-generated test data:

The following image shows the report preview with a test data source:

You can now preview reports with a test JSON data source generated based on the data source schema and/or expression bindings defined for report controls.