Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP

Loading…

Problem with CSS in <noscript> #176

Closed
davidray opened this Issue · 2 comments

2 participants

David Christiansen Nick Reed
David Christiansen

I use noscript to tell users with javascript disabled to go away. I recently got a bit more agressive with it and put some css in it to hide everything, like this:

    <noscript>
        <style>
          /*<![CDATA[*/
            #the_shizzle {
              display: none;
            }
          /*]]>*/
        </style>
        <p>Your browser does not have javascript enabled - TroopTrack relies on Javascript and it must be enabled to use this site. Please enable javascript in your browser.</p>
      </noscript>

#the_shizzle is me being silly, but it's the ID of the div where I yield to the view.

In a browser with javascript enable, and with that CSS inside my noscript tag, for some reason the_shizzle css gets applied every time I click a turbolinks enabled link, and my views never appear. If I click on a non-turbolinks link, it works fine.

Is this a turbolinks issue or am I being stupid?

Thanks!

Dave

Nick Reed
Collaborator

It's more of a browser issue. When javascript appends a noscript tag containing a style tag to the DOM, the browser appears to apply the CSS, ignoring the fact that it's inside a noscript tag.

I'm about to submit a PR to handle this issue. It's just going to remove all the noscript tags from the body. For the time being, you can fix your application by adding this to your javascript:

$(document).on 'page:change', ->
  $('noscript').remove()
David Christiansen

Thanks. That fixed it for me.

David Christiansen davidray closed this
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.