PDF Viewer not working in production build of buildScripts

[nirmalkumar.r]

Facing this issue in local npm build. Working fine in local NPM start execute.
Able to confirm all static dependencies inside build under /webviewer/lib.
Trying pdfviewer along with Material Dashboard 2 React: Free MUI & React Admin Template @ Creative Tim.

Please help me with your inputs.

Which product are you using?

PDF.js Express Version

Detailed description of issue
{Description here}

Expected behaviour
{Provide a screenshot or description of the expected behaviour}

Does your issue happen with every document, or just one?
{Answer here}

Link to document
{Provide a link to the document in question if possible}

Code snippet
{Provide a relevant code snippet}

[darian.chen]

Hello Nirmalkumar,

Thank you for contacting us.

What version of Express are you using? Could you send us a minimal sample project or some way to reproduce the issue? A video of the issue would also be helpful.

Best Regards,
Darian

[nirmalkumar.r]

@darian.chen

Express

Hello Chen

Thanks for response.
Hope your asking about “@pdftron/pdfjs-express-viewer”: “^8.7.4”.

We are not using express.js
Also not able to share screen recorder of issue for your reference due upload size limit 8MB. Any other way to share screen reorder zip of 75MB
Attached screensnap here. for your reference

Best Regards,
NIrmal K
snapshots.zip (443.8 KB)

[darian.chen]

Hi there,

From looking at your snapshots, I don’t see anything particularly wrong. Could you share your project by creating a repository on GitHub? For screen recording, you can use https://www.loom.com/ or upload it to Google Drive.

Could you elaborate how you are using PDF.js Express with the material UI? We also have sample projects you can use available here: PDF.js Express · GitHub

We would need someway to reproduce the issue on our end in order assist further.

[nirmalkumar.r]

Hello Chen

Please find recorded session in Screen Recording (12-7-2023 1-34-33 PM).zip - Google Drive

Trying to open pdfviewer inside '@mui/material/DialogContent on click on button.
Issue is not able to construct WebViewer obj after getting valid current containerRef.

We did this in referred your GitHub sample projects and steps for react for viewer from your site.

Will be challenges to share our project in any repository.
Hope this details will help to identify issue.

Thanks
NIrmal Kumar

[nirmalkumar.r]

Chen,

Any inputs on above reported issues on pdfViewer

[darian.chen]

Hi there,

Thank you for the video and response. At the 3:05, I noticed the viewer not opening the PDF. When you try and open the PDF, could you open your console as well and check for any errors? Please provide a screenshot.

Thank you.

[nirmalkumar.r]

Hi Chen

No errors in console when trying to open pdf. Also attached screenshot for your reference.

Blocked with this issue for long time without any hint of issue. Please help with your support on this.

Thanks
NIrmal KUmar.R

[darian.chen]

Hi there,

It is difficult to pinpoint the problem without some sort of sample project. Could you host this environment and send a way to access it? If you hover over the webviewer div, do you see it anywhere on the page?

[nirmalkumar.r]

HI Chen

Please find snapshot where we can find webviewer div on hover.

[nirmalkumar.r]

Chen,

Please find sample project here :
https://github.com/RNIrmalKumar133/material-dashboard-react-main.git
Snapshots

Hope this will help us to point out issue

Thanks & Regards
NIrmal KUmar.R

[nirmalkumar.r]

Additional snapshot of code

[nirmalkumar.r]

Snapshot how to trigger pdfviewer express

[darian.chen]

Hi there,

The GitHub link you provided is not working.

[nirmalkumar.r]

Chen

Apologies for delay response.
Now Repository should be accessible
Please find sample project here :
https://github.com/RNIrmalKumar133/material-dashboard-react-main.git

Please help us to resolve it.
Thanks & Regards
NIrmal KUmar.R

[darian.chen]

Hi there,

I was able to successfully run your project. I ran npm start to see it in development. As expected the viewer appeared without any issue when I clicked “CLICK TO OPEN AGREEMENT FILE” under billing. However, when I ran npm run build and started that project, I was still able to see the PDF as well.

[nirmalkumar.r]

Chen,

That is surprising!!
Still it is not working in build mode. NOT able to see PDF
Attached screenshot

[darian.chen]

Hello,

I am able to see the viewer in build mode.

I took the following steps:

1. run npm run build
2. cd build
3. run npm run start

Then I navigated to billing and “CLICK TO OPEN AGREEMENT FILE”.

Does this happen on other devices or browsers?

[nirmalkumar.r]

Hello Chen,

Yes, able to view pdf with above steps only.

Cant we able to achieve same using following steps

1. run npm run build
2. run serve -s build

I have ci/cd process with above steps for other functionalities to work. Why need to run npm run start under build folder for this.

[darian.chen]

Hello there,

We are currently looking into this and will provide an update when we have more information.