fix(sdk): issue where duplicate links were created when existing links had no rel attribute

Author: ScriptedAlchemy

.changeset/ai-eager-mouse.md

@@ -0,0 +1,8 @@
+"@module-federation/sdk": patch
+---
+
+Fixes an issue where duplicate links were created when existing links had no rel attribute.
+
+- Added a test in `dom.spec.ts` to ensure links without `rel` attribute aren't duplicated.
+- Modified the `createLink` function in `dom.ts` to treat `null` and `undefined` `rel` attributes as equivalent when checking for existing links.
+```

package.json

@@ -51,7 +51,7 @@
     "prepare": "husky install",
     "changeset": "changeset",
     "build:packages": "npx nx affected -t build --parallel=10 --exclude='*,!tag:type:pkg'",
-    "changegen": "./changeset-gen.js --path ./packages/enhanced --staged && ./changeset-gen.js --path ./packages/node --staged && ./changeset-gen.js --path ./packages/runtime --staged && ./changeset-gen.js --path ./packages/data-prefetch --staged && ./changeset-gen.js --path ./packages/nextjs-mf --staged && ./changeset-gen.js --path ./packages/dts-plugin --staged",
+    "changegen": "./changeset-gen.js --path ./packages/enhanced --staged && ./changeset-gen.js --path ./packages/node --staged && ./changeset-gen.js --path ./packages/runtime --staged && ./changeset-gen.js --path ./packages/data-prefetch --staged && ./changeset-gen.js --path ./packages/nextjs-mf --staged && ./changeset-gen.js --path ./packages/dts-plugin --staged && ./changeset-gen.js --path ./packages/sdk --staged",
     "commitgen:staged": "./commit-gen.js --path ./packages --staged",
     "commitgen:main": "./commit-gen.js --path ./packages",
     "changeset:status": "changeset status",

packages/sdk/__tests__/dom.spec.ts

@@ -283,4 +283,25 @@ describe('createLink', () => {
 
     expect(link).toBe(customLink);
   });
+
+  it('should not create a duplicate link when existing link has no rel and attrs.rel is undefined (https://github.com/module-federation/core/issues/3705)', () => {
+    // Simulate an existing link with no rel attribute
+    const url = 'https://example.com/stylesheet.css';
+    const existingLink = document.createElement('link');
+    existingLink.setAttribute('href', url);
+    // Note: no rel attribute set
+    document.head.appendChild(existingLink);
+
+    // Now call createLink with matching url and no rel in attrs
+    const cb = jest.fn();
+    const { link, needAttach } = createLink({
+      url,
+      cb,
+      attrs: { as: 'style' }, // rel is omitted, so info.attrs['rel'] is undefined
+    });
+
+    // Should reuse the existing link, not create a new one
+    expect(link).toBe(existingLink);
+    expect(needAttach).toBe(false);
+  });
 });

packages/sdk/src/dom.ts

@@ -156,10 +156,11 @@ export function createLink(info: {
     const l = links[i];
     const linkHref = l.getAttribute('href');
     const linkRel = l.getAttribute('rel');
+    // Use == to treat null and undefined as equivalent (see https://github.com/module-federation/core/issues/3705)
     if (
       linkHref &&
       isStaticResourcesEqual(linkHref, info.url) &&
-      linkRel === info.attrs['rel']
+      linkRel == info.attrs['rel']
     ) {
       link = l;
       needAttach = false;