Filled fields in additional pages do not render in Acrobat, but work fine in chrome.

[turbo2ltr]

What were you trying to do?

I have a one page fillable PDF document (a roster list) that I use PDF-LIB to fill in with the list of people that have RSVPd. No problem. Sometimes I need multiple pages if there are more than x number of people. Since I only have one template document, I create multiple pdf-lib documents and fill in each one separately. Then I create a new blank master document and merge all the individual pages into the master using copyPages.
When viewed in Chrome based browsers, the document is as expected.
When viewed in Adobe Reader, the first page is filled out, the rest of the pages, the PDF is there, but all the fields are blank.

How did you attempt to do it?

Overall approach was:

• create multiple PDF-LIB objects from the single template.
• Fill in the fields for each PDF
• Create a new blank master PDF
• Merge all the pages into the master document
• Have the user download it and view in whatever reader that have available. Sometimes that's directly in the browser, sometimes that is Adobe, sometimes it's Foxit, etc.

What actually happened?

The code works. It generates a PDF. But the PDF renders differently in Adobe than other readers.
In Chrome and Foxit, the PDF has all pages and all fields on all pages are properly filled
In Adobe, the first page has a fully filled PDF, but any additional pages have the original template PDF, but none of the field data is displayed.

What did you expect to happen?

I expected the PDF to show all the fields on all readers.

How can we reproduce the issue?

Some simplified pseudo code.

var { PDFLib } = globalThis;
const response = await fetch(url);    // URL of template PDF
const blob = await response.blob();
const arrayBuffer = await new Response(blob).arrayBuffer();
const templateByteArray = new Uint8Array(arrayBuffer);     // store it for later

// [determine the number of pages I need]
// for each page needed
 {
     pdfDocArray[pageNumIndx] = await PDFLib.PDFDocument.load(templateByteArray);
     formArray[pageNumIndx] = pdfDocArray[pageNumIndx].getForm();

     // fill in the fields
     formArray[pageNumIndx].getTextField('Location').setText("somewhere");
     ...
}

// merge them together
const pdfDocMaster = await PDFLib.PDFDocument.create()

// for each page added
{
     const pdfBytes1 = await pdfDocArray[pageNumIndx].save();
     const pdfDoc2 = await PDFLib.PDFDocument.load(pdfBytes1);
     pdfDocArray[pageNumIndx] = pdfDoc2;

     const [TmpPage] = await pdfDocMaster.copyPages(pdfDocArray[pageNumIndx], [0]);	// copy the filled in page to the new doc
     await pdfDocMaster.addPage(TmpPage);
     pageNumIndx++;
}

Version

1.17.1

What environment are you running pdf-lib in?

Browser

Checklist

• My report includes a Short, Self Contained, Correct (Compilable) Example.
• I have attached all PDFs, images, and other files needed to run my SSCCE.

Additional Notes

No response