Why are Dolphin Browser and the Default Android Browser reading the <noscript> section in the head of my page, even though JavaScript is enabled in those browsers? This issue is causing the content of the pages not to render.
In the head section, I have linked to a CSS stylesheet that sets the display to none for anything inside a div on the page when JavaScript is disabled in the browser. The CSS resides within a noscript element so that it is only applied if JavaScript is turned off.
This solution works for all desktop/laptop browsers I tested, except for Mac as I don't have access to test it. It also works on Android with Firefox and Opera, but Dolphin and the default Android browsers are still reading the CSS stylesheet within the noscript section, resulting in the page/site not rendering correctly.
I confirmed this by removing the stylesheet link from the head section, which allowed the pages to render correctly in those problematic browsers.
Is there any way to make these browsers respect the noscript tags in the head section?
UPDATE: This is using HTML5 - the noscript tag in the head is allowed: http://www.w3.org/TR/html5/the-noscript-element.html#the-noscript-element
<!DOCTYPE html>
<html>
<head>
<noscript>
<link href="${facesContext.externalContext.requestContextPath}/css/no_javascript.css" rel="stylesheet" type="text/css" />
<!-- Despite JavaScript being enabled in Dolphin, this link is still read -->
</noscript>
</head>
<body>
<noscript>
Content within this noscript element displays correctly
</noscript>
<div class="no_javascript_disapear">
Content on this page is not rendered due to Dolphin Browser ignoring the noscript tags in the head.
</div>
</body>
</html>
// CSS within the noscript tag:
.no_javascript_disapear {display:none;}