emichael / texthings

Tex All the Things: Chrome extension which typesets LaTeX in webpages using MathJax
https://chrome.google.com/webstore/detail/cbimabofgmfdkicghcadidpemeenbffn
GNU General Public License v3.0
77 stars 10 forks source link

Conflict with Disqus comments box #16

Open flipdazed opened 7 years ago

flipdazed commented 7 years ago

The following page is an example:

https://flipdazed.github.io/blog/website/unable-to-load-disqus-chrome

In this case PageScript.js appears to muddle up the Disqus container

emichael commented 7 years ago

Interesting. Not quite sure what's going on.

One thing: you've already got MathJax loaded on that page. The extension is injecting it again, which might be causing problems?

You can always blacklist flipdazed.github.io in the extension settings.

I would like to figure this out, though. Any chance you could make a minimal example web page?

flipdazed commented 7 years ago

do you want just a blank page?

emichael commented 7 years ago

...with disqus comments

flipdazed commented 7 years ago

Haha sure ... I wasn't sure if you wanted me to disable MathJax though

https://flipdazed.github.io/blog/debugging/minimal-page

emichael commented 7 years ago

That depends on whether or not there's still the issue with MathJax there. If you could create a page with nothing except the Disqus comments and whatever else is needed to trigger the bug, that would be great.

flipdazed commented 7 years ago

Try again this new page has nothing except the Disqus code and necessary head.html items

http://127.0.0.1:4000/blog/debugging/minimal-page

To clarify: No MathJax

emichael commented 7 years ago

Ummm..... I'm not on your machine.

flipdazed commented 7 years ago

Scrapped previous post... It's compiled see:

https://flipdazed.github.io/blog/debugging/minimal-page

for the minimal page. I'll be back in 8hrs as my timezone is GMT. Let me know if you need any further tweaks

Edit: Played around to make it as basic as I possibly could

Source:

<!DOCTYPE html>
<div class="comments">
    <a href="javascript:;" class="view-comments"><i class="fa fa-comments"></i>View Comments...</a>
    <div id="disqus_thread"></div>
</div>

<script type="text/javascript">
var config = {
  'disqus_shortname': 'flipdazed'
};
</script>
<script src="https://flipdazed.github.io/js/jquery-1.12.0.min.js"></script>
<script src="https://flipdazed.github.io/js/jquery.fitvids.js"></script>
<!-- <script src="https://flipdazed.github.io/js/prism.js"></script> -->
<!-- <script src="https://flipdazed.github.io/js/photoswipe.js"></script>
<script src="https://flipdazed.github.io/js/photoswipe-ui-default.js"></script> -->
<script src="https://flipdazed.github.io/js/post.js"></script>
emichael commented 7 years ago

Great, that really helped. Thanks.

Here's what I think is going on: I noticed that right after I click on the "View comments" button, a MathJax style grey box appears around where the comments should be, which reminded me that MathJax is automatically injected into iframes (this is needed for certain sites). Disqus comments are iframed. I bet the presence of the MathJax stuff is throwing some Disqus javascript off. Unfortunately, this probably means that Disqus and MathJax just aren't compatible. I can, though, disable injecting MathJax into the Disqus iframe somehow to at least avoid this issue. Probably won't get around to it for a couple days, but I'll see what I can do.

Thanks for reporting this!

flipdazed commented 7 years ago

no worries. I love your project and rely on it for all my mathematical repositories. Keep up the great work!