Skip to content

refactor(html): drive html dependency extraction by source type#21250

Merged
alexander-akait merged 1 commit into
mainfrom
refactor/html-parser-type-driven
Jun 23, 2026
Merged

refactor(html): drive html dependency extraction by source type#21250
alexander-akait merged 1 commit into
mainfrom
refactor/html-parser-type-driven

Conversation

@alexander-akait

Copy link
Copy Markdown
Member

Summary

The HTML parser previously special-cased <style> elements, style="" attributes, SVG presentation attributes, inline <script> bodies, and per-tag attributes with separate hardcoded blocks. This refactors all of it to be driven by a single source type: one switch (type) resolves the parse algorithm and the dependency kind for every attribute value and element body, so adding a tag/attribute is just a table entry. All sources (per-tag, any-tag, SVG presentation, the style="" attribute, and <style>/<script> bodies) live in one source object that developers can extend via module.parser.html.sources.

A new public css-url source type falls out of this: it extracts url(...) references from a CSS-valued attribute (e.g. an SVG fill) as plain assets — the built-in SVG presentation handling now flows through it. Behavior is otherwise unchanged.

What kind of change does this PR introduce?

refactor (also exposes a new css-url source type)

Did you add tests for your changes?

Yes — extended test/configCases/html/parser-sources-types (new css-url type and an any-tag source with no tag) and updated test/configCases/html/parser-sources-filter. The existing svg-presentation-url, style-tag, style-attribute, inline-script, script-src, link, … cases (710 html config + cache tests, 118 snapshots) cover the refactored paths unchanged.

Does this PR introduce a breaking change?

No. The sources[].filter signature is extended backward-compatibly: it now receives (attributes, value)attributes (the decoded attribute map) stays the first argument, so existing (attributes) => … filters keep working; value (the decoded attribute value) is an added second argument.

If relevant, what needs to be documented once your changes are merged or what have you already documented?

The new module.parser.html.sources[].type: "css-url" value, and the added value second argument to sources[].filter. The option schema descriptions in schemas/WebpackOptions.json are already updated.

Use of AI

AI (Claude Code) was used to perform the refactor, write tests, and regenerate the type declarations, under human direction and review. All changes were verified locally (targeted html test suites, tsc, ESLint, Prettier, cspell).


Generated by Claude Code

@changeset-bot

changeset-bot Bot commented Jun 22, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: ab200ac

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
webpack Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@github-actions

github-actions Bot commented Jun 22, 2026

Copy link
Copy Markdown
Contributor

This PR is packaged and the instant preview is available (c1dec16).

Install it locally:

  • npm
npm i -D webpack@https://pkg.pr.new/webpack@c1dec16
  • yarn
yarn add -D webpack@https://pkg.pr.new/webpack@c1dec16
  • pnpm
pnpm add -D webpack@https://pkg.pr.new/webpack@c1dec16

@codecov

codecov Bot commented Jun 22, 2026

Copy link
Copy Markdown

Codecov Report

❌ Patch coverage is 99.41520% with 2 lines in your changes missing coverage. Please review.
✅ Project coverage is 92.80%. Comparing base (2e43eb4) to head (ab200ac).

Files with missing lines Patch % Lines
lib/dependencies/HtmlEntryDependency.js 87.50% 1 Missing ⚠️
lib/html/syntax.js 99.20% 1 Missing ⚠️
Additional details and impacted files
@@           Coverage Diff           @@
##             main   #21250   +/-   ##
=======================================
  Coverage   92.80%   92.80%           
=======================================
  Files         590      590           
  Lines       64647    64626   -21     
  Branches    17993    17996    +3     
=======================================
- Hits        59996    59979   -17     
+ Misses       4651     4647    -4     
Flag Coverage Δ
css-parsing 28.70% <ø> (ø)
html5lib 31.17% <14.95%> (+0.05%) ⬆️
integration 88.94% <99.12%> (+0.01%) ⬆️
test262 45.39% <ø> (ø)
unit 41.41% <55.71%> (+0.02%) ⬆️

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

Comment thread lib/html/HtmlParser.js Fixed
@alexander-akait alexander-akait force-pushed the refactor/html-parser-type-driven branch from ac0ce14 to 4125366 Compare June 22, 2026 20:11
@codspeed-hq

codspeed-hq Bot commented Jun 22, 2026

Copy link
Copy Markdown

Merging this PR will improve performance by 76.97%

⚠️ Different runtime environments detected

Some benchmarks with significant performance changes were compared across different runtime environments,
which may affect the accuracy of the results.

Open the report in CodSpeed to investigate

⚡ 5 improved benchmarks
❌ 1 regressed benchmark
✅ 138 untouched benchmarks

Warning

Please fix the performance issues or acknowledge them on CodSpeed.

Performance Changes

Mode Benchmark BASE HEAD Efficiency
Memory benchmark "wasm-modules-sync", scenario '{"name":"mode-development-rebuild","mode":"development","watch":true}' 254.5 KB 352.6 KB -27.84%
Memory benchmark "lodash", scenario '{"name":"mode-development-rebuild","mode":"development","watch":true}' 850.9 KB 127 KB ×6.7
Memory benchmark "asset-modules-bytes", scenario '{"name":"mode-development-rebuild","mode":"development","watch":true}' 859.2 KB 246.6 KB ×3.5
Memory benchmark "css-modules", scenario '{"name":"mode-production","mode":"production"}' 9 MB 7.2 MB +25.5%
Memory benchmark "many-chunks-esm", scenario '{"name":"mode-production","mode":"production"}' 9.3 MB 7.7 MB +20.61%
Memory benchmark "future-defaults", scenario '{"name":"mode-production","mode":"production"}' 8.8 MB 7.3 MB +20.45%

Tip

Investigate this regression by commenting @codspeedbot fix this regression on this PR, or directly use the CodSpeed MCP with your agent.


Comparing refactor/html-parser-type-driven (ab200ac) with main (2e43eb4)

Open in CodSpeed

@alexander-akait alexander-akait force-pushed the refactor/html-parser-type-driven branch 2 times, most recently from 1b5b02f to f10c898 Compare June 23, 2026 07:18
Replace the hardcoded `<style>` element, `style=""` attribute, SVG
presentation-attribute, inline `<script>` and per-tag attribute branches
in the html parser with a single `switch (type)`: a resolved `SourceType`
selects the parse algorithm and the dependency kind. No tag-name or
attribute-name special cases remain in the dispatch.

Add the public `css-url` source type (extracts `url(...)` references from
a CSS-valued attribute, e.g. SVG `fill`); SVG presentation attributes now
flow through it. Inline `<style>`/`<script>` bodies become table-driven
content sources, and `meta` `content` resolves the msapplication-task
parser via its type instead of a tag-name check.
@alexander-akait alexander-akait force-pushed the refactor/html-parser-type-driven branch from f10c898 to ab200ac Compare June 23, 2026 07:35
@github-actions

Copy link
Copy Markdown
Contributor

Types Coverage

Coverage after merging refactor/html-parser-type-driven into main will be
99.35%
Coverage Report
FileStmtsBranchesFuncsLinesUncovered Lines
bin
   webpack.js98.77%100%100%98.77%91
examples
   build-common.js100%100%100%100%
   buildAll.js100%100%100%100%
   examples.js100%100%100%100%
   template-common.js98.21%100%100%98.21%72
examples/custom-javascript-parser
   test.filter.js100%100%100%100%
examples/custom-javascript-parser/internals
   acorn-parse.js100%100%100%100%
   meriyah-parse.js100%100%100%100%
   oxc-parse.js91.30%100%100%91.30%140, 142–143, 145, 147, 153–154, 161, 168, 90
examples/markdown
   webpack.config.mjs100%100%100%100%
examples/typescript
   test.filter.js100%100%100%100%
examples/typescript-non-erasable
   test.filter.js50%100%100%50%5
examples/virtual-modules
   test.filter.js100%100%100%100%
examples/wasm-bindgen-esm
   test.filter.js100%100%100%100%
examples/wasm-complex
   test.filter.js100%100%100%100%
examples/wasm-emscripten
   test.filter.js100%100%100%100%
examples/wasm-simple
   test.filter.js100%100%100%100%
examples/wasm-simple-source-phase
   test.filter.js100%100%100%100%
lib
   APIPlugin.js100%100%100%100%
   AsyncDependenciesBlock.js100%100%100%100%
   AutomaticPrefetchPlugin.js100%100%100%100%
   BannerPlugin.js100%100%100%100%
   Cache.js98.21%100%100%98.21%101
   CacheFacade.js100%100%100%100%
   Chunk.js99.72%100%100%99.72%39
   ChunkGraph.js100%100%100%100%
   ChunkGroup.js100%100%100%100%
   ChunkTemplate.js100%100%100%100%
   CircularModulesPlugin.js98.73%100%100%98.73%128
   CleanPlugin.js99.15%100%100%99.15%207, 227
   CodeGenerationResults.js100%100%100%100%
   CompatibilityPlugin.js100%100%100%100%
   Compilation.js98.43%100%100%98.43%1618, 1937, 1944, 1952, 1974, 1977, 2917, 3396–3397, 3429, 4095, 4125, 4178–4179, 4183, 4188, 4204–4205, 4219–4220, 4225–4226, 4703, 4729, 514, 519, 5537, 5569, 5586, 5602, 5618, 5633, 5658–5659, 5661, 5989, 5994, 6000, 6003, 6015, 6017, 6021, 6037, 6052, 6084, 6138, 6162, 6276, 764–765
   Compiler.js99.56%100%100%99.56%1141–1142, 1150
   ConcatenationScope.js98.59%100%100%98.59%189
   ConditionalInitFragment.js100%100%100%100%
   ConstPlugin.js100%100%100%100%
   ContextExclusionPlugin.js100%100%100%100%
   ContextModule.js100%100%100%100%
   ContextModuleFactory.js97.40%100%100%97.40%258, 395, 418, 420, 424, 433–434
   ContextReplacementPlugin.js100%100%100%100%
   DefinePlugin.js99%100%100%99%171–172, 188, 207, 281
   DependenciesBlock.js100%100%100%100%
   Dependency.js98.50%100%100%98.50%470, 516
   DependencyTemplate.js100%100%100%100%
   DependencyTemplates.js100%100%100%100%
   DotenvPlugin.js98.41%100%100%98.41%378, 391–392
   DynamicEntryPlugin.js100%100%100%100%
   EntryOptionPlugin.js100%100%100%100%
   EntryPlugin.js100%100%100%100%
   Entrypoint.js100%100%100%100%
   EnvironmentPlugin.js97.14%100%100%97.14%49
   ErrorHelpers.js100%100%100%100%
   EvalDevToolModulePlugin.js100%100%100%100%
   EvalSourceMapDevToolPlugin.js100%100%100%100%
   ExportsInfo.js100%100%100%100%
   ExportsInfoApiPlugin.js100%100%100%100%
   ExternalModule.js98.50%100%100%98.50%1057, 1060, 445–449, 451, 597
   ExternalModuleFactoryPlugin.js100%100%100%100%
   ExternalsPlugin.js100%100%100%100%
   FileSystemInfo.js99.52%100%100%99.52%182, 2354–2355, 2358, 2369, 2380, 2391, 278, 3795, 3810, 3834
   FlagAllModulesAsUsedPlugin.js100%100%100%100%
   FlagDependencyExportsPlugin.js98.42%100%100%98.42%413, 422, 424, 428
   FlagDependencyUsagePlugin.js100%100%100%100%
   FlagEntryExportAsUsedPlugin.js100%100%100%100%
   Generator.js100%100%100%100%
   HotModuleReplacementPlugin.js100%100%100%100%
   HotUpdateChunk.js100%100%100%100%
   IgnorePlugin.js100%100%100%100%
   IgnoreWarningsPlugin.js100%100%100%100%
   InitFragment.js100%100%100%100%
   JavascriptMetaInfoPlugin.js100%100%100%100%
   LazyBarrel.js100%100%100%100%
   LibraryTemplatePlugin.js100%100%100%100%
   LoaderOptionsPlugin.js100%100%100%100%
   LoaderTargetPlugin.js100%100%100%100%
   MainTemplate.js100%100%100%100%
   ManifestPlugin.js100%100%100%100%
   Module.js98.50%100%100%98.50%1285, 1290, 1350, 1364, 1426, 1435
   ModuleFactory.js100%100%100%100%
   ModuleFilenameHelpers.js98.85%100%100%98.85%106, 108
   ModuleGraph.js99.73%100%100%99.73%1005
   ModuleGraphConnection.js100%100%100%100%
   ModuleInfoHeaderPlugin.js100%100%100%100%
   ModuleNotFoundError.js100%100%100%100%
   ModuleProfile.js100%100%100%100%
   ModuleSourceTypeConstants.js100%100%100%100%
   ModuleTemplate.js100%100%100%100%
   ModuleTypeConstants.js100%100%100%100%
   MultiCompiler.js99.69%100%100%99.69%659
   MultiStats.js100%100%100%100%
   MultiWatching.js100%100%100%100%
   NoEmitOnErrorsPlugin.js100%100%100%100%
   NodeStuffPlugin.js100%100%100%100%
   NormalModule.js97.90%100%100%97.90%1237, 1240, 1257, 1274, 1521, 1555, 1571, 1658, 2014, 2313, 2318–2328, 418, 422, 576
   NormalModuleFactory.js99.47%100%100%99.47%1083, 1392, 486, 498
   NormalModuleReplacementPlugin.js100%100%100%100%
   NullFactory.js100%100%100%100%
   OptimizationStages.js100%100%100%100%
   OptionsApply.js100%100%100%100%
   Parser.js100%100%100%100%
   PlatformPlugin.js100%100%100%100%
   PrefetchPlugin.js100%100%100%100%
   ProgressPlugin.js98.85%100%100%98.85%519–520, 525, 527, 591
   ProvidePlugin.js100%100%100%100%
   RawModule.js100%100%100%100%
   RecordIdsPlugin.js100%100%100%100%
   RequestShortener.js100%100%100%100%
   ResolverFactory.js100%100%100%100%
   RuntimeGlobals.js100%100%100%100%
   RuntimeModule.js100%100%100%100%
   RuntimePlugin.js100%100%100%100%
   RuntimeTemplate.js100%100%100%100%
   SelfModuleFactory.js100%100%100%100%
   SingleEntryPlugin.js100%100%100%100%
   SourceMapDevToolModuleOptionsPlugin.js100%100%100%100%
   SourceMapDevToolPlugin.js98.62%100%100%98.62%220, 224, 226, 419, 430, 891
   Stats.js100%100%100%100%
   Template.js100%100%100%100%
   TemplatedPathPlugin.js99.17%100%100%99.17%176–177
   UseStrictPlugin.js100%100%100%100%
   WarnCaseSensitiveModulesPlugin.js100%100%100%100%
   WarnDeprecatedOptionPlugin.js100%100%100%100%
   WarnNoModeSetPlugin.js100%100%100%100%
   WatchIgnorePlugin.js100%100%100%100%
   Watching.js100%100%100%100%
   WebpackError.js100%100%100%100%
   WebpackIsIncludedPlugin.js100%100%100%100%
   WebpackOptionsApply.js100%100%100%100%
   WebpackOptionsDefaulter.js100%100%100%100%
   buildChunkGraph.js99.87%100%100%99.87%371
   cli.js98.62%100%100%98.62%10, 119, 545, 577, 627, 897
   index.js99.72%100%100%99.72%184
   validateSchema.js94.67%100%100%94.67%100, 87, 89, 98
   webpack.js96.33%100%100%96.33%10, 198, 220, 222
lib/asset
   AssetBytesGenerator.js100%100%100%100%
   AssetBytesParser.js100%100%100%100%
   AssetGenerator.js100%100%100%100%
   AssetModule.js100%100%100%100%
   AssetModulesPlugin.js97.32%100%100%97.32%281, 305, 308, 36, 360, 41
   AssetParser.js100%100%100%100%
   AssetSourceGenerator.js100%100%100%100%
   AssetSourceParser.js100%100%100%100%
   RawDataUrlModule.js100%100%100%100%
lib/async-modules
   AsyncModuleHelpers.js100%100%100%100%
   AwaitDependenciesInitFragment.js100%100%100%100%
   InferAsyncModulesPlugin.js100%100%100%100%
lib/cache
   AddBuildDependenciesPlugin.js100%100%100%100%
   AddManagedPathsPlugin.js100%100%100%100%
   IdleFileCachePlugin.js97.92%100%100%97.92%71, 83, 91
   MemoryCachePlugin.js95.83%100%100%95.83%33
   MemoryWithGcCachePlugin.js93.15%100%100%93.15%106, 113–114, 122, 89
   PackFileCacheStrategy.js96.40%100%100%96.40%1250, 1350, 1354, 1416, 628, 647, 657–659, 661, 677–678, 683, 686, 688, 693, 698, 722, 728, 762, 768, 774, 779, 790, 799, 804–805, 807, 824, 830–831, 833
   ResolverCachePlugin.js100%100%100%100%
   getLazyHashedEtag.js100%100%100%100%
   mergeEtags.js100%100%100%100%
lib/config
   browserslistTargetHandler.js100%100%100%100%
   defaults.js99.32%100%100%99.32%1452–1454, 1462, 274, 277, 282, 286
   defineConfig.js100%100%100%100%
   normalization.js99.02%100%100%99.02%

@alexander-akait alexander-akait merged commit c1dec16 into main Jun 23, 2026
68 checks passed
@alexander-akait alexander-akait deleted the refactor/html-parser-type-driven branch June 23, 2026 08:55
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant