Fable Samples Page is broken

[leolorenzoluis]

Description

It doesn't display anything when Adblock is turned on.

Repro steps

1. Install Adblock and navigate to https://fsprojects.github.io/Fable/samples.html
   

   Expected behavior

Actual behavior

Known workarounds

Disable Adblock

Related information

N/A

[tpetricek]

Have you tried reporting this as an Adblock issue? I think there is absolutely nothing odd about the samples page that should make Adblock think this is an ad...

[leolorenzoluis]

I think I figured out why.

[blocked] The page at https://fsprojects.github.io/Fable/samples.html was
 not allowed to run insecure content from ws://fsprojects.github.io/websocket.

It's on this part

function init() {
          try {
            websocket = new WebSocket("ws://"+window.location.host+"/websocket");
            websocket.onmessage = function(evt) { location.reload(); };
          } catch(e) { /* For local development only */ }
}
window.addEventListener("load", init, false);

[alfonsogarciacaro]

Nice catch @leolorenzoluis! @tpetricek, is there an easy way to make that part appear only when building the website locally? Thanks!

[mexx]

I still have this problem.
My investigations showed that AdBlock reacts on fb-content class.
Maybe another class prefix without a clash with some social network would be better ;)

[alfonsogarciacaro]

Thanks a lot for the tip @mexx! I'll try to fix it when updating the documentation. This is probably the same as #574.

[alfonsogarciacaro]

I tried to change all fb- CSS classes to fable-, but that broke the styles 😞 Maybe @tpetricek can help here?

[codec-abc]

@alfonsogarciacaro I think you can close this one now :)