Skip to content

test(font-subsetting): e2e atomic-loader + subsetting for headless fonts#1123

Merged
Hotell merged 3 commits into
microsoft:mainfrom
Hotell:react-icons/headless-e2e-loader-subsetting
Jul 2, 2026
Merged

test(font-subsetting): e2e atomic-loader + subsetting for headless fonts#1123
Hotell merged 3 commits into
microsoft:mainfrom
Hotell:react-icons/headless-e2e-loader-subsetting

Conversation

@Hotell

@Hotell Hotell commented Jun 19, 2026

Copy link
Copy Markdown
Collaborator

Summary

End-to-end integration proving the full headless font pipeline works when the atomic loader and the font-subsetting plugin are combined.

What it verifies

A new webpack test entry (e2eBarrelHeadlessFonts) in the font-subsetting plugin:

  1. Starts from a plain barrel import — import { … } from '@fluentui/react-icons'.
  2. The atomic loader ({ headless: true, iconVariant: 'fonts' }) rewrites it into headless font atoms (@fluentui/react-icons/headless/fonts/*).
  3. The font-subsetting plugin recognizes those headless atoms and subsets the shared font → emitted fonts stay under the 1.5 KiB threshold (from MB-scale originals).
  4. Asserts the module graph stays Griffel-free (no @griffel/* module in the graph).

The existing headlessAtoms entry now also carries the Griffel-free assertion, giving both headless-fonts entries the same guarantee.

Changes

  • test/src/e2e-barrel-headless-fonts.js — the barrel fixture (+ the required headless/fonts/styles.css import).
  • test/webpack.config.js — new e2eBarrelHeadlessFonts entry (scoped atomic-loader rule referencing the loader's built lib via relative path) and a shared assertNoGriffel path. Entries that assert Griffel-freedom disable module concatenation (concatenateModules: false) so the verify hook can inspect individual module resources — otherwise scope hoisting would merge modules into a ConcatenatedModule and hide a leaked @griffel module.
  • project.json — the plugin's test target now dependsOn the atomic loader's build. Because the test references the loader through a raw filesystem path (not a package import), Nx's project-graph inference can't detect the dependency; without this, CI (nx affected -t test) wouldn't build the loader's lib/ when only this package is affected, causing a Module not found failure.
  • README.md — tip on pairing the subsetting plugin with the atomic loader so consumers don't hand-write headless atomic imports.

Notes

  • No package devDependencies added (monorepo single-version policy); the loader is referenced via its built lib path, mirroring how the loader's own tests reference ../lib.
  • lib/ is gitignored (source/test-only commit).

@github-actions

github-actions Bot commented Jun 19, 2026

Copy link
Copy Markdown

📋 PR Validation Summary

Check the Build react library job summary for detailed reports:

  • 📦 Bundle Size — size comparison against the base branch

To view: click the link above → select the Build react library job → open the Summary tab.

…ting (headless)

Add an end-to-end webpack entry proving the full headless font pipeline:
barrel `@fluentui/react-icons` import -> atomic loader ({ headless: true,
iconVariant: 'fonts' }) rewrites to headless font atoms -> this plugin
subsets the shared font. Also asserts the module graph stays Griffel-free.

README: note pairing the subsetting plugin with the atomic loader so
consumers don't need to hand-write headless atomic imports.

(References the atomic loader's built lib via relative path; no package
devDependency added — monorepo single-version policy.)
@Hotell
Hotell force-pushed the react-icons/headless-e2e-loader-subsetting branch from 0fdbb8f to daa0944 Compare July 2, 2026 08:26
@Hotell
Hotell force-pushed the react-icons/headless-e2e-loader-subsetting branch from cde5ed5 to 6e368fc Compare July 2, 2026 08:54
@Hotell
Hotell marked this pull request as ready for review July 2, 2026 09:04
@Hotell
Hotell requested review from a team and MLoughry as code owners July 2, 2026 09:04
@Hotell
Hotell merged commit 2e48040 into microsoft:main Jul 2, 2026
7 checks passed
@Hotell
Hotell deleted the react-icons/headless-e2e-loader-subsetting branch July 2, 2026 09:10
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.

2 participants