WordPress.org

Make WordPress Core

Opened 11 months ago

Last modified 2 months ago

#51325 new enhancement

Add a filter for script/style tags injected by wp_add_inline_{script|style}

Reported by: pjohanneson Owned by:
Milestone: Future Release Priority: normal
Severity: normal Version:
Component: Script Loader Keywords: needs-refresh
Focuses: Cc:

Description

In attempting to write a Content Security Policy for my WordPress site, I've run into issues with WordPress loading a few inline scripts and styles. I would like to be able to add a CSP nonce to each of the <script> and <style> tags, ideally with a WordPress filter. However, the tags appear to have no filters associated with them.

Something similar to the filters script_loader_tag and style_loader_tag (which I'm already using in my CSP attempts) would be very handy.

Attachments (3)

51325.diff (2.2 KB) - added by GeekPress 6 months ago.
51325.2.diff (2.2 KB) - added by GeekPress 6 months ago.
Update @since to 5.8
51325.3.diff (2.2 KB) - added by GeekPress 6 months ago.
Update @since to 5.8

Download all attachments as: .zip

Change History (10)

#1 @SergeyBiryukov
10 months ago

  • Component changed from General to Script Loader

#2 @GeekPress
6 months ago

Hi there 🤚

I've added a patch to add 3 new hooks:

  • inline_script_before_loader_tag
  • inline_script_after_loader_tag
  • inline_style_loader_tag

I have voluntarily added the hooks before to be printed into the do_item functions.

Why?
We would be able to make some updates on the script/style tag AND the content.

Here some usages of the hooks:

1. Add a custom attribute on the inline script tag

function do_not_optimize_jquery_inline_scripts( $before_handle_tag, $handle ) {
	if ( 'jquery-core' === $handle ) {
		$before_handle_tag = str_replace( '<script', '<script data-no-optimize="1"', $before_handle_tag );
	}
	return $before_handle_tag;
}
add_filter( 'inline_script_before_loader_tag', 'do_not_optimize_jquery_inline_scripts', 10, 2 );

2- Wrap the content of the inline scripts:

function fix_jquery_render_blocking_inline_scripts( $before_handle_tag, $handle ) {
	if ( 'jquery-core' === $handle ) {
		$before_handle_tag = preg_replace(
			'#<script.*>(.*)</script>#Usmi',
			'window.addEventListener(\'DOMContentLoaded\', function() {$1});',
			$before_handle_tag
		);
	}
	return $before_handle_tag;
}
add_filter( 'inline_script_before_loader_tag', 'fix_jquery_render_blocking_inline_scripts', 10, 2 );

@GeekPress
6 months ago

#3 @audrasjb
6 months ago

  • Keywords has-patch needs-refresh added
  • Milestone changed from Awaiting Review to 5.8

Thanks for the ticket and welcome to WordPress Core Trac @pjohanneson!

Also, thanks for the patch @geekpress, this looks like a nice enhancement to me.

Moving for 5.8 consideration.

(adding has-patch / needs-refresh workflow keywords, to make sure the @since tags are refreshed)

Last edited 6 months ago by audrasjb (previous) (diff)

@GeekPress
6 months ago

Update @since to 5.8

#4 @GeekPress
6 months ago

@audrasjb I've updated the @since to 5.8 in the diff file.

@GeekPress
6 months ago

Update @since to 5.8

#5 @GeekPress
6 months ago

Sorry, I did a mistake on 51325.2.diff, this attachment can be deleted.

#6 @Clorith
3 months ago

  • Keywords has-patch needs-refresh removed

Thank you for refreshing the patch for 5.8.0.

In looking over, your choice to add these filters in the do_action functions might not be enough, you may instead need to add it inside WP_Scripts::print_inline_script and WP_Styles::print_inline_style.

A quick look shows that a few plugins and themes at least do call these functions directly, so anyone implementing the new filters would likely expect their adjustments to work in those cases as well.

For reference: plugins calling `print_inline_script`, plugins calling `print_inline_style`, themes calling `print_inline_script`, themes calling `print_inline_style`.

#7 @desrosj
2 months ago

  • Keywords needs-refresh added
  • Milestone changed from 5.8 to Future Release

Today is the feature freeze for 5.8. Since this needs a bit of attention to address the feedback above, I'm going to punt to Future Release. It can be moved back to a numbered milestone when someone is able to give it some attention.

Note: See TracTickets for help on using tickets.