Viewer different appearance between Chrome and Edge/FireFox

Technical Support
1

Which product are you using?

PDF.js Express Viewer
PDF.js Express Version

8.7.0
Detailed description of issue
We have different view between Chrome and Edge. Looks like in Edge our configuration is not used at all, although the license key and everything loads.

Expected behaviour
Same view between Chrome and Edge

Does your issue happen with every document, or just one?
{Answer here}
all
Link to document
{Provide a link to the document in question if possible}

Code snippet
WebViewer({
path: “${contextPath}/lib”, // path to the PDF.js Express’lib’ folder on your server
licenseKey: ‘XXXXXXXXXXX’,
initialDoc: “${flexpaperModel.url}”,
disabledElements: [
‘viewControlsButton’,
‘selectToolButton’,
‘fitButton’,
‘freeHandToolGroupButton’,
‘textToolGroupButton’,
‘shapeToolGroupButton’,
‘eraserToolButton’,
‘signatureToolGroupButton’,
‘freeTextToolButton’,
‘stickyToolButton’,
‘miscToolGroupButton’,
‘toolsButton’,
‘searchButton’,
‘menuButton’,
‘searchPanel’,
‘viewControlsOverlay’,
‘menuOverlay’,
‘pageNavOverlay’,
‘toolsOverlay’,
‘searchOverlay’,
‘annotationPopup’,
‘annotationStylePopup’,
‘toolStylePopup’,
‘stylePopup’,
‘textPopup’,

        'annotationNoteConnectorLine',
        'signatureModal',
        'printModal',
        'loadingModal',
        'errorModal',
        'passwordModal',


        'stickyToolButton',
        'highlightToolButton',
        'freeHandToolButton',
        'freeTextToolButton',

    ],
	// initialDoc: '/path/to/my/file.pdf',  // You can also use documents on your server
}, document.getElementById('viewer'))
		.then(instance => {
            //console.log("instance.UI.Feature:", instance.UI.Feature);
            console.log("instance.Feature:", instance.Feature);
            console.log("instance.Feature.Copy:", instance.Feature.Copy);
            console.log("instance:", instance);

            const docViewer = instance.Core.documentViewer;
            docViewer.addEventListener('documentLoaded', () => {
                console.log('document loaded');
                instance.UI.openElements([ 'panToolButton', 'leftPanel' ]);
                instance.UI.disableFeatures([instance.UI.Feature.TextSelection, instance.UI.Feature.Copy, instance.UI.Feature.Search, instance.UI.Feature.Print]);
                instance.disableFeatures([instance.Feature.TextSelection, instance.Feature.Copy, instance.Feature.Search, instance.Feature.Print]);
            });

		});

image
image1470×578 42.1 KB

image
image1549×597 59.3 KB

image
image2516×1280 379 KB

2

Hi there,

Thank you for contacting pdf.js express forums,

From what I see from the screenshots, it looks like the disabled headers are coming back on Chrome along with the watermarks.

Are there any console errors on document load?
Are you able to programmatically disable the elements on documentLoad?

Thank you in advance.

Best regards,
Kevin Kim

3

Hi Kim,

The issue has been resolved. It had to do with browser cache.
We were using Ctrl, Shift and the ‘R’ key and Ctrl + F5, to refresh cache but it was not working properly for some unknown reason… Finally a complete clear of browser cache resolved the issue.

Regards,
Dimitris Eleftheriou