[wp-trac] [WordPress Trac] #51407: Remove inline event handlers and JavaScript URIs for Strict CSP-compatibility

[WordPress Trac]

#51407: Remove inline event handlers and JavaScript URIs for Strict CSP-
compatibility
---------------------------+-----------------------------------
 Reporter:  enricocarraro  |      Owner:  (none)
     Type:  enhancement    |     Status:  new
 Priority:  normal         |  Milestone:  Awaiting Review
Component:  Security       |    Version:  trunk
 Severity:  normal         |   Keywords:  has-patch 2nd-opinion
  Focuses:  javascript     |
---------------------------+-----------------------------------
 Content Security Policy is a mechanism designed to make applications more
 secure against common web vulnerabilities, particularly cross-site
 scripting. It is enabled by setting the Content-Security-Policy HTTP
 response header.
 An application can add a critical defense-in-depth layer against markup
 injection attacks by adopting a strict policy that prevents the loading of
 untrusted scripts or plugins.
 A basic policy (nonce + strict-dynamic + unsafe-eval) would block more
 than [https://speakerdeck.com/lweichselbaum/csp-a-successful-mess-between-
 hardening-and-mitigation?slide=16 40%] of the XSS sinks.

 To make an application compatible with strict CSP, it is necessary to make
 changes to HTML templates and client-side code and add the policy header:
 1. Add nonces to <script> elements
 2. Refactor inline event handlers and javascript: URIs
 3. Refactor calls to JS APIs incompatible with CSP
 4. Serve the Content-Security-Policy header

 [https://csp.withgoogle.com/ More on CSP].

 Since these PRs are quite significant, I separated the one regarding
 script nonces (#39941) and the one on inline event handlers and JavaScript
 URIs to facilitate code reviews.
 This patch builds on top of [https://github.com/WordPress/wordpress-
 develop/pull/498 this one] (use [https://github.com/enricocarraro
 /wordpress-
 develop/compare/inline_script_using_inline_js_function...inline_event_handlers_refactoring
 this] link to compare the two branches easily); I introduced some new
 JavaScript files where I moved inline event handlers and JavaScript URIs
 to, in particular:
 * src/js/_enqueues/admin/link-manager.js: handles link deletion
 confirmation;
 * src/js/_enqueues/admin/media-events.js: events related to the media
 library and media details;
 * src/js/_enqueues/admin/setup-config.js: event handler for try again
 button;
 * src/js/_enqueues/admin/themes-list.js: theme deletion confirm event
 handler;
 * src/js/_enqueues/lib/metabox-events.js: event handlers for various meta
 boxes.

 I also moved various event handlers to already existing JavaScript files.
 In some cases, I couldn't move the inline event handlers to a file because
 'user-defined' ajax calls could load the generated HTML, so I moved them
 to an inline script.

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/51407>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform