lazysizes icon indicating copy to clipboard operation
lazysizes copied to clipboard

Including ls.unveilhooks.js via script tag breaks browser

Open alex9000 opened this issue 4 years ago • 4 comments

Describe the bug If you include the unveilhooks plugin using a script tag, the browser will report "Uncaught ReferenceError: require is not defined". This is because require() does not exist in the browser/client-side JavaScript. I believe this issue was created when the plugin was modified to support AMD loaders. See:

if(typeof module == 'object' && module.exports){ factory(require('lazysizes')); } else if (typeof define == 'function' && define.amd) { define(['lazysizes'], factory); } else if(window.lazySizes) { globalInstall(); } else { window.addEventListener('lazyunveilread', globalInstall, true); }

As a workaround I removed the first 2 else if statements.

To Reproduce Provide a url where the bug can be reproduced. (Use for example: jsbin, codepen, jsfiddle.net or codesandbox.io

Steps to reproduce the behavior: To reproduce the error load lazysizes and the unveilhook plugin using the source tag in the browser and attempt to load a bg image with lazysizes.

In what environment (browser/device etc.) does this bug happen/not happen: Mac OS / Chrome 83

alex9000 avatar Jun 14 '20 19:06 alex9000

@alex9000 Thanks for the issue. I would need a test case that demonstrates the issue.

aFarkas avatar Jun 15 '20 10:06 aFarkas

I couldn't reproduce the issue in JS Bin, but it did break in Chrome.

alex9000 avatar Jun 19 '20 17:06 alex9000

@alex9000 I think there is a little bit more to it, because I can not think how this alone will break Chrome. I hope you can somehow replicate the issue and give me all required steps to reproduce it properly. Otherwise I will close this issue.

aFarkas avatar Jun 21 '20 10:06 aFarkas

Hi @aFarkas I can't reproduce it in JS Bind or codepen, so go ahead and close it.

alex9000 avatar Jun 21 '20 18:06 alex9000