Page 1 of 1
[INVALID] noscript messes with CSS (no javascript involved)
Posted: Wed Jun 27, 2012 11:32 pm
by gembrot
The issue is:
some hidden text is duplicated and visible at the end of the page (DOM nodes duplicated?)
The following javascript-less sample webpage is a stripped down version of a more complex CSS menu :
http://sayang.free.fr/noscript_issue/demo.html.
Screenshots:
notes
This issue doesn't occur on local file ([url]file://C:/demo.html[/url])
versions:
FF 13.0.1 with
noscript 2.4.6 ans
2.4.5
also seen with
FF 10.0.2 with
noscript 2.4.6
-gembrot
Code of demo.html:
Code: Select all
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<style type='text/css'>
* {
padding: 0px;
margin: 0px; }
#nav {
width: 236px;
background: lightgreen; }
#nav ul {
display: none; }
#nav ul li {
position: relative;
display: block; }
#nav ul li:hover {
background: lightblue; }
#nav ul li:hover .cat-holder {
display: block; }
#nav:hover ul {
display: block; }
.cat-holder {
width: 150px;
position: absolute;
display: none;
border: 1px solid black; }
</style>
</head>
<body>
<div id='nav'>
<div id='cat'>
Menu
</div>
<ul>
<li>
<a href='a.html'>Menu Entry text</a>
<div class='cat-holder col3'>
<a href="a.html">Sub-menu entry text</a><br />
</div>
</li>
</ul>
</div>
<br />
<br />
</body>
</html>
Re: noscript messes with CSS (no javascript involved)
Posted: Thu Jun 28, 2012 10:16 am
by gembrot
Okay I've found why in this thread
http://forums.informaction.com/viewtopi ... 03&start=0
It's because the noscript add-on modifies the html to show links in hidden div by duplicating them, when:
- there are no shown (shown = not hidden) links.
- there is no javascript in the page
In this case noscript actually duplicates the hidden links at the end of the page, even stripping </body> and </html> tags !!!
Normally web designers shouldn't have to worry about compatibility issues with the noscript add-on beyond java/javascript/flash.
In addition, good web development practices such as
progressive enhancement ensure that even when javascript is blocked, the page would render as expected on a script-less browser. But noscript breaks this basic assumtion by modifying the structure of the document, which consequently renders differently from a javascript-less browser.
That's bad: noscript
must not rewrite the HTML content at all : it's only supposed to strip some parts to block scripts by God's sake.
Especially when there isn't any java/javascript/flash or whatever dynamic content in the page.
Hidden DIVs aren't a threat of any sort, it's not any dynamic content.
But the noscript add-on modifies the layout, the
noscript add-on breaks the rendering/design of the page in addition to
breaking W3C compliance too (</body> and </html> tags simply stripped from the document)
This add-on *does* really mess with the page content without adding any level of security.
noscript add-on should simply block javascript and be non-intrusive, especially when no javascript is present on the page!
-gembrot
Re: noscript messes with CSS (no javascript involved)
Posted: Thu Jun 28, 2012 10:27 am
by dhouwn
Well, there is a user-facing setting for that.
The setting is there to improve accessibility when JS is blocked. If the only easy way for using a site where navigation without JS isn't possible would be enabling JS then this feature is also security-wise a win since you can use certain sites that otherwise wouldn't be usable without JS.
gembrot wrote:OIn addition, good development proactices such as progressive enhancement ensures that if javascript is blocked, the functionality is kept/
Tell that to the website creators.
P.S.: You offer your example page with the wrong mime type, "text/html" is not a valid mime type for XHTML 1.1 content. So much concerning your W3C compliance…
Re: noscript messes with CSS (no javascript involved)
Posted: Thu Jun 28, 2012 10:51 am
by gembrot
dhouwn wrote:If the only easy way for using a site where navigation without JS isn't possible would be enabling JS then this feature is also security-wise a win since you can use certain sites that otherwise wouldn't be usable without JS.
I agree with you but you're off subject : in my case there is
*NO* javascript code at all in the page.
When the page doesn't contain any dynamic content such as JS, the noscript add-on shouldn't modify the content.
dhouwn wrote:You offer your example page with the wrong mime type, "text/html" is not a valid mime type for XHTML 1.1 content. So much concerning your W3C compliance…
Irrelevant for a demo page, as long as it exhibits the problem. this demo page is really not compliant as it also lacks character encoding, xmlns, comments around the embedded styles, etc...
But
noscript is a finite product :
if it tampers with the html it must preserve W3C compliance.
Re: noscript messes with CSS (no javascript involved)
Posted: Sat Jun 30, 2012 7:33 am
by Giorgio Maone
As dhouwn said in his post, this is an accessibility feature which spares user the need to allow JavaScript in many quite widespread cases where the developer didn't give a s*t about progressive enhancement, and leaves users with an unusable and possibly blank page to stare.
That said, I agree a further check may be done to see whether any <script>, <object> or <embed> element is actually present in the page which could be used by a NoScript-allowed page to show the hidden link, but you'll admit that a web page containing links but only hidden and with no code to show them is a pretty unlikely and surely stupid thing, and this make the current heuristic reasonable enough. Anyway, I'm ready to add the aforementioned check for dynamic content if you show me a page in the wild from a popular website which said features (hidden links only and no dynamic content) which is not just a SEO scam.
Furthermore, I couldn't find any evidence that this feature is breaking W3C compliance (I cannot see any required element removed by NoScript). Could you be more precise about it?
Re: noscript messes with CSS (no javascript involved)
Posted: Sat Jun 30, 2012 10:29 am
by gembrot
The page I'm working on obviously has links so I'm not concerned anymore by this issue, and it's fair enough to assume that a website with only one menu and no link at all could be some sort of scam, and in the contraty it's up to the owner to come here and complain.
Regarding W3C break, just save the demo page
http://sayang.free.fr/noscript_issue/demo.html and you'll see in the saved file </body> and </html> have been stripped off :
Code: Select all
[...]
<body>
<div id="nav">
<div id="cat">
Menu
</div>
<ul>
<li>
<a href="http://sayang.free.fr/noscript_issue/a.html">Menu Entry text</a>
<div class="cat-holder col3">
<a href="http://sayang.free.fr/noscript_issue/a.html">Sub-menu entry text</a><br>
</div>
</li>
</ul>
</div>
<br>
<br>
<a style="visibility: visible; display: block;" href="http://sayang.free.fr/noscript_issue/a.html">Menu Entry text</a><a style="visibility: visible; display: block;" href="http://sayang.free.fr/noscript_issue/a.html">Sub-menu entry text</a></body></html>
thanks
-eric
Re: noscript messes with CSS (no javascript involved)
Posted: Sat Jun 30, 2012 10:31 am
by gembrot
By read-proofing the previous post, I've noticed the </body> and </html> are still present at the end of the pasted code ^^
my bad, all my apologies for this terrible mistake.
Re: [INVALID] noscript messes with CSS (no javascript involv
Posted: Thu Aug 16, 2012 11:12 pm
by mortan
Hello guys!
I strongly believe this "accessible feature" should be optional because it kinda breaks the layout of many sites.
Here is an example of the site I'm currently developing:
http://imgur.com/EJ41K,WbUui
As you can see, noscript renders the images from the hidden container at the bottom of the page => layout = blown.
Any chance you set this feature as optional and turn it off by default?
Kind regards!