const wvElement = document.getElementById('viewer');
WebViewer({ 
  fullAPI: true,
  ...options 
  }, wvElement)
  .then(instance => {
    const { PDFNet, documentViewer } = instance.Core;
    // If you wish to add trusted certificates to show verified signatures in the signature panel you must set them via addTrustedCertificates
    const { VerificationOptions } = instance.UI;
    VerificationOptions.addTrustedCertificates([path_to_certificate_file]);

    await PDFNet.initialize();
    await PDFNet.runWithCleanup(async () => {
      const doc = await documentViewer.getDocument().getPDFDoc();
      doc.lock();
      sign() { // approval signature
        // Retrieve the unsigned approval signature field.

         let approvalSigField;
         const fieldIterator = await doc.getFieldIteratorBegin();
         for (; (await fieldIterator.hasNext()); fieldIterator.next()) {
           const field = await fieldIterator.current();
           if (
             !(await field.isValid())
             || await field.getType() !== PDFNet.Field.Type.e_signature
           ) {
             continue;
           }
           approvalSigField = await PDFNet.DigitalSignatureField.createFromField(field);
         }

        // (OPTIONAL) Add an appearance to the signature field.
        const img = await PDFNet.Image.createFromURL(doc, appearance_img_path);
        const approvalSignatureWidget = await PDFNet.SignatureWidget.createFromObj(await approvalSigField.getSDFObj());
        await approvalSignatureWidget.createSignatureAppearance(img);
        const page1 = await doc.getPage(1);
        page1.annotPushBack(approvalSignatureWidget);
        // Prepare to sign on the next save
        await approvalSigField.signOnNextSaveFromURL(cert_file_path, 'password');
        // (OPTIONAL) Add more information to the signature dictionary. The following lines must always be after the call to signOnNextSaveFromURL
        await approvalSigField.setLocation("Vancouver, BC");
        await approvalSigField.setReason("Document approval.");
        await approvalSigField.setContactInfo("www.pdftron.com");
        // The actual approval signing will be done during the following incremental save operation.
        const buf = await doc.saveMemoryBuffer(PDFNet.SDFDoc.SaveOptions.e_incremental);
        const blob = new Blob([buf], { type: 'application/pdf' });
        saveAs(blob, 'signed_doc.pdf');
      }
      certify() { // certification signature
        /**
         * Certifying a document requires a digital signature field (can optionally be
         * hidden), hence why the logic below either looks for an existing field in the
         * document, or suggests creating a field in the document
         */
        // Retrieve the unsigned certification signature field.
        /**
         * Note: Replace certificationFieldName with the field name in the
         * document that is being certified
         */
        const certificationSigField = await  doc.getDigitalSignatureField(certificationFieldName);

        // Alternatively, create a new signature form field in the PDFDoc. The name argument is optional;
        // leaving it empty causes it to be auto-generated. However, you may need the name for later.
        // Acrobat doesn't show digsigfield in side panel if it's without a widget. Using a
        // Rect with 0 width and 0 height, or setting the NoPrint/Invisible flags makes it invisible.
        // const certificationSigField = await doc.createDigitalSignatureField(certificationFieldName);
        // (OPTIONAL) Add an appearance to the signature field.
        const img = await PDFNet.Image.createFromURL(doc, appearance_img_path);
        const certifySignatureWidget = await PDFNet.SignatureWidget.createFromObj(await certificationSigField.getSDFObj());
        await certifySignatureWidget.createSignatureAppearance(img);
        const page1 = await doc.getPage(1);
        page1.annotPushBack(certifySignatureWidget);
        // Prepare the document locking permission level to be applied upon document certification.
        certificationSigField.setDocumentPermissions(PDFNet.DigitalSignatureField.DocumentPermissions.e_no_changes_allowed);
        
        // Prepare the signature for certification.
        await certificationSigField.signOnNextSaveFromURL(cert_file_path, 'password');
        // (OPTIONAL) Add more information to the signature dictionary. The following lines must always be after the call to signOnNextSaveFromURL.
        await certificationSigField.setLocation("Vancouver, BC");
        await certificationSigField.setReason("Document certification.");
        await certificationSigField.setContactInfo("www.pdftron.com");
        // Save the PDFDoc. Once the method below is called, PDFNet will also certify the document using the information provided.
        const buf = await doc.saveMemoryBuffer(PDFNet.SDFDoc.SaveOptions.e_incremental);
        const blob = new Blob([buf], { type: 'application/pdf' });
        saveAs(blob, 'certified_doc.pdf');
      })
    })
  })