Kendo-UI Broken Export to PDF

I'm trying to stub up a simple Kendo-UI grid and allow users to export it to PDF. I have columns that are formatted (dates and numbers) and I'm hiding the command buttons when exporting the PDF.

When I attempt to export to PDF, the operation is successful but the PDF itself is broken. In Acrobat it says that it cannot open the file, using FireFox's PDF viewer it says "This PDF document may not be displayed correctly", and I get a similar error using IE's PDF viewer. It looks like the column headers get rendered, but none of the rows do.

What is odd is that the Export to Excel works just fine, it is just the Export to PDF.

Here is the code:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Untitled</title>

    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2020.1.406/styles/kendo.common.min.css">
    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2020.1.406/styles/kendo.default.min.css">
    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2020.1.406/styles/kendo.default.mobile.min.css">
    <style>
      .k-command-cell .k-button {
        display: block;
        padding: 0.5rem 0;
      }

      #navigation {
        width: 100%;
      }

      .k-pdf-export .k-grid-toolbar,
      .k-pdf-export .k-grouping-header {
        display: none;
      }
    </style>
  </head>
  <body>
    <ul id="navigation">
      <li><a href="sugar.html">Blood Sugar</a></li>
      <li><a href="pressure.html">Blood Pressure</a></li>
      <li><a href="dietary.html">Dietary</a></li>
      <li><a href="reports.html">Reports</a></li>
    </ul>

    <div id="grid"></div>

    <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/2020.1.406/js/angular.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/2020.1.406/js/jszip.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/2020.1.406/js/kendo.all.min.js"></script>
    <script>
      $(document).ready(function(){
        $("#navigation").kendoMenu();

        var dataSource = new kendo.data.DataSource({
          data: [{"SugarId":"1","UserId":"1","ReadDate":"2019-05-01","ReadTime":"09:02:00","BloodSugar":"176"},{"SugarId":"2","UserId":"1","ReadDate":"2019-05-02","ReadTime":"09:00:00","BloodSugar":"175"},{"SugarId":"3","UserId":"1","ReadDate":"2019-05-03","ReadTime":"09:07:00","BloodSugar":"166"},{"SugarId":"4","UserId":"1","ReadDate":"2019-05-04","ReadTime":"09:10:00","BloodSugar":"198"},{"SugarId":"5","UserId":"1","ReadDate":"2019-05-05","ReadTime":"08:22:00","BloodSugar":"182"},{"SugarId":"6","UserId":"1","ReadDate":"2019-05-06","ReadTime":"09:03:00","BloodSugar":"183"},{"SugarId":"7","UserId":"1","ReadDate":"2019-05-07","ReadTime":"09:03:00","BloodSugar":"171"},{"SugarId":"8","UserId":"1","ReadDate":"2019-05-07","ReadTime":"14:24:00","BloodSugar":"262"},{"SugarId":"9","UserId":"1","ReadDate":"2019-05-07","ReadTime":"20:04:00","BloodSugar":"168"},{"SugarId":"10","UserId":"1","ReadDate":"2019-05-08","ReadTime":"10:00:00","BloodSugar":"154"},{"SugarId":"11","UserId":"1","ReadDate":"2019-05-09","ReadTime":"21:50:00","BloodSugar":"174"},{"SugarId":"12","UserId":"1","ReadDate":"2019-05-10","ReadTime":"09:56:00","BloodSugar":"156"},{"SugarId":"18","UserId":"1","ReadDate":"2019-05-11","ReadTime":"09:38:00","BloodSugar":"170"},{"SugarId":"19","UserId":"1","ReadDate":"2019-05-12","ReadTime":"10:03:00","BloodSugar":"153"},{"SugarId":"20","UserId":"1","ReadDate":"2019-05-13","ReadTime":"09:52:00","BloodSugar":"163"},{"SugarId":"21","UserId":"1","ReadDate":"2019-05-14","ReadTime":"10:05:00","BloodSugar":"163"},{"SugarId":"22","UserId":"1","ReadDate":"2019-05-15","ReadTime":"10:05:00","BloodSugar":"178"},{"SugarId":"23","UserId":"1","ReadDate":"2019-05-16","ReadTime":"21:43:00","BloodSugar":"142"},{"SugarId":"24","UserId":"1","ReadDate":"2019-05-17","ReadTime":"21:33:00","BloodSugar":"135"},{"SugarId":"25","UserId":"1","ReadDate":"2019-05-18","ReadTime":"21:33:00","BloodSugar":"130"},{"SugarId":"26","UserId":"1","ReadDate":"2019-05-19","ReadTime":"09:33:00","BloodSugar":"153"},{"SugarId":"27","UserId":"1","ReadDate":"2019-05-20","ReadTime":"10:04:00","BloodSugar":"169"},{"SugarId":"28","UserId":"1","ReadDate":"2019-05-21","ReadTime":"09:54:00","BloodSugar":"155"},{"SugarId":"29","UserId":"1","ReadDate":"2019-05-22","ReadTime":"09:16:00","BloodSugar":"119"},{"SugarId":"30","UserId":"1","ReadDate":"2019-05-23","ReadTime":"09:42:00","BloodSugar":"153"},{"SugarId":"31","UserId":"1","ReadDate":"2019-05-24","ReadTime":"09:18:00","BloodSugar":"124"},{"SugarId":"32","UserId":"1","ReadDate":"2019-05-25","ReadTime":"09:14:00","BloodSugar":"141"},{"SugarId":"33","UserId":"1","ReadDate":"2019-05-26","ReadTime":"08:53:00","BloodSugar":"122"},{"SugarId":"34","UserId":"1","ReadDate":"2019-05-27","ReadTime":"09:06:00","BloodSugar":"129"},{"SugarId":"35","UserId":"1","ReadDate":"2019-05-28","ReadTime":"09:11:00","BloodSugar":"168"},{"SugarId":"36","UserId":"1","ReadDate":"2019-05-29","ReadTime":"09:01:00","BloodSugar":"148"},{"SugarId":"37","UserId":"1","ReadDate":"2019-05-30","ReadTime":"08:46:00","BloodSugar":"173"},{"SugarId":"38","UserId":"1","ReadDate":"2019-05-31","ReadTime":"08:38:00","BloodSugar":"163"},{"SugarId":"39","UserId":"1","ReadDate":"2019-06-01","ReadTime":"09:33:00","BloodSugar":"145"},{"SugarId":"40","UserId":"1","ReadDate":"2019-06-02","ReadTime":"09:33:00","BloodSugar":"156"},{"SugarId":"41","UserId":"1","ReadDate":"2019-06-03","ReadTime":"09:07:00","BloodSugar":"139"},{"SugarId":"42","UserId":"1","ReadDate":"2019-06-04","ReadTime":"09:40:00","BloodSugar":"145"},{"SugarId":"43","UserId":"1","ReadDate":"2019-06-05","ReadTime":"08:16:00","BloodSugar":"183"},{"SugarId":"44","UserId":"1","ReadDate":"2019-06-06","ReadTime":"10:08:00","BloodSugar":"136"},{"SugarId":"45","UserId":"1","ReadDate":"2019-06-07","ReadTime":"09:11:00","BloodSugar":"137"},{"SugarId":"46","UserId":"1","ReadDate":"2019-06-08","ReadTime":"09:58:00","BloodSugar":"130"},{"SugarId":"47","UserId":"1","ReadDate":"2019-06-09","ReadTime":"09:20:00","BloodSugar":"145"},{"SugarId":"48","UserId":"1","ReadDate":"2019-06-10","ReadTime":"08:48:00","BloodSugar":"167"},{"SugarId":"49","UserId":"1","ReadDate":"2019-06-10","ReadTime":"08:48:00","BloodSugar":"167"},{"SugarId":"50","UserId":"1","ReadDate":"2019-06-10","ReadTime":"08:48:00","BloodSugar":"167"}],
          page: 1,
          pageSize: 25,
          schema: {
            model:  {
              id: "SugarId",
              fields: {
                ReadDate: {
                  type: "date"
                },
                ReadTime: {
                  type: "date"
                },
                BloodSugar: {
                  type: "number"
                }
              }
            }
          }
        });

        var exportFlag = false;
        $("#grid").kendoGrid({
          columns: [
            {
              command: "edit",
              title: "Edit",
              width: "100px"
            },
            {
              command: "destroy",
              title: "Delete",
              width: "100px"
            },
            {
              field: "ReadDate",
              format: "{0: MMMM d, yyyy}",
              title: "Read Date"
            },
            {
              field: "ReadTime",
              format: "{0: hh:mm:ss tt}",
              title: "Read Time"
            },
            {
              field: "BloodSugar",
              format: "{0: n}",
              title: "Blood Sugar"
            }
          ],
          dataSource: dataSource,
          filterable: true,
          pageable: {
            pageSize: 25,
            pageSizes: [5, 25, 50, 100, "all"]
          },
          sortable: true,
          toolbar: [
            "create",
            "excel",
            "pdf",
            "search"
          ],
          pdfExport: function(e) {
            if (!exportFlag) {
              e.sender.hideColumn(0);
              e.sender.hideColumn(1);
              e.preventDefault();
              exportFlag = true;

              e.sender.saveAsPDF().then(function(){
                e.sender.showColumn(0);
                e.sender.showColumn(1);
                exportFlag = false;
              });
            }
          }
        });
      });
    </script>
  </body>
</html>

Fiddle: https://dojo.telerik.com/ONUNekaY

Image:

Solution

As per GaloisGirl's advise I reported the bug to Telerik, which can be found here: https://github.com/telerik/kendo-ui-core/issues/5761

The issue was only present in FireFox as the reason why the PDF was failing to export the rows was explained as such:

The font for the icons is missing and the browser couldn't cope with this.

The solution was to add the following script, after the Kendo-UI imports:

<script> kendo.pdf.defineFont({ "WebComponentsIcons" : "https://kendo.cdn.telerik.com/2017.1.223/styles/fonts/glyphs/WebComponentsIcons.ttf" }); </script>

Once the font was defined, the Export to PDF worked.

I am unsure if Telerik will fix this on their end or not, but the solution was simple enough to satisfy my use.