The noscript tag was improperly used, whilst the browser extension is working properly. Besides that, the page result may be cached and therefore hard refresh (reload with override cache) is likely required.
Improper use
But the output I would expect is 'aaa ccc', because I'd expect 'aaa' to show when scripts are disabled, and scripts are disabled.
No, the expected output 'aaa' will not be shown because the noscript tag was improperly used.
HTML noscript tag on W3schools provides a concise explanation for the usage:
Definition and Usage [...]
The <noscript> element can be used in both <head> and <body>.
When used inside the <head> element: <noscript> must contain only <link>,
<style>, and <meta> elements.
Differences Between HTML 4.01 and HTML5
In HTML 4.01, the <noscript> tag can only be used inside the <body> element.
In HTML5, the <noscript> tag can be used both inside <head> and <body>.
In other words, the noscript tag used by OP is valid based on HTML5 but that does not follow the HTML standard. The noscript tag in HTML head element should not contain any "free text".
Page result
There is also a secondary issue that I work around, which is that if I disable or even 'remove' NoScript from Firefox, then I still get the same response of 'ccc' [...]
Most browsers including Firefox use cache by default, therefore hard refresh is likely required. This can be easily reproduced all the time, unless user has configured the cache behaviour differently.
Discrepancy 1: Hard refresh is performed via keyboard shortcut, which may be either Ctrl+F5 or Ctrl+Shift+R for Firefox. In case of browser extension, the cached effect may persist until the browser is restarted again (user experience may differ).
If I install 'uBlock Origin', and select to leave as is so not disable scripts, then I get 'bbb ccc' (fine). Whereas if I click to disable scripts on the page, then I get 'ccc'. The 'aaa' isn't getting displayed.
The noscript tag that contained 'aaa' is probably being ignored or omitted by the extensions, because 'aaa' usage does not follow the HTML standard. The noscript tag in HTML head element must contain only the three elements as noted above.
Discrepancy 2: The page result will be 'bbb ccc' also when viewing the HTML file locally in Firefox, even when uBlock Origin is enabled and the extended option "Disable JavaScript" is checked. This is likely due to the limited permission given to the extensions in Firefox Quantum. In other words, the browser extension is unable to block script for a local HTML page displayed via file URI scheme (not via localhost run by a web server, which is another different matter).
Try again
Consider the modified HTML content as follows:
<!doctype html>
<html>
<head>
<noscript>aaa<style>#this {color:#cccccc;}</style></noscript>
<script>document.write("bbb")</script>
</head>
<body>
<noscript>nnn</noscript>
<span id="this">ccc</span>
</body>
</html>
Then load the HTML in Firefox with uBlock Origin and its option "Disable JavaScript" is unchecked (OFF) or is checked (ON).
- If "Disable JavaScript" is OFF, then the result will be 'bbb ccc'
- If "Disable JavaScript" is ON, then the result will be 'nnn ccc', whereby 'nnn' is shown from the noscript tag in HTML body element and 'ccc' inherits the colour from the noscript tag in HTML head element
- In both cases, 'aaa' will never appear as explained earlier (does not follow standard)
Discrepancy 3: The 'aaa' will be visible only if JavaScript is disabled within the browser itself (Firefox hidden configuration, about:config - "javascript.enabled" set to "false"). Alternatively, use any text-only browser to see similar result. That is different from the option provided by the browser extension, which Firefox Quantum had limited by design.
TL;DR Use noscript tag in HTML body element, for making text visible when script is disabled. The browser extension is working properly according to the HTML standard but limited by design.
Use Developer Tool in Firefox (F12 or Ctrl+Shift+I) to check the output in the Console. The hosted page has this *additional error: "Content Security Policy: The page's settings blocked the loading of a resource at inline ("script-src"). aaa2.html:5:1" The problem has nothing to do with Firefox itself and cannot be reproduced with a local HTML file. – None – 2019-06-26T15:45:52.153
@clearkimura If you click aaa2.html:5:1 . you see that's the document.write("bbb") line. And you get the error you mention, when the extension blocks javascript, so 'bbb' doesn't get written. So that's ok. That's just a message from it not running the script. It's similar in Chrome with uBlockOrigin, "Refused to execute inline script because it violates the following Content Security Policy directive:". What it doesn't cover though, is why it has not still executed
<noscript>aaa</noscript>
. – barlop – 2019-06-26T18:44:45.480It looks like maybe the way these script blocking extensions work, the browser doesn't realise that scripts have been disabled, hence a)it doesn't run the contents inside <noscript>...</noscript> and hence b)the message you mention. so it still kind of tries to execute it to an extent, but fails baesd on a content security policy directive that the extension might use. – barlop – 2019-06-26T18:47:24.687
@clearkimura when you say you tried it locally and couldn't reproduce when local. Do you mean locally on a local web server(if so, which one?), or just locally like opening the html file not through a web server? – barlop – 2019-06-26T18:48:45.283
related- https://stackoverflow.com/questions/55452065/in-html-webpage-the-content-within-noscript-tags-are-not-getting-rendered-by-br . and see comments https://stackoverflow.com/questions/34231292/html-noscript-tag-does-not-work
– barlop – 2019-07-02T19:59:10.720