1310875 - CSP violation logging in dev tools console is unhelpful

Status: NEW

(Core :: DOM: Security, defect, P3)

Description

[ce]

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.12; rv:50.0) Gecko/20100101 Firefox/50.0
Build ID: 20161003155957

Steps to reproduce:

1. Trigger a CSP violation.


Actual results:

Output in Firefox's dev tools console is almost comically unhelpful. Here is what it says:

> Content Security Policy: The page's settings blocked the loading of a resource at self ("style-src http://example.com").

It's *slightly* improved in Nightly, but not in a way that seems very useful in practice:

> Content Security Policy: The page’s settings blocked the loading of a resource at self (“style-src http://example.com”). Source: position:absolute; left: -1000px; top: -....

That's it. There is no other information. The source of the message is the page you're viewing, not the file that actually triggered it.


Expected results:

The message in Chrome's dev tools, on the other hand, is extraordinarily detailed. Here's what their console shows for the exact same violation:

> jquery-1.12.4.min.js:4 Refused to apply inline style because it violates the following Content Security Policy directive: "style-src 'self'". Either the 'unsafe-inline' keyword, a hash ('sha256-uZYCUbnuTBvKqtWfCNvzCsrs8s0vQFgIZRTzfJAQm8M='), or a nonce ('nonce-...') is required to enable inline execution.
>
> attr                 @ jquery-1.12.4.min.js:4
> Y                    @ jquery-1.12.4.min.js:3
> attr                 @ jquery-1.12.4.min.js:4
> n.fn.init            @ jquery-1.12.4.min.js:2
> n                    @ jquery-1.12.4.min.js:2
> Chosen.set_up_html   @ chosen.jquery.min.js:2
> AbstractChosen       @ chosen.jquery.min.js:2
> Chosen               @ chosen.jquery.min.js:2
> (anonymous function) @ chosen.jquery.min.js:2
> each                 @ jquery-1.12.4.min.js:2
> each                 @ jquery-1.12.4.min.js:2
> chosen               @ chosen.jquery.min.js:2
> (anonymous function) @ custom.js:256
> i                    @ jquery-1.12.4.min.js:2
> fireWith             @ jquery-1.12.4.min.js:2
> ready                @ jquery-1.12.4.min.js:2
> K                    @ jquery-1.12.4.min.js:2

Not only does it tell you what file triggered it, it gives you a complete trace of all the function calls that led to it. It even provides advice regarding how you can fix it. (In this case, a JavaScript library called Chosen is trying to use jQuery to directly manipulate an element's style attribute.)

I found several bugs related to improving this output (#600584, #879316, #712859, #770099), but unfortunately it's still lacking.

I do understand that Firefox has the report-uri mechanism which can help with this kind of issue, but i don't feel like one should have to set up a separate HTTP server for this. Judging by the example report on MDN, i don't think it would actually have helped in this case even if i had, because the source of this problem was buried two libraries deep.

Attached: Screen-shots of the dev tools output from Chrome and Firefox (50).

Comment 1

[ce]

Attachment: Firefox 50 dev tools output

Comment 2

[ce]

Attachment: Chrome dev tools output

Comment 3

[Christoph Kerschbaumer [:ckerschb]]

We are working on improving our CSP console messages. Thanks for filing the bug. Will link that to the master Bug 1242016.

Comment 4

[:Harald Kirschner :digitarald]

Attachment: image.png

:baku, that keeps coming up from various sides and causes users to switch to Chrome

Comment 5

[:Harald Kirschner :digitarald]

Forgot to frame my specific ask: Who from the platform side could help to expose right details. This also fits into current grouping work we are doing; where we want to split the log messages from their meta data.

Comment 6

[:Harald Kirschner :digitarald]

Wennie, we wanted to invest in CSP messages and expose them to the console grouping feature. It would be great to have them also improved on the platform side by including additional details to make them more actionable.

Comment 7

[Wennie]

Do you have a timeline on this? Christoph would be the best developer to work with you on this.

Comment 8

[:Harald Kirschner :digitarald]

Initial console grouping work is happening in bug 1522396 and is targetting 68. Grouping CSP would follow in 69. Part of the work will be changing the log format for groupable messages, splitting them in the message as template and the parameters; which the work in this bug should consider.

Comment 9

[Christoph Kerschbaumer [:ckerschb]]

(In reply to :Harald Kirschner :digitarald from comment #5)

Forgot to frame my specific ask: Who from the platform side could help to expose right details. This also fits into current grouping work we are doing; where we want to split the log messages from their meta data.

Harald, what platform support is needed here in detail?

Comment 10

[:Harald Kirschner :digitarald]

This bug would be mostly about including more specifics about the directive that caused the violation:

https://docs.google.com/document/d/1wVN51w_NGBVgMAs8ebv1Zmrg0n4hx535ZN-zha2X5SY/edit#heading=h.b524rsnua7fz

Comment 11

[Robert Rothenberg]

The CSP message has not improved.

Comment 12

[Ari]

I'd really like to see this improved. Is it possible for an extension to offer a more helpful message?