.bcpr-content empty

[jacobmischka]

The content preview component seems to be working correctly, in all ways except that it's not actually loading the preview. The header loads and is responsive, but no matter what I try to do the content itself is just blank.

I see no errors or failed network requests, any points in the right direction would be greatly appreciated.

I'm using an enterprise account, might that have something to do with it?

[jstoffan]

Hi @jacobmischka. It would be very helpful if you could fill out our issue template so we can assist you better. Thanks.

[jacobmischka]

Environment:

• Preview version: Whatever box-ui-elements loads, looks like 2.16.0

Desktop (please complete the following information):

• OS: Linux
• Browser: Chrome, Firefox
• Version: Latest

Steps to reproduce the problem:

1. Try to load preview using developer token and File ID
2. Header shows up, metadata is successfully fetched, preview doesn't show

What is the expected behavior? (Screenshots can be helpful here)

Preview shows up.

What went wrong? (Screenshots, console logs, or HAR files can be helpful here)

Preview doesn't show up.

Link to application or sample code:

File ID and developer token redacted below.

import React, { Fragment } from 'react';
import { IntlProvider } from 'react-intl';

import { ContentPreview } from 'box-ui-elements';
import messages from 'box-ui-elements/i18n/en-US.js';

export default {
	title: 'Video'
};

export function basic() {
	return (
		<IntlProvider locale="en-US" textComponent={Fragment}>
			<ContentPreview
				token={DEVELOPER_TOKEN}
				fileId={id}
				language="en-US"
				hasHeader
				fixDependencies
				messages={messages}
				onViewer={() => {
					console.log('viewer');
				}}
				onLoad={data => {
					console.log(data);
				}}
			/>
		</IntlProvider>
	);
}

If relevant, link to file (or attach file here)

Same happens with any file.

Expected behavior
The content is previewed.

Screenshots

Additional context
Using an enterprise account with a developer token and the box-ui-elements ContentPreview react component.

[jstoffan]

Thanks for providing that additional information. Unfortunately, I'm not able to recreate this issue using either the latest or prior full versions of Elements (11.0.0, 10.1.0). I'm also able to see preview loading via the ContentPreview page on our examples site, which uses 2.26.0 of the Preview SDK.

Do you see any error messages in the developer console? Can you provide a HAR file of the page load?

[jacobmischka]

No errors. Using version 11.0.0 for box-ui-elements.

Slightly simplified code:

/** @format */

import React, { Fragment } from 'react';
import ReactDOM from 'react-dom';
import { IntlProvider } from 'react-intl';

import { ContentPreview } from 'box-ui-elements';

import messages from 'box-ui-elements/i18n/en-US.js';

const id = ******;

const DEVELOPER_TOKEN = '*****';

function App() {
	return (
		<IntlProvider locale="en-US" textComponent={Fragment}>
			<ContentPreview
				token={DEVELOPER_TOKEN}
				fileId={id}
				language="en-US"
				hasHeader
				fixDependencies
				messages={messages}
				onViewer={() => {
					console.log('viewer');
				}}
				onLoad={data => {
					console.log(data);
				}}
			/>
		</IntlProvider>
	);
}

ReactDOM.render(<App />, document.getElementById('root'));

Har file: https://send.firefox.com/download/3c1a19b8578a35e5/#bOfpNaxg0chFZJxSxwVAMQ

[jstoffan]

I don't see anything obviously wrong from looking at the HAR file. Can you add the following prop and see if anything pops out?

onError={error => console.log(error)}

[jacobmischka]

Nothing. None of the callbacks are being called, which is pretty strange.

[jacobmischka]

I can provide my developer token and an ID of the file if it'll help, just let me know when you're ready so that there's enough time before the token expires.

[jacobmischka]

Also, here are the app settings I have configured right now: