lazysizes
lazysizes copied to clipboard
Including ls.unveilhooks.js via script tag breaks browser
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 Thanks for the issue. I would need a test case that demonstrates the issue.
I couldn't reproduce the issue in JS Bin, but it did break in Chrome.
@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.
Hi @aFarkas I can't reproduce it in JS Bind or codepen, so go ahead and close it.