feat: support SRI with experiments.css and CssExtractRspackPlugin (#12239)

* feat: support sri in experiments css and extract css

* test: add test cases

Author: LingyuCoder

crates/node_binding/napi-binding.d.ts

@@ -1517,6 +1517,8 @@ export interface KnownAssetInfo {
   cssUnusedIdents?: Array<string>
   /** whether this asset is over the size limit */
   isOverSizeLimit?: boolean
+  /** the asset type */
+  assetType?: string
 }
 
 export declare function loadBrowserslist(input: string | undefined | null, context: string): Array<string> | null

crates/rspack_binding_api/src/asset.rs

@@ -65,6 +65,8 @@ pub struct KnownAssetInfo {
   pub css_unused_idents: Option<Vec<String>>,
   /// whether this asset is over the size limit
   pub is_over_size_limit: Option<bool>,
+  /// the asset type
+  pub asset_type: Option<String>,
 }
 
 /// Webpack: AssetInfo = KnownAssetInfo & Record<string, any>
@@ -140,6 +142,7 @@ impl From<AssetInfo> for rspack_core::AssetInfo {
       related,
       css_unused_idents,
       is_over_size_limit,
+      asset_type,
     } = known;
 
     let chunk_hash = chunkhash
@@ -178,6 +181,7 @@ impl From<AssetInfo> for rspack_core::AssetInfo {
       version: String::default(),
       css_unused_idents: css_unused_idents.map(|i| i.into_iter().collect()),
       is_over_size_limit,
+      asset_type: asset_type.map(Into::into).unwrap_or_default(),
       extras,
     }
   }
@@ -225,6 +229,7 @@ impl From<rspack_core::AssetInfo> for AssetInfo {
       related,
       css_unused_idents,
       is_over_size_limit,
+      asset_type,
       extras,
       ..
     } = value;
@@ -244,6 +249,7 @@ impl From<rspack_core::AssetInfo> for AssetInfo {
         javascript_module,
         css_unused_idents: css_unused_idents.map(|i| i.into_iter().collect()),
         is_over_size_limit,
+        asset_type: Some(asset_type.to_string()),
       },
       extras,
     }

crates/rspack_core/src/compilation/mod.rs

@@ -2,7 +2,7 @@ pub mod build_chunk_graph;
 pub mod build_module_graph;
 use std::{
   collections::{VecDeque, hash_map},
-  fmt::Debug,
+  fmt::{self, Debug},
   hash::{BuildHasherDefault, Hash},
   sync::{
     Arc,
@@ -37,6 +37,7 @@ use rspack_util::allocative;
 use rspack_util::{itoa, tracing_preset::TRACING_BENCH_TARGET};
 use rustc_hash::{FxHashMap as HashMap, FxHashSet as HashSet, FxHasher};
 use tracing::instrument;
+use ustr::Ustr;
 
 use crate::{
   AsyncModulesArtifact, BindingCell, BoxDependency, BoxModule, CacheCount, CacheOptions,
@@ -2955,6 +2956,8 @@ pub struct AssetInfo {
   pub css_unused_idents: Option<HashSet<String>>,
   /// whether this asset is over the size limit
   pub is_over_size_limit: Option<bool>,
+  /// the plugin that created the asset
+  pub asset_type: ManifestAssetType,
 
   /// Webpack: AssetInfo = KnownAssetInfo & Record<string, any>
   /// This is a hack to store the additional fields in the rust struct.
@@ -2994,6 +2997,11 @@ impl AssetInfo {
     self
   }
 
+  pub fn with_asset_type(mut self, v: ManifestAssetType) -> Self {
+    self.asset_type = v;
+    self
+  }
+
   pub fn set_full_hash(&mut self, v: String) {
     self.full_hash.insert(v);
   }
@@ -3154,3 +3162,41 @@ pub struct ChunkHashResult {
   pub hash: RspackHashDigest,
   pub content_hash: ChunkContentHash,
 }
+
+#[cacheable]
+#[derive(Debug, Clone, Copy, PartialEq, Eq, Hash, Default)]
+pub enum ManifestAssetType {
+  #[default]
+  Unknown,
+  Asset,
+  Css,
+  JavaScript,
+  Wasm,
+  Custom(#[cacheable(with=AsPreset)] Ustr),
+}
+
+impl fmt::Display for ManifestAssetType {
+  fn fmt(&self, f: &mut fmt::Formatter<'_>) -> fmt::Result {
+    match self {
+      ManifestAssetType::Unknown => write!(f, "unknown"),
+      ManifestAssetType::Asset => write!(f, "asset"),
+      ManifestAssetType::Css => write!(f, "css"),
+      ManifestAssetType::JavaScript => write!(f, "javascript"),
+      ManifestAssetType::Wasm => write!(f, "wasm"),
+      ManifestAssetType::Custom(custom) => write!(f, "{custom}"),
+    }
+  }
+}
+
+impl From<String> for ManifestAssetType {
+  fn from(value: String) -> Self {
+    match value.as_str() {
+      "unknown" => ManifestAssetType::Unknown,
+      "asset" => ManifestAssetType::Asset,
+      "css" => ManifestAssetType::Css,
+      "javascript" => ManifestAssetType::JavaScript,
+      "wasm" => ManifestAssetType::Wasm,
+      _ => ManifestAssetType::Custom(value.into()),
+    }
+  }
+}

crates/rspack_plugin_asset/src/lib.rs

@@ -8,9 +8,9 @@ use rspack_core::{
   AssetParserDataUrl, BuildMetaDefaultObject, BuildMetaExportsType, ChunkGraph, ChunkUkey,
   CodeGenerationDataAssetInfo, CodeGenerationDataFilename, CodeGenerationDataUrl,
   CodeGenerationPublicPathAutoReplace, Compilation, CompilationRenderManifest, CompilerOptions,
-  DependencyType, Filename, GenerateContext, GeneratorOptions, Module, ModuleGraph,
-  NAMESPACE_OBJECT_EXPORT, NormalModule, ParseContext, ParserAndGenerator, PathData, Plugin,
-  PublicPath, RenderManifestEntry, ResourceData, RuntimeGlobals, RuntimeSpec, SourceType,
+  DependencyType, Filename, GenerateContext, GeneratorOptions, ManifestAssetType, Module,
+  ModuleGraph, NAMESPACE_OBJECT_EXPORT, NormalModule, ParseContext, ParserAndGenerator, PathData,
+  Plugin, PublicPath, RenderManifestEntry, ResourceData, RuntimeGlobals, RuntimeSpec, SourceType,
   rspack_sources::{BoxSource, RawStringSource, SourceExt},
 };
 use rspack_error::{
@@ -824,12 +824,14 @@ async fn render_manifest(
           .data
           .get::<CodeGenerationDataAssetInfo>()
           .expect("should have asset_info")
-          .inner();
+          .inner()
+          .to_owned()
+          .with_asset_type(ManifestAssetType::Asset);
         RenderManifestEntry {
           source: source.clone(),
           filename: asset_filename.to_owned(),
           has_filename: true,
-          info: asset_info.to_owned(),
+          info: asset_info,
           auxiliary: true,
         }
       });

crates/rspack_plugin_css/src/plugin/impl_plugin_for_css_plugin.rs

@@ -11,9 +11,10 @@ use rspack_collections::{DatabaseItem, ItemUkey};
 use rspack_core::{
   AssetInfo, Chunk, ChunkGraph, ChunkKind, ChunkLoading, ChunkLoadingType, ChunkUkey, Compilation,
   CompilationContentHash, CompilationId, CompilationParams, CompilationRenderManifest,
-  CompilationRuntimeRequirementInTree, CompilerCompilation, DependencyType, Module, ModuleGraph,
-  ModuleType, ParserAndGenerator, PathData, Plugin, PublicPath, RenderManifestEntry,
-  RuntimeGlobals, SelfModuleFactory, SourceType, get_css_chunk_filename_template,
+  CompilationRuntimeRequirementInTree, CompilerCompilation, DependencyType, ManifestAssetType,
+  Module, ModuleGraph, ModuleType, ParserAndGenerator, PathData, Plugin, PublicPath,
+  RenderManifestEntry, RuntimeGlobals, SelfModuleFactory, SourceType,
+  get_css_chunk_filename_template,
   rspack_sources::{
     BoxSource, CachedSource, ConcatSource, RawStringSource, ReplaceSource, Source, SourceExt,
   },
@@ -414,7 +415,7 @@ async fn render_manifest(
     &compilation.options.output,
     &compilation.chunk_group_by_ukey,
   );
-  let mut asset_info = AssetInfo::default();
+  let mut asset_info = AssetInfo::default().with_asset_type(ManifestAssetType::Css);
   let unused_idents = Self::get_chunk_unused_local_idents(compilation, chunk, &css_modules);
   asset_info.set_css_unused_idents(unused_idents);
   let output_path = compilation

crates/rspack_plugin_extract_css/src/plugin.rs

@@ -11,9 +11,10 @@ use rspack_collections::{DatabaseItem, IdentifierMap, IdentifierSet, UkeySet};
 use rspack_core::{
   AssetInfo, Chunk, ChunkGraph, ChunkGroupUkey, ChunkKind, ChunkUkey, Compilation,
   CompilationContentHash, CompilationParams, CompilationRenderManifest,
-  CompilationRuntimeRequirementInTree, CompilerCompilation, DependencyType, Filename, Module,
-  ModuleGraph, ModuleIdentifier, ModuleType, NormalModuleFactoryParser, ParserAndGenerator,
-  ParserOptions, PathData, Plugin, RenderManifestEntry, RuntimeGlobals, SourceType, get_undo_path,
+  CompilationRuntimeRequirementInTree, CompilerCompilation, DependencyType, Filename,
+  ManifestAssetType, Module, ModuleGraph, ModuleIdentifier, ModuleType, NormalModuleFactoryParser,
+  ParserAndGenerator, ParserOptions, PathData, Plugin, RenderManifestEntry, RuntimeGlobals,
+  SourceType, get_undo_path,
   rspack_sources::{
     BoxSource, CachedSource, ConcatSource, RawStringSource, SourceExt, SourceMap, SourceMapSource,
     WithoutOriginalOptions,
@@ -643,7 +644,8 @@ async fn render_manifest(
     &self.options.chunk_filename
   };
 
-  let mut asset_info = AssetInfo::default();
+  let mut asset_info =
+    AssetInfo::default().with_asset_type(ManifestAssetType::Custom("extract-css".into()));
   let filename = compilation
     .get_path_with_info(
       filename_template,

crates/rspack_plugin_javascript/src/plugin/impl_plugin_for_js_plugin.rs

@@ -4,9 +4,9 @@ use rspack_core::{
   AssetInfo, CachedConstDependencyTemplate, ChunkGraph, ChunkKind, ChunkUkey, Compilation,
   CompilationAdditionalTreeRuntimeRequirements, CompilationChunkHash, CompilationContentHash,
   CompilationId, CompilationParams, CompilationRenderManifest, CompilerCompilation,
-  ConstDependencyTemplate, DependencyType, IgnoreErrorModuleFactory, ModuleGraph, ModuleType,
-  ParserAndGenerator, PathData, Plugin, RenderManifestEntry, RuntimeGlobals,
-  RuntimeRequirementsDependencyTemplate, SelfModuleFactory, SourceType,
+  ConstDependencyTemplate, DependencyType, IgnoreErrorModuleFactory, ManifestAssetType,
+  ModuleGraph, ModuleType, ParserAndGenerator, PathData, Plugin, RenderManifestEntry,
+  RuntimeGlobals, RuntimeRequirementsDependencyTemplate, SelfModuleFactory, SourceType,
   get_js_chunk_filename_template,
   rspack_sources::{BoxSource, CachedSource, SourceExt},
 };
@@ -518,7 +518,7 @@ async fn render_manifest(
     &compilation.options.output,
     &compilation.chunk_group_by_ukey,
   );
-  let mut asset_info = AssetInfo::default();
+  let mut asset_info = AssetInfo::default().with_asset_type(ManifestAssetType::JavaScript);
   asset_info.set_javascript_module(compilation.options.output.module);
   let output_path = compilation
     .get_path_with_info(

crates/rspack_plugin_sri/src/asset.rs

@@ -3,7 +3,7 @@ use std::{cmp::Ordering, sync::Arc};
 use rayon::iter::{IntoParallelIterator, IntoParallelRefIterator, ParallelIterator};
 use rspack_core::{
   ChunkUkey, Compilation, CompilationAfterProcessAssets, CompilationAssets,
-  CompilationProcessAssets, CrossOriginLoading,
+  CompilationProcessAssets, CrossOriginLoading, ManifestAssetType,
   chunk_graph_chunk::ChunkId,
   rspack_sources::{ReplaceSource, Source},
 };
@@ -79,10 +79,15 @@ See https://w3c.github.io/webappsec-subresource-integrity/#cross-origin-data-lea
         files
       })
       .map(|(chunk_id, file)| {
-        if let Some(source) = compilation.assets().get(file).and_then(|a| a.get_source()) {
+        if let Some((source, asset_type)) = compilation
+          .assets()
+          .get(file)
+          .and_then(|a| a.get_source().map(|s| (s, a.get_info().asset_type)))
+        {
           process_chunk_source(
             file,
             source.clone(),
+            asset_type,
             chunk_id,
             hash_funcs,
             &hash_by_placeholders,
@@ -155,6 +160,7 @@ Use [contenthash] and ensure "optimization.realContentHash" option is enabled."#
 fn process_chunk_source(
   file: &str,
   source: Arc<dyn Source>,
+  asset_type: ManifestAssetType,
   chunk_id: Option<&ChunkId>,
   hash_funcs: &Vec<SubresourceIntegrityHashFunction>,
   hash_by_placeholders: &HashMap<String, String>,
@@ -181,7 +187,7 @@ fn process_chunk_source(
 
   // compute self integrity and placeholder
   let integrity = compute_integrity(hash_funcs, new_source.source().into_string_lossy().as_ref());
-  let placeholder = chunk_id.map(|id| make_placeholder(hash_funcs, id.as_str()));
+  let placeholder = chunk_id.map(|id| make_placeholder(asset_type, hash_funcs, id.as_str()));
 
   ProcessChunkResult {
     file: file.to_string(),

crates/rspack_plugin_sri/src/lib.rs

@@ -27,7 +27,7 @@ use rspack_plugin_runtime::RuntimePlugin;
 #[cfg(allocative)]
 use rspack_util::allocative;
 use rspack_util::fx_hash::FxDashMap;
-use runtime::{create_script, handle_runtime, link_preload};
+use runtime::{create_link, create_script, handle_runtime, link_preload};
 use rustc_hash::FxHashMap as HashMap;
 use tokio::sync::RwLock;
 
@@ -130,6 +130,7 @@ async fn handle_compilation(
     runtime_plugin_hooks
       .create_script
       .tap(create_script::new(self));
+    runtime_plugin_hooks.create_link.tap(create_link::new(self));
     runtime_plugin_hooks
       .link_preload
       .tap(link_preload::new(self));