Fill pdf form using react

I have this form standard form of lease and i need to fill this with dynamic values using javascript. I tried using pdf-lib to get all the fields but it gives me empty array with some warning Trying to parse invalid object: in console.

  const formUrl = 'https://forms.mgcs.gov.on.ca/dataset/edff7620-980b-455f-9666-643196d8312f/resource/929691d6-56bf-4d64-8474-0e434bb2d32d/download/2229e.pdf'
  const formPdfBytes = await fetch(formUrl).then(res => res.arrayBuffer())

  const pdfDoc = await PDFDocument.load(formPdfBytes,{
  ignoreEncryption: true,
  })

  const form = pdfDoc.getForm()
  const fields = form.getFields()

Any ways to achieve this?

The problem with XFA.pdf files is they are variable pages, so in a browser, it's one page that says open in Adobe proprietary viewers where it is converted into a stupidly long 30 page agreement.

Thus you have little chance of deciding where a PDF field may be found since page 1 in the PDF cannot be page 1 in the dynamic form. hence a 3rd party apps like Python ones will struggle reading the file.

The best way to work with Adobe's own licensed format is using Adobe products, since if we ask Acrobat to save as usable in other Readers, it's not going to be much use, since the numbering of pages keeps changing. (Here it seems to be between 14 and 30 ?)