Jspdf-autotable: PDF is blank when using html option

[KeystoneJack]

I'm using jsPDF and jsPDF autotable in my angular project, when trying to create a pdf from a table the pdf is always blank.

I import the library as follows:

import jsPDF from "jspdf";
import "jspdf-autotable";
import { autoTable as AutoTable } from "jspdf-autotable";

Then declare jsPDF in a variable
pdf = new jsPDF("p", "mm", "a4", true);

My function looks like this

  createPdf() {
    let table: any;
    table = document.getElementById("testTable");

    this.pdf.autoTable({
      html: table
    });

   this.pdf.save("myPDF.pdf");

  }

and my test table like this

<table id="testTable" style="width:100%">
    <tr>
      <th>Firstname</th>
      <th>Lastname</th>
      <th>Age</th>
    </tr>
    <tr>
      <td>Jill</td>
      <td>Smith</td>
      <td>50</td>
    </tr>
    <tr>
      <td>Eve</td>
      <td>Jackson</td>
      <td>94</td>
    </tr>
  </table>

But when I try to export the table to a pdf it's just blank.

Any idea?

[stale[bot]]

This issue has been automatically closed since the issues in this project are mainly used for bugs and feature requests. Questions are directed to stackoverflow.

[KeystoneJack]

I would actually class this as a bug rather than a question. Since it doesn’t work with any table.

[simonbengtsson]

Repro from #507 https://jsfiddle.net/ny5ck6vr/

[rong4188]

@simonbengtsson actually I don't think these two issues are the same. I also put my comment under #507. I couldn't repro this issue btw

@KeystoneJack Can you please make fiddle on your one? you can tweak the fiddle in simon's comment.

[simonbengtsson]

The issue in the fiddle above is that it had a string value for startY. Should be a number. Added a warning for the recently.

[a90machado]

I dont have the startY and its the same.
Blank page

[kuzdogan]

For me the issue was that my table is missing <thead></thead> and <tbody></tbody> tags. Use as in the example in index.html:

<table class="table pure-table" id="basic-table">
  <thead>
    <tr>
      <th>ID</th>
      <th colspan="2">Name</th>
      <th>Email</th>
      <th>Country</th>
      <th>IP-address</th>
    </tr>
  </thead>
  <tbody>
      <tr>
        <td>5</td>
        <td>Jane</td>
        <td>Stephens</td>
        <td>[email protected]</td>
        <td>United States</td>
        <td>47.32.129.71</td>
      </tr>
    ...
    ...
    ...
      <tr>
        <td>6</td>
        <td>Adam</td>
        <td>Nichols</td>
        <td>[email protected]</td>
        <td>Canada</td>
        <td>18.186.38.37<br />18.123.22.82</td>
      </tr>
  </tbody>
</table>