Skip to content

Uncaught (in promise): Error: Supplied data is not a JPEG #1339

@NikhilRadadiya

Description

@NikhilRadadiya

Thank you for submitting an issue to jsPDF. Please read carefully.

Are you using the latest version of jsPDF?
Yes, I'm using 1.3.2
Have you tried using jspdf.debug.js?
Yes
Steps to reproduce
As I'm having problem with images, I can't reproduce it on jsbin

These are the libraries i'm using

       <script src="assets/js/jspdf/dist/html2canvas.js"></script>
       <script src="assets/js/jspdf/plugins/addimage.js"></script>
       <script type="text/javascript">
       function createPdf(){
           const elementToPrint = document.getElementById('main');
           console.log(elementToPrint);
           const pdf = new jsPDF('p', 'pt', 'a4');
            pdf.addHTML(elementToPrint, () => {
              pdf.save('t_web.pdf');
            });
         }
</script>```

**HTML**

```<div class="main" #main id="main">
      <section id="intro" class="intro-section">
         <div class="banner_wapper">
            <div class="banner_container">
               <div class="banner_info">
                  <div class="container">
                     <div class="row">
                        <div class="col-md-12">
                           <div class="banner_t_detail">
                              <h1><span>Flamingo - </span>Toyota Diwali 2017 Group</h1>
                              <div class="banner_t_detail_btm">
                                 <p> 6 Nights 7 Days - Thailand</p>
                                 <span>Inquiry #123456789 12th May, 2017  -  Quotation #123456789 16th May, 2017</span>
                                 <span>2 Nights Bangkok, 1 Night Pattaya, 2 Nights Phuket, 1 Night Krabi</span>
                              </div>
                           </div>
                        </div>
                     </div>
                  </div>
               </div>
            </div>
         </div>
      </section>```

```.banner_container``` contains image as background image
(This is just a small part from original html, original html contains more images)
**What I saw**

```EXCEPTION: Uncaught (in promise): Error: Supplied data is not a JPEG
Error: Supplied data is not a JPEG
    at getJpegSizeFromBytes (http://localhost:4200/assets/js/jspdf/plugins/addimage.js:672:10) [angular]
    at Object.jsPDFAPI.processJPEG (http://localhost:4200/assets/js/jspdf/plugins/addimage.js:717:11) [angular]
    at Object.jsPDFAPI.addImage (http://localhost:4200/assets/js/jspdf/plugins/addimage.js:602:50) [angular]
    at Object.<anonymous> (http://localhost:4200/assets/js/jspdf/dist/jspdf.debug.js:4106:19) [angular]
    at http://localhost:4200/assets/js/jspdf/dist/html2canvas.js:606:21 [angular]
    at Object.onInvoke (http://localhost:4200/vendor.bundle.js:32369:37) [angular]
    at Zone.run (http://localhost:4200/polyfills.bundle.js:10853:43) [angular => angular]
    at http://localhost:4200/polyfills.bundle.js:11440:57 [angular]
    at Object.onInvokeTask (http://localhost:4200/vendor.bundle.js:32360:37) [angular]
    at ZoneDelegate.invokeTask (http://localhost:4200/polyfills.bundle.js:11093:36) [angular]
    at Zone.runTask (http://localhost:4200/polyfills.bundle.js:10893:47) [<root> => angular]```


**What I expected**
I expected a pdf file containing output like html is producing

Please help me fix it

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions