build: replace Grunt+r.js with webpack 5 — Phase E complete

[moodyjmz]

TL;DR

Grunt is gone. All build tasks now run through webpack 5 + Node.js scripts.

CI build time: ~7 minutes → ~2 minutes (cold runner, no cache).
Local build time (eo container, SKIP_MOBILE=1): ~101s.
Mobile build time per editor: ~146–179s → ~101–132s (EsbuildPlugin, see below).
All 6 editors (documenteditor, spreadsheeteditor, presentationeditor, visioeditor, pdfeditor, forms) runtime-validated. CI green.

Developed with Claude Code — AI-assisted analysis, debugging, and implementation.

---

Testing

Pull Euro-Office/DocumentServer#187

pull this PR, run as normal make local, then in docker (once) make sdkjs and make web-apps-dev, see if errors come up. Test Euro Office in browser. Look for console errors or anything else.

Build system improvements (2026-06-17)

Three follow-up commits on top of the Phase E work, addressing mobile build performance and pipeline robustness.

⚡ EsbuildPlugin replaces TerserPlugin + CssMinimizerPlugin (closes #107)

Why: Mobile webpack builds were taking 146–179s per editor with TerserPlugin doing JS minification and CssMinimizerPlugin doing CSS minification in two separate passes. esbuild's minifier handles both in a single pass and is significantly faster.

What changed: vendor/framework7-react/build/webpack.config.js — the two-entry optimization.minimizer array and the duplicate CssMinimizerPlugin in the production plugins array are replaced with a single new EsbuildPlugin({ target: 'es2015', css: true }). terser-webpack-plugin and css-minimizer-webpack-plugin removed from package.json; esbuild-loader added.

Validation — two full pipeline runs in eo container:

Task	Before	After run 1	After run 2
mobile:word	146–179s	130.4s	132.9s
mobile:cell	146–179s	127.2s	130.8s
mobile:slide	146–179s	122.5s	126.1s
mobile:visio	146–179s	101.4s	116.2s
Wall clock	—	176.9s	164.0s

All 21 pipeline tasks green both runs. The remaining mobile build time (~100–130s) is babel-loader + bundling — the minification step is no longer the bottleneck.

Note: Further improvement is possible by replacing babel-loader with esbuild-loader for JS transforms (~30–50s additional saving). Deferred — the mobile code uses MobX @inject legacy decorators which require experimentalDecorators: true and warrant a separate tested commit.

✨ Lazy task spawn + word-wrapped phase task list

Why: task() previously spawned child processes eagerly. Phase 1 builds phase1Tasks (deploy ×5 + webpack ×6) eagerly, then awaits mobile:install (~20s), then calls phase(). This meant the phase banner and task list were printed after the fast deploy tasks had already completed and printed their ✓ lines — output order was banner-after-results, which was confusing.

What changed: task() now returns a lazy spec ({ label, cmd, args, opts }). runTask(spec) spawns and returns { promise, kill, label }. phase() prints the banner and task list first, then calls runTask() on each spec before awaiting. Output order is now always correct: header → task completion lines.

The task list in the banner is also reformatted: previously one long comma-separated line (sprites, deploy-common, deploy-html, ...); now word-wrapped at 80 columns with · separators.

🐛 Flush stderr of killed tasks on sibling failure

Why: When a phase task fails, phase() sends SIGTERM to all sibling processes. Killed tasks resolved with code: -1 but their buffered stderr was discarded — if the killed task had begun emitting a useful error before being killed, that output was lost.

What changed: One line in runTask(): stderrBuf is now flushed in the signal branch of child.on('exit'), matching the existing flush in the non-zero exit branch.

---

CI fix — e2e workflow switched from grunt to build-pipeline.js (2026-06-18)

PR #91 (merged to main) added .github/workflows/e2e.yml with a build step that calls grunt. This PR removes grunt. The two collide: e2e.yml would fail with grunt: command not found the moment #109 landed.

Fix: merged origin/main into the branch (clean, no conflicts — e2e.yml was a new file) then updated the build step:

• Dropped: npm install -g grunt-cli and grunt
• Added: node scripts/build-pipeline.js and SKIP_MOBILE: '1'
• Unchanged: BUILD_ROOT, THEME, PRODUCT_VERSION env vars; the version-read step; the overlay build step; all triggers and Playwright run steps

SKIP_MOBILE: '1' is correct here — the e2e suite runs Playwright on Chromium desktop only; the framework7 mobile editors are not exercised, so skipping them saves ~130s of CI time per run.

Bonus: build-pipeline.js runs the Tier-1 gates (verify-replacements preflight + verify-bundles/verify-deploy final gate). The e2e job now fails fast on a broken shim, unreplaced token, or missing output artifact — before Playwright spins up the nightly image. Cheaper failure, earlier signal.

---

What changed

Six webpack configs replace r.js AMD bundling. Six Node.js scripts replace all grunt asset tasks. A parallel orchestrator (build/scripts/build-pipeline.js) replaces the sequential Makefile chain. Grunt, Gruntfile.js, and all grunt test fixtures are removed.

Pipeline overview

Phase 1 (all parallel): sprites, deploy-common, deploy-html, deploy-reporter, deploy-theme-images, deploy-embed, webpack ×6, mobile ×4

Phase 2 (after Phase 1): deploy-resources, deploy-theme-img, inline-svgs

Local builds get webpack filesystem cache: 19s cold → 0.6s warm rebuild per editor (full pipeline wall-clock is dominated by other Phase 1 tasks).

Theme LESS overrides

grunt's appendThemeFiles() injected theme/euro-office/assets/less/theme.less as a top-level LESS entry. webpack equivalent:

1. theme.config.mjs writes a one-line redirector stub at apps/common/main/resources/less/_theme-main.less
2. Each editor's app.less imports the stub at the end

The stub is a redirector (not a copy) so theme.less's own relative @import "overrides.less" resolves from the theme directory. Adding a new theme override is theme-only — no build changes required. See docs/theme-less-overrides.md.

CSS outputs to apps/<editor>/main/app.css (root of main/), matching grunt's baseline so all url() references in LESS resolve at the correct depth.

Gotchas worth knowing

These surfaced during migration and are documented in docs/webpack-migration.md:

• mangle: false is load-bearing — 117 files use var Common = Common || {} as a namespace guard that breaks under name mangling in webpack's module scope. Not negotiable without a larger refactor.
• PRODUCT_VERSION must be ≥ 6 — EuroOffice rejects editors below version 6. The common.json fallback is 4.3.0. Pipeline fails fast if it's missing.
• locale.js crashes webpack's AMD parser — fixed with string-replace-loader. Do not use noParse.
• deploy-html + inline-svgs are a unit — running deploy-html alone leaves broken ?__inline=true tags and produces blank editors.
• SVG sprites are baked into HTML at build time — no XHR requests for icons at runtime. index.html (un-built source) still uses SVGInjector but that file is never deployed.
• Service worker caches aggressively — always test in incognito.

Known pre-existing issues (not caused by this migration)

Issue	Notes
warnings_s.svg 404	CSS url() path depth — pre-existing
Transitions panel icons blank	CSS classes not updated for SVG migration
FormsTab.getView() throws on plain PDF	Upstream OnlyOffice bug, SDK catches it
Large locale diffs	CI translation-merge step — expected noise, not regressions

Tracked follow-ups

• build: replace grunt-inline SVG/script embedding with cached external assets #106 — Replace grunt-inline SVG/script embedding with cached external assets
• build: evaluate esbuild as TerserPlugin replacement for mobile (framework7-react) builds #107 — Evaluate esbuild as TerserPlugin replacement for mobile builds ✅ resolved in this PR
• docs: add .claude/ folder to repo for topology and session context #108 — Add .claude/ findings folder to repo
• Update e2e.yml build step from grunt to build-pipeline.js ✅ resolved in this PR (2026-06-18)

DocumentServer changes

Corresponding Makefile update (removes grunt from make web-apps-dev, calls build-pipeline.js): see Euro-Office/DocumentServer PR [linked below].

[chrip]

Existing comments addressed (not repeating):

• .gitignore .claude/ exclusion preference (juliusknorr)
• CLAUDE.md parked issues scope (juliusknorr: lines 36, 40, 52)
• Vendored dependencies in vendor/ (juliusknorr: apps/documenteditor/forms/index.html.deploy:266)

---

Summary: Solid migration — removing grunt and IE baggage is the right move. Four findings below, one being a real bug in CI (sequential steps lose the claimed speedup), two are fragility issues that will bite later, and one cleanup.

---

1. CI doesn't use build-pipeline.js — claimed speedup won't materialize
.github/workflows/build.yml

The PR body says "CI build time: ~7 min → ~2 min" but the CI workflow runs all steps sequentially, duplicating the pipeline logic in shell. The parallelism benefit only exists in build-pipeline.js. Either replace the individual steps with a single node scripts/build-pipeline.js step, or use GitHub Actions jobs with needs: for parallel execution. As-is, CI won't see the claimed improvement.

---

2. inline-svgs.js treats zero substitutions as a hard error
build/scripts/inline-svgs.js line 118

if (totalSubstitutions === beforeEditor) {
    process.exitCode = 1;
}

Any future template change that removes inline tags (e.g., switching to bundled sprites) will silently break the build with a confusing error. Downgrade to a warning, or make it opt-in per editor.

---

3. Hardcoded baseUrl: "../../" in HTML templates
apps/documenteditor/main/index.html.deploy line 416 (and all other editor templates)

baseUrl: window.customBaseUrl || "../../"

This assumes a fixed deploy layout. The old code relied on implicit requirejs baseUrl resolution, which tolerated different paths. If the app is served from a different subdirectory and customBaseUrl is never set, requireJS will fail to resolve all modules. Consider computing baseUrl dynamically from document.location.href.

---

4. Dead vendor artifacts: fetch and es6-promise still deployed
build/scripts/deploy-common.js simpleVendors array

fix-ie-compat.js was deleted and IE conditional loading removed from HTML. The fetch and es6-promise polyfills are no longer loaded by any code path, but deploy-common.js still copies them to BUILD_ROOT. Not harmful, but unnecessary deployed bytes.

Assisted-by: OpenCode:Qwen3.6-27B

[moodyjmz]

Thanks for all four findings — responses inline.

Finding 1 (CI steps vs build-pipeline.js): Valid. Will switch build.yml to call node scripts/build-pipeline.js directly in the same way e2e.yml already does. Coming in the next commit.

Finding 2 (inline-svgs zero-substitutions as hard error): Intentional. Zero substitutions on a specific editor means the HTML templates didn't contain the expected inline tags — that produces blank editors (documented in the findings catalog: a missed inline pass is "Not supported version" / blank page, high blast radius). The script already has a precedent for the softer path: device_scale.js missing gets a warning and a skipped tag, because that miss is benign. The per-editor hard error exists precisely because this miss is not benign. Making it a warning would silently defeat the gate.

Finding 3 (hardcoded baseUrl: "../../"): Pre-existing from the grunt templates — the webpack migration didn't change it. Worth noting though: it's not actually hardcoded without an escape — every template uses window.customBaseUrl || "../../", so a deployer serving from a non-standard path already has a runtime override hook. The embed templates use a bare "../../" but those are fixed-layout contexts.

Finding 4 (fetch / es6-promise "dead" bytes): You're right that they're not loaded by any IE conditional bundle — that's gone. But they're not dead: apps/common/locale.js:170 does a live window.fetch feature-detect on every editor load and dynamically require()s both polyfills if the browser lacks native fetch:

if ( !window.fetch ) {
    var polyfills = ['../vendor/fetch/fetch.umd'];
    if ( !window.Promise ) {
        require(['../vendor/es6-promise/es6-promise.auto.min'], ...);
    } else require(polyfills, _requireLang);
} else _requireLang();

So removing them from the manifest would break localisation on any browser that hits that path.

That said — you've raised a valid broader point. The browsers that lack native fetch are IE 11 (EOL June 2022) and Firefox 31–38 (2014–2015, current FF is 151). The browserslist still declares Firefox >= 31. There's no good reason to keep supporting Firefox 31 in 2026. Properly removing these polyfills means: raise the browser floor in the browserslist (suggest Firefox ESR so it tracks dynamically), remove the locale.js feature-detect guard, then drop the manifest entries. That's a product-level browser support decision though, not a build system change, so it's out of scope for this PR.

Filed as a follow-up: #129

[chrip]

✅ Resolved

• CI sequential steps (chrip Finding 1) — fixed in a4d8a5b0 via build-pipeline.js
• .claude/ and CLAUDE.md added to .gitignore, file removed from commit (juliusknorr)

---

🔴 Blocks merge

1. Missing Assisted-by: trailers — all 51 commits

Every commit has Co-Authored-By: Claude Sonnet 4.6 but none have the Assisted-by: trailer required by AGENTS.md. These are separate conventions; Co-Authored-By satisfies GitHub attribution but does not fulfil the policy requirement.

See AGENTS.md: "Add an Assisted-by: AGENT_NAME:MODEL_VERSION git trailer to every commit containing AI-assisted content."

Please rebase before merge. A one-liner covers all commits:
git rebase origin/main --exec 'git commit --amend --no-edit --trailer "Assisted-by: ClaudeCode:claude-sonnet-4-6"'

2. build/scripts/inline-svgs.js:126 — zero substitutions = hard build exit

if (totalSubstitutions === beforeEditor) {
    process.exitCode = 1;
}

This breaks CI the moment a template legitimately stops using inline SVG tags. Downgrade to console.warn, or add a --strict flag for pipelines that want the hard exit explicitly.

---

🟡 Should fix

3. Hardcoded baseUrl: "../../" in HTML deploy templates (index.html.deploy:416)

baseUrl: window.customBaseUrl || "../../",
Assumes a fixed deploy-directory depth. Suggest deriving from document.location.href at runtime, or documenting the constraint so operators know customBaseUrl is required in non-standard deployments.

4. Dead vendor artifacts (build/vendor.manifest.mjs:41–42)

fetch and es6-promise remain in the manifest after fix-ie-compat.js was deleted and IE paths removed from HTML. ~30 KB of unreachable bytes — please remove both entries.

5. Stale grunt references (build/README.md:248, 420)

Both lines still reference grunt --skip-imagemin. Rephrase as past tense or remove the command; the surrounding explanatory context can stay.

6. mobile:install outside Phase 1 banner (build/build-pipeline.js:257–273)

mobile:install runs before the Phase 1 banner; its dependents appear inside Phase 1. Output ordering is misleading in CI logs. Move mobile:install inside the phase or add a named pre-phase.

---

ℹ️ Investigated, not an issue

LaunchController.js window.require — code is window.require({waitSeconds: 0}, …), not a bare call; config is intact; correct.
scroller.less data-uri replacements — all 13 replacements correct; data-uri() is unavailable in webpack's less-loader.
o.kill() try/catch — adequately handles ESRCH from already-exited processes.

Assisted-by: ClaudeCode:claude-sonnet-4-6

[moodyjmz]

⚠️ Depends on #140 — fold in before/with this migration, or the #89 branding fix regresses

The ONLYOFFICE-branding fix (#139) ships on the grunt main line. Its source edits (Main.js gate, .deploy loader logo/title tokens) carry across a merge for free. The build-wiring half does not:

• Token substitution for {{APP_TITLE_TEXT}} / {{LOADER_LOGO}} / {{LOADER_LOGO_DARK}} in the editor HTML lives in Gruntfile.js replace:indexhtml on the grunt side.
• This migration deletes Gruntfile.js. On the webpack side that logic must live in build/scripts/deploy-html.js, which today substitutes only @@SRC_ROOT@@.

If the migration lands without it: Gruntfile.js is gone, the tokenized .deploy files survive from #139, deploy-html.js doesn't know the new tokens → every editor's loader ships src="{{LOADER_LOGO}}" and <title>{{APP_TITLE_TEXT}} …. #89 silently un-fixes itself the moment webpack becomes main.

#140 (parked draft, base build/webpack-migration) is exactly that deploy-html.js change. Merge it into this branch — or cherry-pick its deploy-html.js commit — before this PR lands. Flagging here so it doesn't fall through the branch gap.

🤖 Generated with Claude Code

[Aiiaiiio]

Tried it, works well