HTML tag(s) in Report Viewer error messages

[Steve]

Hi,

I have found 2 or 3 error messages that get rendered with an escaped HTML tag.

I have just:

• updated my ASP.NET Core API application to .Net 7
• updated Telerik Reporting packages to 18.0.24.130
• removed a custom ExceptionFilterAttribute that was blocking the ReportsExceptionFilter on the ReportsControllerBase

The client web-app has:

• jQuery: v3.5.1
  
• Kendo UI: v2022.3.1109
  

Paying attention to the report viewer error handling while testing the changes I noticed that the "<br />" HTML tag is evident in the displayed message. HTML content:

<div class="trv-error-message" tabindex="0">Client with ID '430e860227a' not found. Expired.&lt;br /&gt;Click 'Refresh' to restore client session.</div>

The app logs:

INF | Executing ObjectResult, writing value of type 'Telerik.Reporting.Services.Engine.HttpError'.
INF | Request finished HTTP/2 GET https://localhost/reporting/api/reports/clients/430e860227a/instances/495856f7d27/documents/0ea84cac86d5cc092af7e9/pages/4 - - - 410 143 application/json;+charset=utf-8 24.0922ms

So, now the Telerik.Reporting.Services.Engine.HttpError object is returned to the client with a more appropriate status code (as opposed to previously where my filter would return a 500 reponse with a generic error message).

410 response content for the above:

{
	"message": "",
	"exceptionMessage": "Client with ID '430e860227a' not found. Expired.",
	"exceptionType": "InvalidClientException",
	"stackTrace": null
}

 

So it would appear that the report viewer is appending "<br />Click 'Refresh' to restore client session." to the "exceptionMessage" value, then escaping HTML content.

 

Additionally, the browser console shows the following error when the viewer error occurrs:

Uncaught (in promise) TypeError: de is undefined
    N 					https://localhost/reporting/api/reports/resources/js/telerikReportViewer:10
    telerikReportViewer 		https://localhost/reporting/api/reports/resources/js/telerikReportViewer:10
    promise callback*se 		https://localhost/reporting/api/reports/resources/js/telerikReportViewer:10
    K 					https://localhost/reporting/api/reports/resources/js/telerikReportViewer:10
    promise callback*jt 		https://localhost/reporting/api/reports/resources/js/telerikReportViewer:10
    beginLoad 				https://localhost/reporting/api/reports/resources/js/telerikReportViewer:10
    $e 					https://localhost/reporting/api/reports/resources/js/telerikReportViewer:10
    refreshReportCore 			https://localhost/reporting/api/reports/resources/js/telerikReportViewer:10
    previewReport 			https://localhost/reporting/api/reports/resources/js/telerikReportViewer:10
    R 					https://localhost/reporting/api/reports/resources/js/telerikReportViewer:13
    kr 					https://localhost/reporting/api/reports/resources/js/telerikReportViewer:13
    jQuery 8
    kr 					https://localhost/reporting/api/reports/resources/js/telerikReportViewer:13
    $.fn[t.name]/< 			https://localhost/reporting/api/reports/resources/js/telerikReportViewer:15
    k 					https://localhost/reporting/api/reports/resources/js/telerikReportViewer:9
    t.name 				https://localhost/reporting/api/reports/resources/js/telerikReportViewer:15
    bind 				https://localhost/reporting/api/reports/resources/js/telerikReportViewer:10
    k 					https://localhost/reporting/api/reports/resources/js/telerikReportViewer:9
    bind 				https://localhost/reporting/api/reports/resources/js/telerikReportViewer:10
    _ 					https://localhost/reporting/api/reports/resources/js/telerikReportViewer:15
    Y 					https://localhost/reporting/api/reports/resources/js/telerikReportViewer:15
    promise callback*fn/Z/</< 		https://localhost/reporting/api/reports/resources/js/telerikReportViewer:15
    promise callback*fn	/Z/< 		https://localhost/reporting/api/reports/resources/js/telerikReportViewer:15
    promise callback*Z 			https://localhost/reporting/api/reports/resources/js/telerikReportViewer:15
    fn 					https://localhost/reporting/api/reports/resources/js/telerikReportViewer:15
    telerikReportViewer 		https://localhost/reporting/api/reports/resources/js/telerikReportViewer:15
    k 					https://localhost/reporting/api/reports/resources/js/telerikReportViewer:9
telerikReportViewer:10:21156

 

 

It is similar for this example:

<div class="trv-error-message" tabindex="0">Error creating report instance (Report = 'App\MyReport.trdp'). Client with ID '801c66e95b6' not found. Expired.&lt;br /&gt;Click 'Refresh' to restore client session.</div>

[Dimitar]

Hello Steven,

Thank you for the provided information!

I was able to reproduce the issue with v18 and confirm that it was not present in v17. As a result, I have logged the issue on the public feedback portal - When an error is thrown in the HTML5 Report Viewer and the client ID is expired, the error message contains line breaks rendered as text (telerik.com), and have cast your vote for it to increase its priority. I have also updated your account's Telerik points as a reward for discovering the issue and taking the time to report it.

The issue appears in the formatXhrError function which the HTML5 Report Viewer uses internally, This is where the line break is added in the text when the client is expired:

    function formatXhrError(xhr, status, error, localizedMessage) {
      var parsedXhr = parseJSON(xhr.responseText);
      var result = "";
      if (parsedXhr) {
        var errorMessage = tryResolveClientErrorByExceptionType(parsedXhr.exceptionType || parsedXhr.error);
        if (errorMessage) {
          return errorMessage;
        }
        result = escapeHtml(parsedXhr.message);
        var exceptionMessage = escapeHtml(parsedXhr.exceptionMessage || parsedXhr.error_description);
        if (exceptionMessage) {
          if (result) {
            result += " " + exceptionMessage;
          } else {
            result = exceptionMessage;
          }
        }
      } else {
        result = escapeHtml(xhr.responseText);
      }
      if (localizedMessage || error) {
        if (result) {
          result = " " + result;
        }
        result = escapeHtml(localizedMessage ? localizedMessage : error) + result;
      }
      if (isInvalidClientException(xhr)) {
        result += "<br />" + stringResources.clientExpired;
      }
      return result;
    }

If you wish to remove this with the current release, you may use our local JS files which we ship with the installation of the product - C:\Program Files (x86)\Progress\Telerik Reporting 2024 Q1\Html5\ReportViewer\js. 

You may open the telerikReportViewer-18.0.24.130.js file and have the part that adds the linebreak removed, then you may load the JS resource from a local folder in your application to use the edited version. The function formatXhrError function starts at line 1979.

I hope that this workaround will work for your needs. 

Regards,
Dimitar
Progress Telerik