I want to show what scripts and styles have loaded on a page and which plugin / theme / file has added them to the page.
We can show all scripts and styles using:
<?php
global $wp_scripts, $wp_styles;
var_dump( $wp_scripts );
var_dump( $wp_styles );
?>
Or more elegantly using this answer: How do I get the $handle for all enqueued scripts?
I now want to be able to see where they were enqueued. For example if I had a JS file called foobar.js and it was enqueued by plugins/organge/orange.php I would want to output this file location along with the script.
This is for development to help isolate what is loading what.
This is not possible the way you think. It would maybe be possible if you use Reflections or debug_backtrace(), but there’s no reliable way to do this. WordPress does not keep a stack or queue where it tracks file names.
The only thing I could imagine is just hooking into the action and inside wp_enqueue_scripts():
wp_enqueue_scripts
and attach a tracking mechanism of attached callbacks there. Note the s and that this is not the function that you use to attach scripts to the stack.
<?php
/** Plugin Name: (WPSE #152658) Script Loader Callback Inspector */
add_action( 'wp_enqueue_scripts', function()
{
var_dump( $GLOBALS['wp_filter'][ current_filter() ] );
}, PHP_INT_MAX -1 );
This would leave you with a queue of all attached callbacks. You can then trace them back with your IDE.
