New: Update hint to check for XCTO header on all resources

utsavized · utsavized · commit 0920125da700 · 2019-02-05T21:51:48.000-08:00
This reverts changes added to check for this header only on scripts and stylesheets, and instead, checks for the header on all resources. MDN suggests the former, but Chromium uses this response header on more than script/stylesheets for CORB. - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Ref webhintio#1221 Close webhintio#1221
diff --git a/packages/hint-x-content-type-options/README.md b/packages/hint-x-content-type-options/README.md
@@ -1,7 +1,7 @@
 # Use `X-Content-Type-Options` header (`x-content-type-options`)
 
-`x-content-type-options` requires that all scripts and
-stylesheets are served with the `X-Content-Type-Options: nosniff`
+`x-content-type-options` requires that all resources are
+served with the `X-Content-Type-Options: nosniff`
 HTTP response header.
 
 ## Why is this important?
@@ -29,19 +29,19 @@ header is sent for the script and the browser detects that it’s a script
 and it wasn’t served with one of the [JavaScript media types][javascript
 media types], the script will be blocked.
 
-Note: [Modern browsers only respect the header for scripts and
-stylesheets][fetch spec blocking] and sending the header for other
-resources (such as images) when they are served with the wrong media
-type may [create problems in older browsers][fetch spec issue].
+While [modern browsers respect the header mainly for scripts and
+stylesheets][fetch spec blocking], [Chromium uses this response header on
+other resources][chromium ssca] for
+[Cross-Origin Read Blocking][chromium corb].
 
 ## What does the hint check?
 
-The hint checks if all scripts and stylesheets are served with the
+The hint checks if all resources are served with the
 `X-Content-Type-Options` HTTP headers with the value of `nosniff`.
 
 ### Examples that **trigger** the hint
 
-Resource that is not script or stylesheet is served with the
+Resource is not served with the
 `X-Content-Type-Options` HTTP header.
 
 ```text
@@ -50,7 +50,6 @@ HTTP/... 200 OK
 ...
 
 Content-Type: image/png
-X-Content-Type-Options: nosniff
 ```
 
 Script is served with the `X-Content-Type-Options` HTTP header
@@ -116,6 +115,8 @@ And then activate it via the [`.hintrc`][hintrc] configuration file:
 <!-- Link labels: -->
 
 [fetch spec blocking]: https://fetch.spec.whatwg.org/#should-response-to-request-be-blocked-due-to-nosniff%3F
+[chromium ssca]: https://www.chromium.org/Home/chromium-security/ssca
+[chromium corb]: https://chromium.googlesource.com/chromium/src/+/master/services/network/cross_origin_read_blocking_explainer.md
 [fetch spec issue]: https://github.com/whatwg/fetch/issues/395
 [javascript media types]: https://html.spec.whatwg.org/multipage/scripting.html#javascript-mime-type
 [mime sniffing spec]: https://mimesniff.spec.whatwg.org/
diff --git a/packages/hint-x-content-type-options/src/hint.ts b/packages/hint-x-content-type-options/src/hint.ts
@@ -10,7 +10,7 @@
  */
 
 import { debug as d } from 'hint/dist/src/lib/utils/debug';
-import { IAsyncHTMLElement, FetchEnd, IHint } from 'hint/dist/src/lib/types';
+import { FetchEnd, IHint } from 'hint/dist/src/lib/types';
 import normalizeString from 'hint/dist/src/lib/utils/misc/normalize-string';
 import isDataURI from 'hint/dist/src/lib/utils/network/is-data-uri';
 import { HintContext } from 'hint/dist/src/lib/hint-context';
@@ -28,36 +28,6 @@ export default class XContentTypeOptionsHint implements IHint {
 
     public static readonly meta = meta;
     public constructor(context: HintContext) {
-
-        const isHeaderRequired = (element: IAsyncHTMLElement | null): boolean => {
-            if (!element) {
-                return false;
-            }
-
-            const nodeName = normalizeString(element.nodeName);
-
-            /*
-             * See:
-             *
-             *  * https://github.com/whatwg/fetch/issues/395
-             *  * https://fetch.spec.whatwg.org/#x-content-type-options-header
-             */
-
-            if (nodeName === 'script') {
-                return true;
-
-            }
-
-            if (nodeName === 'link') {
-                // We check if element exists before and `normalizeString` will return `''` as default
-                const relValues = (normalizeString(element.getAttribute('rel'), ''))!.split(' ');
-
-                return relValues.includes('stylesheet');
-            }
-
-            return false;
-        };
-
         const validate = async ({ element, resource, response }: FetchEnd) => {
             // This check does not make sense for data URI.
 
@@ -69,25 +39,19 @@ export default class XContentTypeOptionsHint implements IHint {
 
             const headerValue: string | null = normalizeString(response.headers && response.headers['x-content-type-options']);
 
-            if (isHeaderRequired(element)) {
-                if (headerValue === null) {
-                    await context.report(resource, `Response should include 'x-content-type-options' header.`, { element });
+            if (headerValue === null) {
+                await context.report(resource, `Response should include 'x-content-type-options' header.`, { element });
 
-                    return;
-                }
-
-                if (headerValue !== 'nosniff') {
-                    await context.report(resource, `'x-content-type-options' header value should be 'nosniff', not '${headerValue}'.`, { element });
+                return;
+            }
 
-                    return;
-                }
+            if (headerValue !== 'nosniff') {
+                await context.report(resource, `'x-content-type-options' header value should be 'nosniff', not '${headerValue}'.`, { element });
 
                 return;
             }
 
-            if (headerValue) {
-                await context.report(resource, `Response should not include unneeded 'x-content-type-options' header.`, { element });
-            }
+            return;
         };
 
         context.on('fetch::end::*', validate);
diff --git a/packages/hint-x-content-type-options/tests/tests.ts b/packages/hint-x-content-type-options/tests/tests.ts
@@ -3,19 +3,18 @@ import { getHintPath } from 'hint/dist/src/lib/utils/hint-helpers';
 import { HintTest } from '@hint/utils-tests-helpers/dist/src/hint-test-type';
 import * as hintRunner from '@hint/utils-tests-helpers/dist/src/hint-runner';
 
-// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
-
 // Page data.
 
 const pageWithAlternateStylesheet = generateHTMLPage('<link rel="  alternate stylesheet " href="test.css">');
 const pageWithScript = generateHTMLPage(undefined, '<script src="test.js"></script>');
+const pageWithScriptAndStylesheet = generateHTMLPage('<link rel="stylesheet" href="test.css">', '<script src="test.js"></script>');
 const pageWithStylesheet = generateHTMLPage('<link rel="stylesheet" href="test.css">');
 
+// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
+
 // Error messages.
 
 const noHeaderErrorMessage = `Response should include 'x-content-type-options' header.`;
-const unneededHeaderErrorMessage = `Response should not include unneeded 'x-content-type-options' header.`;
-
 const generateInvalidValueMessage = (value: string = '') => {
     return `'x-content-type-options' header value should be 'nosniff', not '${value}'.`;
 };
@@ -27,48 +26,60 @@ const generateInvalidValueMessage = (value: string = '') => {
 const tests: HintTest[] = [
     {
         name: `HTML page is served without 'X-Content-Type-Options' header`,
-        serverConfig: { '/': '' }
+        reports: [{ message: noHeaderErrorMessage }],
+        serverConfig: {
+            '/': { content: generateHTMLPage() },
+            '/favicon.ico': { headers: { 'X-Content-Type-Options': 'nosniff' } }
+        }
     },
     {
-        name: `Script is served without 'X-Content-Type-Options' header`,
+        name: `Favicon is served without 'X-Content-Type-Options' header`,
         reports: [{ message: noHeaderErrorMessage }],
         serverConfig: {
-            '/': pageWithScript,
-            '/test.js': ''
+            '/': { content: generateHTMLPage(), headers: { 'Content-Type': 'text/html', 'X-Content-Type-Options': 'nosniff' } },
+            '/favicon.ico': ''
         }
     },
     {
         name: `Stylesheet is served without 'X-Content-Type-Options' header`,
         reports: [{ message: noHeaderErrorMessage }],
         serverConfig: {
-            '/': pageWithStylesheet,
+            '/': { content: pageWithStylesheet, headers: { 'Content-Type': 'text/html', 'X-Content-Type-Options': 'nosniff' } },
+            '/favicon.ico': { headers: { 'X-Content-Type-Options': 'nosniff' } },
             '/test.css': ''
         }
     },
     {
         name: `Alternate stylesheet is served without 'X-Content-Type-Options' header`,
         reports: [{ message: noHeaderErrorMessage }],
         serverConfig: {
-            '/': pageWithAlternateStylesheet,
+            '/': { content: pageWithAlternateStylesheet, headers: { 'Content-Type': 'text/html', 'X-Content-Type-Options': 'nosniff' } },
+            '/favicon.ico': { headers: { 'X-Content-Type-Options': 'nosniff' } },
             '/test.css': ''
         }
     },
     {
         name: `Resource is specified as a data URI`,
-        serverConfig: { '/': generateHTMLPage(undefined, '<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAACklEQVR4nGMAAQAABQABDQottAAAAABJRU5ErkJggg==">') }
-    },
-    {
-        name: `HTML page is served with the 'X-Content-Type-Options' header`,
-        reports: [{ message: unneededHeaderErrorMessage }],
-        serverConfig: { '/': { headers: { 'X-Content-Type-Options': 'nosniff' } } }
+        serverConfig: {
+            '/': {
+                content: generateHTMLPage(undefined, '<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAACklEQVR4nGMAAQAABQABDQottAAAAABJRU5ErkJggg==">'),
+                headers: { 'X-Content-Type-Options': 'nosniff' }
+            },
+            '/favicon.ico': { headers: { 'X-Content-Type-Options': 'nosniff' } }
+        }
     },
     {
         name: `Script is served with 'X-Content-Type-Options' header with invalid value`,
         reports: [{ message: generateInvalidValueMessage('invalid') }],
         serverConfig: {
-            '/': pageWithScript,
+            '/': { content: pageWithScript, headers: { 'Content-Type': 'text/html', 'X-Content-Type-Options': 'nosniff' } },
+            '/favicon.ico': { headers: { 'X-Content-Type-Options': 'nosniff' } },
             '/test.js': { headers: { 'X-Content-Type-Options': 'invalid' } }
         }
+    },
+    {
+        name: `All resources are served with 'X-Content-Type-Options' header`,
+        serverConfig: { '*': { content: pageWithScriptAndStylesheet, headers: { 'Content-Type': 'text/html', 'X-Content-Type-Options': 'nosniff' } } }
     }
 ];
 
