Cannot enqueue CSS and JS asset with the same handle

[johnbillion]

In the WordPress world it's possible for a CSS dependency and a JS dependency to share the same handle. When using Asset Loader, this works fine for a production build but not when using webpack-dev-server during dev.

It appears that the latterly registered dependency gets skipped completely. In the example below, the main.js file gets enqueued but the style.css file does not.

\Asset_Loader\enqueue_asset(
	plugin_dir_path( __DIR__ ) . 'build/asset-manifest.json',
	'main.js',
	[
		'handle' => 'hello-world',
	]
);
\Asset_Loader\enqueue_asset(
	plugin_dir_path( __DIR__ ) . 'build/asset-manifest.json',
	'style.css',
	[
		'handle' => 'hello-world',
	]
);

May be related to #27

[kadamwhite]

@johnbillion Sorry for the delay on this. Conversely to #27, I'd expect this to be the only way this would work as expected.

Can you confirm that your issue here is describing a production build? It's a long shot, but in a development build no CSS file will be output and so the only enqueue would be the main.js, which would include logic to inject the CSS. I am guessing that's not what you're experiencing, but this is a surprise to me so i want to rule out the quick "gotcha".

[kadamwhite]

Whoops, I just figured this out – the issue was not that the handle is the same, it is that the handle is the same and the script entry point (bundle name) is different. They can either both be the same, or should both be different, but if one is the same and one is not that is where the issue was coming from. I've been trying to figure out whether there is a more sustainable way to fix this bug long term, but I haven't come up with anything that wouldn't add too much complexity so I think we're just gonna throw a warning in the future.