Box Preview Not Loading

[rwmyers46]

Environment:

• Preview version: 1.38.1
• Operating system and version: iOS 11.3
• It is a hybrid application ionic1+angularjs

Problem:
I can launch in iframe same Codepen example you have on your developer page, but I can't launch it on any page of my application.

Please see screenshot below of 2 approaches :

1st on the top simple <script> attachment for the document
2nd iframe code from Codepen

http://prntscr.com/j4wdw8

As for troubleshooting, I compared the files loaded by preview.js in the Codepen and in my application and they are all the same please open 2nd screenshot to see it under #1

http://prntscr.com/j4weyo

Under #2 you can see that I'm trying to launch same sample from Codepen.
Box and Preview objects are defined and available, but when I turning "Pause on exceptions" button in dev tools of my browser I see couple of exceptions related to files and previewjs:

1st exception is http://prntscr.com/j4wh07 - ActiveXObject is not defined, but file is loaded
2nd exception is http://prntscr.com/j4ww8i - undefined object somewhere
3rd and final is http://prntscr.com/j4wwqn - PDFJS is not defined, even if file is present

Thank you.

[DanDeMicco]

Hi @rwmyers46 sorry to hear you are having problems. We will need some more information to help you out.

How are you including preview in your app?

I can see you said you were using 1.38.1 in your report, but in your screenshots it says 1.39.1. Regardless, I recommend you moving to 1.39.2 although that probably won't fix your problems.

Try attaching to the 'load' and 'preview_error' events to help you debug. e.g.

preview.addListener('load', (data) => {
   console.log(data);
});

[rwmyers46]

Hi Dan, I appreciate your response and recommendations. I’ll have to let Yegor (cc’d) answer your technical questions. Thanks! Russell

…

On Mon, Apr 16, 2018 at 20:25 Daniel DeMicco ***@***.***> wrote: Hi @rwmyers46 <https://github.com/rwmyers46> sorry to hear you are having problems. We will need some more information to help you out. How are you including preview in your app? I can see you said you were using 1.38.1 in your report, but in your screenshots it says 1.39.1. Regardless, I recommend you moving to 1.39.2 although that probably won't fix your problems. Try attaching to the 'load' and 'preview_error' events to help you debug. e.g. preview.addListener('load', (data) => { console.log(data); }); — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#772 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/Ah9kUL5Tv4Qboo-lslrCgFKYR7MfdjGzks5tpUR9gaJpZM4TXCZ3> .

[HBArck]

Hi @DanDeMicco

How are you including preview in your app?

I tried to:

1. include it directly as js files in project - wouldn't work, because it uses fixed structure of libraries, I can't duplicate it(limitation of platform)
2. include it in as a script tag in the head of my hybrid app
   Here is the result - http://prntscr.com/j6lmls

I can see you said you were using 1.38.1

Yes, when Russell report this issue we actually used all versions starting from 1.37.0 and till 1.39.2

preview.addListener('load', (data) => {

I used your code snippet in my project and the result is next:
for PDF:
Screen1Controller.js?bust=1523996607:35 {error: "PDFJS is not defined", metrics: {…}, file: {…}}
For 2nd file (vide) from example:
{error: "shaka is not defined", metrics: {…}, file: {…}}
For 3rd file(powerpoint presentation I belive) from example:
Screen1Controller.js?bust=1523996607:35 {error: "Box3D is not defined", metrics: {…}, file: {…}}

Only text file shown

Also I have couple of questions:

1. can I have a full version of code instead of minimized ?
2. can I build it on my own with your code from latest release ?
3. Why it is so important to have strict structure of all 3rd-party libraries, can I workaround it somehow to use directly in my project.
   Just a fyi, I can NOT using babel or typescript in my project, because of limitation of platform.

Thank you.

[DanDeMicco]

HI @HBArck you are using requirejs, which messes with how the dependencies are loaded, so you have two options:

1. include it as a script before your app/bootstrap, loading it without requirejs and assuming its loaded when you use it in your app

or

2. use the fixDependencies option. See https://github.com/box/box-content-preview#parameters--options

Let us know if this fixes preview for you.

As for your other questions:

1. Currently, we do not provide unminified code
2. You can, but it will involve tweaking of our webpack config to remove the minificatication. See https://github.com/box/box-content-preview#self-hosting
3. The reason is because the 3rd party libraries are being lazy loaded and we make some assumptions when we load them

[HBArck]

@DanDeMicco thank you for your quick reply.
Unfortunately,

1. can't be implemented, again, because of platform limitation I was working on
2. tried, but also didn't helped.

Good news is it works now with workaround I built with iframe and communication messages between parent and child pages.
So this issue can be closed,
Thank you.

[rwmyers46]

Great job, Dan / thanks for the help!