theseus/addon-build/docx-editor/patches.mjs

205 lines
7.8 KiB
JavaScript
Raw Normal View History

feat(docx-editor): edit Word documents without quietly eating what Word put in them A .docx editor is easy to write badly: read the file into HTML, let someone edit it, write a fresh document back, and hand them a file that lost its headers, its page size and half its formatting without ever saying so. Three things keep this one honest. The reader doesn't use mammoth's HTML. mammoth's converter is deliberately semantic, and HTML has nowhere to put a run's colour or a paragraph's line spacing, so it drops them — and those are controls this editor puts in the ribbon. Taking its parsed document model instead means what the ribbon offers is what the file can actually carry. Six properties mammoth's model didn't keep are added by build-time patches, each asserting its anchor so an upgrade that moves the code fails the build rather than shipping a lossy reader. The writer rebuilds the body but carries the rest of the package across: headers, footers, footnotes, endnotes, the document's own style catalogue, its theme and its page setup, with relationship ids and content types re-wired. Word features the editor can't model are still lost, so they are detected when the file opens and named in a banner before anyone edits. Tracked changes get their own gate. mammoth renders insertions as ordinary text and drops deletions, so saving would accept every pending revision without Word ever asking. Such a document opens read-only until the user says that is what they want. Verified over 66 real documents: 65 round-trip with an identical model and a structurally valid package, the one exception being a 7 MB WMF picture, which no browser can display and the writer cannot emit. Also driven end to end through a real Theseus over CDP — sidebar, ribbon, typing, save, reopen.
2026-09-20 20:46:29 +02:00
// Build-time patches applied to vendored mammoth.
//
// Why: mammoth's document model deliberately drops direct formatting that
// isn't semantic — run colour, paragraph line/space spacing — and flattens
// every numbering level to a bare isOrdered boolean. All three are v1 editor
// features (text colour, line spacing, numbered-list formats), so without
// these a document would visibly lose them on the first round-trip.
//
// Each patch asserts its anchor: if a mammoth upgrade moves the code, the
// build fails loudly instead of silently shipping an editor that eats
// formatting.
export const patches = [
{
file: "lib/docx/body-reader.js",
find: ` highlight: readHighlightValue(element.firstOrEmpty("w:highlight").attributes["w:val"])`,
replace: ` highlight: readHighlightValue(element.firstOrEmpty("w:highlight").attributes["w:val"]),
color: readColorValue(element.firstOrEmpty("w:color").attributes["w:val"])`,
},
{
file: "lib/docx/body-reader.js",
find: ` function readUnderline(element) {`,
replace: ` function readColorValue(value) {
// w:color w:val is RRGGBB, or "auto" meaning "let the renderer pick".
return /^[0-9a-fA-F]{6}$/.test(value || "") ? value.toUpperCase() : null;
}
function readParagraphSpacing(element) {
var attrs = element.attributes;
var line = attrs["w:line"];
var num = function(v) { return /^-?[0-9]+$/.test(v || "") ? parseInt(v, 10) : null; };
return {
// w:line is 240ths of a line when w:lineRule is auto (the common
// case); exact/atLeast are in twips and the reader leaves them be.
line: num(line),
lineRule: attrs["w:lineRule"] || null,
before: num(attrs["w:before"]),
after: num(attrs["w:after"])
};
}
function readUnderline(element) {`,
},
{
file: "lib/docx/body-reader.js",
find: ` indent: readParagraphIndent(element.firstOrEmpty("w:ind"))`,
replace: ` indent: readParagraphIndent(element.firstOrEmpty("w:ind")),
spacing: readParagraphSpacing(element.firstOrEmpty("w:spacing")),
// Word's horizontal rule is an empty paragraph with a bottom
// border; without this the editor can't tell one from a
// blank line, and can't write one back either.
hasBottomBorder: readHasBottomBorder(element.firstOrEmpty("w:pBdr"))`,
},
{
file: "lib/docx/body-reader.js",
find: ` function readParagraphIndent(element) {`,
replace: ` function readHasBottomBorder(element) {
var bottom = element.firstOrEmpty("w:bottom").attributes["w:val"];
return !!bottom && bottom !== "none" && bottom !== "nil";
}
function readParagraphIndent(element) {`,
},
// Images: mammoth hands back the file but not the size Word was drawing it
// at (wp:extent, in EMU). Without it a picture the author scaled down to a
// thumbnail would come back at full natural size on the next save.
{
file: "lib/docx/body-reader.js",
find: ` return readImage(blipImageFile, altText).map(function(imageElement) {`,
replace: ` var extentAttributes = element.firstOrEmpty("wp:extent").attributes;
return readImage(blipImageFile, altText, extentAttributes).map(function(imageElement) {`,
},
{
file: "lib/docx/body-reader.js",
find: ` function readImage(imageFile, altText) {
var contentType = contentTypes.findContentType(imageFile.path);
var image = documents.Image({
readImage: imageFile.read,
altText: altText,
contentType: contentType
});`,
replace: ` function readImage(imageFile, altText, extent) {
var contentType = contentTypes.findContentType(imageFile.path);
// 12700 EMU to the point.
var emuToPt = function(v) {
return /^[0-9]+$/.test(v || "") ? Math.round(parseInt(v, 10) / 12700 * 100) / 100 : null;
};
var image = documents.Image({
readImage: imageFile.read,
altText: altText,
contentType: contentType,
widthPt: emuToPt(extent && extent.cx),
heightPt: emuToPt(extent && extent.cy)
});`,
},
{
file: "lib/documents.js",
find: ` altText: options.altText,
contentType: options.contentType`,
replace: ` altText: options.altText,
contentType: options.contentType,
widthPt: options.widthPt == null ? null : options.widthPt,
heightPt: options.heightPt == null ? null : options.heightPt`,
},
{
file: "lib/documents.js",
find: ` highlight: properties.highlight || null
};
}`,
replace: ` highlight: properties.highlight || null,
color: properties.color || null
};
}`,
},
{
file: "lib/documents.js",
find: ` indent: {
start: indent.start || null,
end: indent.end || null,
firstLine: indent.firstLine || null,
hanging: indent.hanging || null
}
};`,
replace: ` indent: {
start: indent.start || null,
end: indent.end || null,
firstLine: indent.firstLine || null,
hanging: indent.hanging || null
},
spacing: properties.spacing || null,
hasBottomBorder: !!properties.hasBottomBorder
};`,
},
// Which numbering definition a list item belongs to. Word uses numId to
// tell two adjacent lists apart — the point at which the numbering starts
// again at 1 — and mammoth resolves it to a level and then forgets it,
// which leaves the reader unable to see where one list ends and the next
// begins.
{
file: "lib/docx/body-reader.js",
find: `function readNumberingProperties(styleId, element, numbering) {
var level = element.firstOrEmpty("w:ilvl").attributes["w:val"];
var numId = element.firstOrEmpty("w:numId").attributes["w:val"];
if (level !== undefined && numId !== undefined) {
return numbering.findLevel(numId, level);
}`,
replace: `function readNumberingProperties(styleId, element, numbering) {
var level = element.firstOrEmpty("w:ilvl").attributes["w:val"];
var numId = element.firstOrEmpty("w:numId").attributes["w:val"];
var withNumId = function(found, id) {
return found == null ? found : Object.assign({}, found, {numId: id == null ? null : String(id)});
};
if (level !== undefined && numId !== undefined) {
return withNumId(numbering.findLevel(numId, level), numId);
}`,
},
{
file: "lib/docx/body-reader.js",
find: ` if (numId !== undefined) {
return numbering.findLevel(numId, "0");
}
return null;
}`,
replace: ` if (numId !== undefined) {
return withNumId(numbering.findLevel(numId, "0"), numId);
}
return null;
}`,
},
{
file: "lib/docx/numbering-xml.js",
find: ` levelWithoutIndex = {
isOrdered: isOrdered,`,
replace: ` levelWithoutIndex = {
numFmt: numFmt || null,
isOrdered: isOrdered,`,
},
{
file: "lib/docx/numbering-xml.js",
find: ` levels[levelIndex] = {
isOrdered: isOrdered,`,
replace: ` levels[levelIndex] = {
numFmt: numFmt || null,
isOrdered: isOrdered,`,
},
];
export function applyPatches(relPath, source) {
let out = source;
let hits = 0;
for (const p of patches) {
if (relPath !== "mammoth/" + p.file) continue;
if (!out.includes(p.find)) {
throw new Error(`mammoth patch anchor missing in ${p.file}:\n${p.find.slice(0, 90)}\n` +
`A mammoth upgrade probably moved it. Re-check the patch before shipping.`);
}
out = out.replace(p.find, p.replace);
hits++;
}
return { code: out, hits };
}