Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Subresource Integrity support for Module Federation #220

Open
wants to merge 10 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions examples/webpack-module-federaition-host/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
# With Webpack module federation

Usage of With Webpack module federation as host app and eager dependency
4 changes: 4 additions & 0 deletions examples/webpack-module-federaition-host/bootstrap.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
// mock dependency
require("lodash");

console.log("ok");
1 change: 1 addition & 0 deletions examples/webpack-module-federaition-host/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
import("./bootstrap");
17 changes: 17 additions & 0 deletions examples/webpack-module-federaition-host/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
{
"name": "webpack-module-federaition-host",
"description": "Ensure integrity works with webpack module federation as host app",
"version": "1.0.0",
"license": "MIT",
"private": true,
"devDependencies": {
"expect": "^26.6.2",
"nyc": "*",
"webpack": "^5.44.0",
"webpack-cli": "4",
"webpack-subresource-integrity": "*"
},
"dependencies": {
"lodash": "^4.17.21"
}
}
47 changes: 47 additions & 0 deletions examples/webpack-module-federaition-host/webpack.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,47 @@
const { SubresourceIntegrityPlugin } = require("webpack-subresource-integrity");
const expect = require("expect");
const container = require("webpack").container;

const { ModuleFederationPlugin } = container;

module.exports = {
entry: {
index: "./index.js",
},
output: {
crossOriginLoading: "anonymous",
},
plugins: [
new SubresourceIntegrityPlugin({
hashFuncNames: ["sha256"],
enabled: true,
}),
new ModuleFederationPlugin({
name: "host",
filename: "remoteEntry.js",
remotes: {
app1: "app1@http://localhost:3001/remoteEntry.js",
},
exposes: {
"./remote": "./bootstrap",
},
shared: {
lodash: {
singleton: true,
eager: true,
},
},
}),
{
apply: (compiler) => {
compiler.hooks.done.tap("wsi-test", (stats) => {
const assets = stats.toJson().assets;

assets.forEach((asset) => {
expect(asset).not.toContain("*-*-*-CHUNK-SRI-HASH-");
});
});
},
},
],
};
3 changes: 3 additions & 0 deletions examples/webpack-module-federaition-remote/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
# With Webpack module federation

Usage of With Webpack module federation as remote app
4 changes: 4 additions & 0 deletions examples/webpack-module-federaition-remote/bootstrap.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
// mock dependency
require("lodash");

console.log("ok");
1 change: 1 addition & 0 deletions examples/webpack-module-federaition-remote/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
import("./bootstrap");
17 changes: 17 additions & 0 deletions examples/webpack-module-federaition-remote/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
{
"name": "webpack-module-federaition-remote",
"description": "Ensure integrity works with webpack module federation as remote app",
"version": "1.0.0",
"license": "MIT",
"private": true,
"devDependencies": {
"expect": "^26.6.2",
"nyc": "*",
"webpack": "^5.44.0",
"webpack-cli": "4",
"webpack-subresource-integrity": "*"
},
"dependencies": {
"lodash": "^4.17.21"
}
}
43 changes: 43 additions & 0 deletions examples/webpack-module-federaition-remote/webpack.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,43 @@
const { SubresourceIntegrityPlugin } = require("webpack-subresource-integrity");
const expect = require("expect");
const container = require("webpack").container;

const { ModuleFederationPlugin } = container;

module.exports = {
entry: {
index: "./index.js",
},
output: {
crossOriginLoading: "anonymous",
},
plugins: [
new SubresourceIntegrityPlugin({
hashFuncNames: ["sha256"],
enabled: true,
}),
new ModuleFederationPlugin({
name: "remote",
filename: "remoteEntry.js",
exposes: {
"./remote": "./bootstrap",
},
shared: {
lodash: {
singleton: true,
},
},
}),
{
apply: (compiler) => {
compiler.hooks.done.tap("wsi-test", (stats) => {
const assets = stats.toJson().assets;

assets.forEach((asset) => {
expect(asset).not.toContain("*-*-*-CHUNK-SRI-HASH-");
});
});
},
},
],
};
2 changes: 1 addition & 1 deletion webpack-subresource-integrity/src/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -167,7 +167,7 @@ export class SubresourceIntegrityPlugin {
const allChunks =
this.options.hashLoading === "lazy"
? plugin.getChildChunksToAddToChunkManifest(chunk)
: findChunks(chunk);
: findChunks(chunk, compilation);
const includedChunks = chunk.getChunkMaps(false).hash;

if (Object.keys(includedChunks).length > 0) {
Expand Down
23 changes: 15 additions & 8 deletions webpack-subresource-integrity/src/manifest.ts
Original file line number Diff line number Diff line change
Expand Up @@ -17,9 +17,10 @@ import {
allChunksInChunkIterable,
allChunksInPrimaryChunkIterable,
sriHashVariableReference,
wmfSharedChunk,
} from "./util";
import { createDAGfromGraph } from "./scc";
import { RuntimeModule, Template, Chunk } from "webpack";
import { RuntimeModule, Template, Chunk, Compilation } from "webpack";

// This implementation assumes a directed acyclic graph (such as one produced by createDAGfromGraph),
// and does not attempt to detect cycles
Expand All @@ -41,7 +42,8 @@ function topologicalSort<T>({ vertices, edges }: Graph<T>): T[] {
}

function buildTopologicallySortedChunkGraph(
chunks: Iterable<Chunk>
chunks: Iterable<Chunk>,
compilation: Compilation
): [
sortedVertices: StronglyConnectedComponent<Chunk>[],
sccGraph: Graph<StronglyConnectedComponent<Chunk>>,
Expand All @@ -52,13 +54,18 @@ function buildTopologicallySortedChunkGraph(

// Chunks should have *all* chunks, not simply entry chunks
for (const vertex of chunks) {
if (addIfNotExist(vertices, vertex)) {
if (
wmfSharedChunk(vertex, compilation) ||
addIfNotExist(vertices, vertex)
) {
continue;
}

edges.set(vertex, new Set<Chunk>());
for (const childChunk of allChunksInChunkIterable(vertex)) {
edges.get(vertex)?.add(childChunk);
if (!wmfSharedChunk(childChunk, compilation)) {
edges.get(vertex)?.add(childChunk);
}
}
}

Expand All @@ -82,9 +89,9 @@ class ChunkToManifestMapBuilder {
// or its parents regardless of the tree traversal used from the roots
private hashesByChunkGroupAndParents = new Map<ChunkGroup, Set<Chunk>>();

constructor(chunks: Iterable<Chunk>) {
constructor(compilation: Compilation) {
const [sortedVertices, , chunkToSccMap] =
buildTopologicallySortedChunkGraph(chunks);
buildTopologicallySortedChunkGraph(compilation.chunks, compilation);
this.sortedVertices = sortedVertices;
this.chunkToSccMap = chunkToSccMap;
this.manifest = this.createManifest();
Expand Down Expand Up @@ -186,12 +193,12 @@ class ChunkToManifestMapBuilder {
}

export function getChunkToManifestMap(
chunks: Iterable<Chunk>
compilation: Compilation
): [
sortedVertices: StronglyConnectedComponent<Chunk>[],
chunkManifest: Map<Chunk, Set<Chunk>>
] {
return new ChunkToManifestMapBuilder(chunks).build();
return new ChunkToManifestMapBuilder(compilation).build();
}

export class AddLazySriRuntimeModule extends RuntimeModule {
Expand Down
4 changes: 2 additions & 2 deletions webpack-subresource-integrity/src/plugin.ts
Original file line number Diff line number Diff line change
Expand Up @@ -150,7 +150,7 @@ export class Plugin {
chunk: Chunk,
assets: Record<string, sources.Source>
): void => {
Array.from(findChunks(chunk))
Array.from(findChunks(chunk, this.compilation))
.reverse()
.forEach((chunk) => this.processChunkAssets(chunk, assets));
};
Expand Down Expand Up @@ -296,7 +296,7 @@ export class Plugin {
beforeRuntimeRequirements = (): void => {
if (this.options.hashLoading === "lazy") {
const [sortedSccChunks, chunkManifest] = getChunkToManifestMap(
this.compilation.chunks
this.compilation
);
this.sortedSccChunks = sortedSccChunks;
this.chunkManifest = chunkManifest;
Expand Down
23 changes: 21 additions & 2 deletions webpack-subresource-integrity/src/util.ts
Original file line number Diff line number Diff line change
Expand Up @@ -87,8 +87,22 @@ export function addIfNotExist<T>(set: Set<T>, item: T): boolean {
set.add(item);
return false;
}
/**
* Filter out shared module that are not used in the build
*/
export function wmfSharedChunk(
chunk: Chunk,
compilation: Compilation
): boolean {
const rootModules = compilation.chunkGraph.getChunkRootModules(chunk);
const isSharedModule = rootModules.some(
(module) => module.type === "consume-shared-module"
);

export function findChunks(chunk: Chunk): Set<Chunk> {
return isSharedModule && rootModules.length === 1;
}

export function findChunks(chunk: Chunk, compilation: Compilation): Set<Chunk> {
const allChunks = new Set<Chunk>();
const groupsVisited = new Set<string>();

Expand All @@ -99,7 +113,12 @@ export function findChunks(chunk: Chunk): Set<Chunk> {
group.childrenIterable.forEach(recurseGroup);
}

if (addIfNotExist(allChunks, childChunk)) return;
if (
wmfSharedChunk(childChunk, compilation) ||
addIfNotExist(allChunks, childChunk)
) {
return;
}
Array.from(childChunk.groupsIterable).forEach(recurseGroup);
})(chunk);

Expand Down
26 changes: 26 additions & 0 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -9574,6 +9574,32 @@ __metadata:
languageName: node
linkType: hard

"webpack-module-federaition-host@workspace:examples/webpack-module-federaition-host":
version: 0.0.0-use.local
resolution: "webpack-module-federaition-host@workspace:examples/webpack-module-federaition-host"
dependencies:
expect: ^26.6.2
lodash: ^4.17.21
nyc: "*"
webpack: ^5.44.0
webpack-cli: 4
webpack-subresource-integrity: "*"
languageName: unknown
linkType: soft

"webpack-module-federaition-remote@workspace:examples/webpack-module-federaition-remote":
version: 0.0.0-use.local
resolution: "webpack-module-federaition-remote@workspace:examples/webpack-module-federaition-remote"
dependencies:
expect: ^26.6.2
lodash: ^4.17.21
nyc: "*"
webpack: ^5.44.0
webpack-cli: 4
webpack-subresource-integrity: "*"
languageName: unknown
linkType: soft

"webpack-preload@workspace:examples/webpack-preload":
version: 0.0.0-use.local
resolution: "webpack-preload@workspace:examples/webpack-preload"
Expand Down
Loading