After version 5.78.0, module rules don't seem to apply to resource assets added by a plugin

[ezzatron]

Bug report

What is the current behavior?

As of version 5.77.0, my Webpack plugin was working, but after upgrading to Webpack 5.78.0, with the same Webpack config, it suddenly broke, and Webpack builds produce a loader error like:

[webpack-cli] Error: Child compilation failed:
Module parse failed: Unexpected token (1:0)
File was processed with these loaders:
 * ../../../src/loader/browser-config.js
You may need an additional loader to handle the result of these loaders.
> <?xml version="1.0" encoding="utf-8"?><browserconfig><msapplication><tile><TileColor>#D5415C</TileColor><square70x70logo src="windows-tile-140x140.4ea90b233f275740f1be.png"/><square150x150logo src="windows-tile-300x300.583170e9c7187396bd19.png"/><square310x310logo src="windows-tile-620x620.6901e2a2aa9eec520db4.png"/><wide310x150logo src="windows-tile-620x300.35ee4cc5a0623f8ddb18.png"/></tile></msapplication></browserconfig>:
SyntaxError: Unexpected token (1:0)
Module parse failed: Unexpected token (1:19)
File was processed with these loaders:
 * ../../../src/loader/web-manifest.js
You may need an additional loader to handle the result of these loaders.
> {"background_color":"#D5415C","description":"A build system for web application icon and image assets","display":"standalone","icons":[{"sizes":"1024x1024","src":"web-app-icon-masked-1024x1024.977f0131906d6dbb3ed4.png","type":"image/png"},{"sizes":"512x512","src":"web-app-icon-masked-512x512.c5c0291479056f764d01.png","type":"image/png"},{"sizes":"192x192","src":"web-app-icon-masked-192x192.afde9fac71fdd382c9b8.png","type":"image/png"},{"purpose":"maskable","sizes":"1024x1024","src":"web-app-icon-maskable-1024x1024.21684f043d33aac811f6.png","type":"image/png"},{"purpose":"maskable","sizes":"512x512","src":"web-app-icon-maskable-512x512.fbb222c8ca0221ced8a6.png","type":"image/png"},{"purpose":"maskable","sizes":"192x192","src":"web-app-icon-maskable-192x192.d53570717a45888030c6.png","type":"image/png"}],"lang":"en-US","name":"Iconduit","related_applications":[{"id":"915056765","platform":"itunes","url":"https://itunes.apple.com/app/id915056765"},{"id":"com.google.android.apps.maps","platform":"play","url":"https://play.google.com/store/apps/details?id=com.google.android.apps.maps"},{"id":"9wzdncrdtbvb","platform":"windows","url":"https://microsoft.com/p/app/9wzdncrdtbvb"}],"short_name":"Iconduit","start_url":".","theme_color":"#D5415C"}:
SyntaxError: Unexpected token (1:19)
    at handleMake (/Users/erin/grit/github.com/iconduit/html-webpack-plugin/src/index.js:126:15)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)

I've looked through the release notes for that version, but I can't see anything that could explain this breakage.

If the current behavior is a bug, please provide the steps to reproduce.

I've created a simple reproduction in the plugin repo:

• git clone git@github.com:iconduit/html-webpack-plugin.git
• cd html-webpack-plugin
• git switch webpack-5-78-repro
• npm ci
• cd test/integration/simple
• npx webpack

You can also reproduce the (working) behavior under 5.77.0 by using the webpack-5-77-repro branch:

• git clone git@github.com:iconduit/html-webpack-plugin.git
• cd html-webpack-plugin
• git switch webpack-5-77-repro
• npm ci
• cd test/integration/simple
• npx webpack

I've also verified that problem is reproducible under GitHub Actions. See these workflow runs for working and non-working results:

• https://github.com/iconduit/html-webpack-plugin/actions/runs/6516561925/job/17700204695#step:5:10 (not working under 5.78.0)
• https://github.com/iconduit/html-webpack-plugin/actions/runs/6516564935/job/17700211008#step:5:10 (working under 5.77.0)

My Webpack config is pretty simple:

const HtmlPlugin = require("html-webpack-plugin");
const IconduitHtmlPlugin = require("../../../src/index.js");

module.exports = {
  mode: "development",
  plugins: [
    new HtmlPlugin(),
    new IconduitHtmlPlugin({
      manifestPath: "./src/assets/site.iconduitmanifest",
    }),
  ],
  module: {
    rules: [
      {
        test: /\.(png|svg|xml|webmanifest)$/,
        type: "asset/resource",
      },
    ],
  },
  output: {
    assetModuleFilename: "[name].[contenthash][ext][query]",
  },
};

What I think is happening, is that my plugin is adding a .xml and .webmanifest asset to the build, but despite the above module rules that should match these and mark them as asset/resource, the rules are ignored for some reason.

It's also completely possible that I'm doing something the wrong way in my plugin. Any help would be greatly appreciated 🙏

What is the expected behavior?

The Webpack build should succeed. In particular, it seems like the rules section of the Webpack config is being ignored for assets that are emitted by the plugin.

Other relevant information:
webpack version: v5.78.0
Node.js version: v20.8.0
Operating System: N/A
Additional tools: N/A

[thecontstruct]

@ezzatron This sounds VERY much like what we've been experiencing. The problem only showed up for us in watch mode for the recompilations, the first build never reports any issues. It also doesn't break anything for us which is also super weird. I tracked it down to a specific PR and file/line change but I didn't know enough about how that part of the system worked to really know where to start fixing it.

If you try removing the mentioned lines with the latest version, report back if it's the same culprit 🤞

[ezzatron]

@thecontstruct Thanks for the tip. I can confirm that commenting out these lines in the latest Webpack release fixes my issue too.

[alexander-akait]

Sounds like a small bug, we need improve our checks, do you want to send a PR?

[ezzatron]

@alexander-akait I could probably get together a PR, but I'm not confident I could fix the issue without introducing a regression for #16466. Any advice on what that section of the code should actually do?

If nothing else I could at least submit a PR with a test that highlights the issue.

[alexander-akait]

@ezzatron

If nothing else I could at least submit a PR with a test that highlights the issue.

Let's do it and will try to optimize our if

[ezzatron]

Took me a while, but I managed to get a repro together in #18065 🎉

[webpack-bot]

This issue had no activity for at least three months.

It's subject to automatic issue closing if there is no activity in the next 15 days.

[ezzatron]

This is still an issue. It needs someone with more knowledge of the Webpack internals to look at #18065, which is an isolated test case reproducing the issue.