cusdis icon indicating copy to clipboard operation
cusdis copied to clipboard

Resize doesn't work with index.js

Open sajeshcherian opened this issue 2 years ago • 3 comments

I am self-hosting cusdis on https://comments.simbly.me. The current widget/index.js is not resizing the iframe and as a result the iframe ends up with vertical scrollbars. I compared my index.js script with that of Neils' (@din14970) on his blog (https://nielscautaerts.xyz/) and found it to be slightly different. For reference, his looks like this: https://cusdis.nielscautaerts.xyz/js/cusdis.es.js. So do the rest of the cusdis implementations I was looking at on the web, including the hosted version.

I couldn't figure out the difference very well, but I replaced my JS file with Neils' and the vertical scrollbar issue is gone. (Everything else was working fine anyway). Replacing that JS file is all I did to make the scrollbar go away.

sajeshcherian avatar Mar 23 '22 00:03 sajeshcherian

I just try to use the latest docker container, I do no configuration/modification on the code.

din14970 avatar Mar 23 '22 10:03 din14970

I went with the manual installation instead of a docker image. Not sure how that made a difference.

sajeshcherian avatar Mar 23 '22 12:03 sajeshcherian

It is because the window.postMessage is overwritten by the widget/index.js, see this line, and when the iframe send the resize message, the real window.postMessage didn't called.

To fix it there are some ways:

  1. include the cusdis.es.js as a module use a module attribute <script src="cusdis.es.js" module></script>
  2. change the function name at this line
  3. wrap the code into an IIFE, see my commit: https://github.com/zgq354/cusdis/commit/961fa9818d0b7395790c171810fe27535bd4a81f
image

zgq354 avatar May 13 '23 15:05 zgq354