@beyondwork/docx-react-component 1.0.0

package/test/io/table-media-roundtrip.test.ts

@@ -0,0 +1,448 @@
+import assert from "node:assert/strict";
+import { mkdirSync, writeFileSync } from "node:fs";
+import test from "node:test";
+import { deflateRawSync, inflateRawSync } from "node:zlib";
+
+import { serializeTable } from "../../src/io/export/serialize-tables.ts";
+import { parseInlineMediaXml } from "../../src/io/ooxml/parse-inline-media.ts";
+import { parseTablesFromDocumentXml } from "../../src/io/ooxml/parse-tables.ts";
+
+const DOCX_DOCUMENT_CONTENT_TYPE =
+  "application/vnd.openxmlformats-officedocument.wordprocessingml.document.main+xml";
+const DOCX_DOCUMENT_RELATIONSHIP_TYPE =
+  "http://schemas.openxmlformats.org/officeDocument/2006/relationships/officeDocument";
+
+test("tables and inline media preserve merged-cell semantics and image relationship integrity", () => {
+  const documentXml = `<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
+<w:document
+  xmlns:a="http://schemas.openxmlformats.org/drawingml/2006/main"
+  xmlns:pic="http://schemas.openxmlformats.org/drawingml/2006/picture"
+  xmlns:r="http://schemas.openxmlformats.org/officeDocument/2006/relationships"
+  xmlns:wp="http://schemas.openxmlformats.org/drawingml/2006/wordprocessingDrawing"
+  xmlns:w="http://schemas.openxmlformats.org/wordprocessingml/2006/main">
+  <w:body>
+    <w:tbl>
+      <w:tblPr>
+        <w:tblStyle w:val="TableGrid"/>
+      </w:tblPr>
+      <w:tblGrid>
+        <w:gridCol w:w="2400"/>
+        <w:gridCol w:w="2400"/>
+        <w:gridCol w:w="2400"/>
+      </w:tblGrid>
+      <w:tr>
+        <w:tc>
+          <w:tcPr>
+            <w:gridSpan w:val="2"/>
+          </w:tcPr>
+          <w:p><w:r><w:t>Signature Block</w:t></w:r></w:p>
+        </w:tc>
+        <w:tc>
+          <w:tcPr>
+            <w:vMerge w:val="restart"/>
+          </w:tcPr>
+          <w:p><w:r><w:t>Initial</w:t></w:r></w:p>
+        </w:tc>
+      </w:tr>
+      <w:tr>
+        <w:tc>
+          <w:p><w:r><w:t>Signer</w:t></w:r></w:p>
+        </w:tc>
+        <w:tc>
+          <w:p><w:r><w:t>Date</w:t></w:r></w:p>
+        </w:tc>
+        <w:tc>
+          <w:tcPr>
+            <w:vMerge/>
+          </w:tcPr>
+          <w:p>
+            <w:r>
+              <w:drawing>
+                <wp:inline>
+                  <wp:extent cx="9525" cy="9525"/>
+                  <wp:docPr id="7" name="Signature Image" descr="Executed signature"/>
+                  <wp:cNvGraphicFramePr/>
+                  <a:graphic>
+                    <a:graphicData uri="http://schemas.openxmlformats.org/drawingml/2006/picture">
+                      <pic:pic>
+                        <pic:nvPicPr>
+                          <pic:cNvPr id="0" name="image1.png"/>
+                          <pic:cNvPicPr/>
+                        </pic:nvPicPr>
+                        <pic:blipFill>
+                          <a:blip r:embed="rIdImage1"/>
+                          <a:stretch>
+                            <a:fillRect/>
+                          </a:stretch>
+                        </pic:blipFill>
+                        <pic:spPr>
+                          <a:xfrm>
+                            <a:off x="0" y="0"/>
+                            <a:ext cx="9525" cy="9525"/>
+                          </a:xfrm>
+                          <a:prstGeom prst="rect">
+                            <a:avLst/>
+                          </a:prstGeom>
+                        </pic:spPr>
+                      </pic:pic>
+                    </a:graphicData>
+                  </a:graphic>
+                </wp:inline>
+              </w:drawing>
+            </w:r>
+          </w:p>
+        </w:tc>
+      </w:tr>
+    </w:tbl>
+    <w:sectPr/>
+  </w:body>
+</w:document>`;
+
+  const documentRelationships = [
+    {
+      id: "rIdImage1",
+      type: "http://schemas.openxmlformats.org/officeDocument/2006/relationships/image",
+      target: "media/image1.png",
+      targetMode: "internal" as const,
+    },
+  ];
+
+  const parsed = parseTablesFromDocumentXml(documentXml);
+  assert.equal(parsed.tables.length, 1);
+
+  const table = parsed.tables[0];
+  assert.deepEqual(table.gridColumns, [2400, 2400, 2400]);
+  assert.equal(table.rows[0]?.cells[0]?.gridSpan, 2);
+  assert.equal(table.rows[0]?.cells[1]?.verticalMerge, "restart");
+  assert.equal(table.rows[1]?.cells[2]?.verticalMerge, "continue");
+
+  const media = parseInlineMediaXml(
+    table.rows[1]?.cells[2]?.blocksXml.join("") ?? "",
+    documentRelationships,
+    new Map([
+      [
+        "/word/media/image1.png",
+        {
+          path: "/word/media/image1.png",
+          contentType: "image/png",
+        },
+      ],
+    ]),
+  );
+  assert.deepEqual(media, [
+    {
+      type: "image",
+      mediaId: "media:word/media/image1.png",
+      relationshipId: "rIdImage1",
+      packagePartName: "/word/media/image1.png",
+      contentType: "image/png",
+      filename: "image1.png",
+      altText: "Executed signature",
+    },
+  ]);
+
+  const serializedTableXml = serializeTable(table);
+  assert.match(serializedTableXml, /<w:gridSpan w:val="2"\/>/);
+  assert.match(serializedTableXml, /<w:vMerge w:val="restart"\/>/);
+  assert.match(serializedTableXml, /<w:vMerge\/>/);
+  assert.match(serializedTableXml, /r:embed="rIdImage1"/);
+
+  const editedDocumentXml = documentXml.replace(table.rawXml, serializedTableXml);
+  const exportedBytes = createFixturePackage(editedDocumentXml, documentRelationships);
+  const exportedPath = ".tmp/wave-4-structure/exports/F06-F07-table-media-roundtrip.docx";
+  const referencedRelationshipIds = [
+    ...editedDocumentXml.matchAll(/\br:embed=(["'])([^"']+)\1/g),
+  ].map((match) => match[2] ?? "");
+  const missingRelationships = referencedRelationshipIds.filter(
+    (relationshipId) =>
+      !documentRelationships.some((relationship) => relationship.id === relationshipId),
+  );
+  assert.deepEqual(
+    missingRelationships,
+    [],
+    `Expected every inline image reference to resolve to a declared relationship, missing ${JSON.stringify(missingRelationships)}`,
+  );
+
+  const reparsed = parseTablesFromDocumentXml(editedDocumentXml);
+  assert.equal(reparsed.tables[0]?.rows[0]?.cells[0]?.gridSpan, 2);
+  assert.equal(reparsed.tables[0]?.rows[0]?.cells[1]?.verticalMerge, "restart");
+  assert.equal(reparsed.tables[0]?.rows[1]?.cells[2]?.verticalMerge, "continue");
+
+  const exportedEntries = readZipEntries(exportedBytes);
+  const exportedDocumentPart = exportedEntries.get("word/document.xml");
+  const exportedDocumentRelationships = exportedEntries.get("word/_rels/document.xml.rels");
+  const exportedPackageRelationships = exportedEntries.get("_rels/.rels");
+  const exportedContentTypes = exportedEntries.get("[Content_Types].xml");
+  const exportedMediaPart = exportedEntries.get("word/media/image1.png");
+
+  assert.equal(exportedDocumentPart, editedDocumentXml);
+  assert.ok(
+    exportedDocumentRelationships?.includes('Relationship Id="rIdImage1"'),
+    "Expected image relationship in document relationships part.",
+  );
+  assert.ok(
+    exportedDocumentRelationships?.includes('Target="media/image1.png"'),
+    "Expected inline image relationship target in document relationships part.",
+  );
+  assert.ok(
+    exportedPackageRelationships?.includes(
+      `Type="${DOCX_DOCUMENT_RELATIONSHIP_TYPE}"`,
+    ),
+    "Expected officeDocument package relationship.",
+  );
+  assert.ok(
+    exportedContentTypes?.includes(`ContentType="${DOCX_DOCUMENT_CONTENT_TYPE}"`),
+    "Expected main document override in content types.",
+  );
+  assert.ok(
+    exportedContentTypes?.includes('Extension="png" ContentType="image/png"'),
+    "Expected PNG content type default.",
+  );
+  assert.deepEqual(
+    Buffer.from(exportedMediaPart ?? "", "binary"),
+    Buffer.from(PNG_BYTES),
+    "Expected inline image binary to survive package export.",
+  );
+
+  mkdirSync(".tmp/wave-4-structure", { recursive: true });
+  mkdirSync(".tmp/wave-4-structure/exports", { recursive: true });
+  writeFileSync(exportedPath, Buffer.from(exportedBytes), "binary");
+  writeFileSync(
+    ".tmp/wave-4-structure/table-media-roundtrip-report.json",
+    `${JSON.stringify(
+      {
+        reportVersion: "wave-4-table-media/1",
+        generatedAt: new Date().toISOString(),
+        exportedPath,
+        mergedCellSemantics: {
+          gridColumns: table.gridColumns,
+          firstRowGridSpan: table.rows[0]?.cells[0]?.gridSpan ?? null,
+          verticalMerge: [
+            table.rows[0]?.cells[1]?.verticalMerge ?? null,
+            table.rows[1]?.cells[2]?.verticalMerge ?? null,
+          ],
+        },
+        inlineMedia: media,
+        referencedRelationshipIds,
+        declaredRelationships: documentRelationships,
+        missingRelationships,
+        exportedPackage: {
+          entries: [...exportedEntries.keys()],
+          documentRelationshipsXml: exportedDocumentRelationships ?? null,
+          packageRelationshipsXml: exportedPackageRelationships ?? null,
+          contentTypesXml: exportedContentTypes ?? null,
+          imageByteLength: exportedMediaPart ? Buffer.from(exportedMediaPart, "binary").byteLength : null,
+        },
+      },
+      null,
+      2,
+    )}\n`,
+    "utf8",
+  );
+});
+
+const PNG_BYTES = Uint8Array.from([
+  0x89, 0x50, 0x4e, 0x47,
+  0x0d, 0x0a, 0x1a, 0x0a,
+  0x00, 0x00, 0x00, 0x0d,
+  0x49, 0x48, 0x44, 0x52,
+  0x00, 0x00, 0x00, 0x01,
+  0x00, 0x00, 0x00, 0x01,
+  0x08, 0x06, 0x00, 0x00,
+  0x00, 0x1f, 0x15, 0xc4,
+  0x89, 0x00, 0x00, 0x00,
+  0x0d, 0x49, 0x44, 0x41,
+  0x54, 0x78, 0x9c, 0x63,
+  0xf8, 0xcf, 0xc0, 0x00,
+  0x00, 0x03, 0x01, 0x01,
+  0x00, 0xc9, 0xfe, 0x92,
+  0xef, 0x00, 0x00, 0x00,
+  0x00, 0x49, 0x45, 0x4e,
+  0x44, 0xae, 0x42, 0x60,
+  0x82,
+]);
+
+function createFixturePackage(
+  documentXml: string,
+  documentRelationships: Array<{
+    id: string;
+    type: string;
+    target: string;
+    targetMode: "internal";
+  }>,
+): Uint8Array {
+  return buildZipArchive([
+    {
+      path: "[Content_Types].xml",
+      bytes: encodeXml(`<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
+<Types xmlns="http://schemas.openxmlformats.org/package/2006/content-types">
+  <Default Extension="png" ContentType="image/png"/>
+  <Default Extension="rels" ContentType="application/vnd.openxmlformats-package.relationships+xml"/>
+  <Default Extension="xml" ContentType="application/xml"/>
+  <Override PartName="/word/document.xml" ContentType="${DOCX_DOCUMENT_CONTENT_TYPE}"/>
+</Types>`),
+    },
+    {
+      path: "_rels/.rels",
+      bytes: encodeXml(`<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
+<Relationships xmlns="http://schemas.openxmlformats.org/package/2006/relationships">
+  <Relationship Id="rId1" Type="${DOCX_DOCUMENT_RELATIONSHIP_TYPE}" Target="word/document.xml"/>
+</Relationships>`),
+    },
+    {
+      path: "word/document.xml",
+      bytes: encodeXml(documentXml),
+    },
+    {
+      path: "word/_rels/document.xml.rels",
+      bytes: encodeXml(`<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
+<Relationships xmlns="http://schemas.openxmlformats.org/package/2006/relationships">
+${documentRelationships
+  .map(
+    (relationship) =>
+      `  <Relationship Id="${escapeXml(relationship.id)}" Type="${escapeXml(relationship.type)}" Target="${escapeXml(relationship.target)}"/>`,
+  )
+  .join("\n")}
+</Relationships>`),
+    },
+    {
+      path: "word/media/image1.png",
+      bytes: PNG_BYTES,
+    },
+  ]);
+}
+
+function buildZipArchive(entries: Array<{ path: string; bytes: Uint8Array }>): Uint8Array {
+  const localChunks: Buffer[] = [];
+  const centralChunks: Buffer[] = [];
+  let localOffset = 0;
+
+  for (const entry of entries) {
+    const fileName = Buffer.from(entry.path, "utf8");
+    const compressedBytes = Buffer.from(deflateRawSync(Buffer.from(entry.bytes)));
+    const crc32 = calculateCrc32(entry.bytes);
+    const localHeader = Buffer.alloc(30 + fileName.length);
+
+    localHeader.writeUInt32LE(0x04034b50, 0);
+    localHeader.writeUInt16LE(20, 4);
+    localHeader.writeUInt16LE(0, 6);
+    localHeader.writeUInt16LE(8, 8);
+    localHeader.writeUInt16LE(0, 10);
+    localHeader.writeUInt16LE(0, 12);
+    localHeader.writeUInt32LE(crc32 >>> 0, 14);
+    localHeader.writeUInt32LE(compressedBytes.byteLength, 18);
+    localHeader.writeUInt32LE(entry.bytes.byteLength, 22);
+    localHeader.writeUInt16LE(fileName.length, 26);
+    localHeader.writeUInt16LE(0, 28);
+    fileName.copy(localHeader, 30);
+
+    localChunks.push(localHeader, compressedBytes);
+
+    const centralHeader = Buffer.alloc(46 + fileName.length);
+    centralHeader.writeUInt32LE(0x02014b50, 0);
+    centralHeader.writeUInt16LE(20, 4);
+    centralHeader.writeUInt16LE(20, 6);
+    centralHeader.writeUInt16LE(0, 8);
+    centralHeader.writeUInt16LE(8, 10);
+    centralHeader.writeUInt16LE(0, 12);
+    centralHeader.writeUInt16LE(0, 14);
+    centralHeader.writeUInt32LE(crc32 >>> 0, 16);
+    centralHeader.writeUInt32LE(compressedBytes.byteLength, 20);
+    centralHeader.writeUInt32LE(entry.bytes.byteLength, 24);
+    centralHeader.writeUInt16LE(fileName.length, 28);
+    centralHeader.writeUInt16LE(0, 30);
+    centralHeader.writeUInt16LE(0, 32);
+    centralHeader.writeUInt16LE(0, 34);
+    centralHeader.writeUInt16LE(0, 36);
+    centralHeader.writeUInt32LE(0, 38);
+    centralHeader.writeUInt32LE(localOffset, 42);
+    fileName.copy(centralHeader, 46);
+    centralChunks.push(centralHeader);
+
+    localOffset += localHeader.byteLength + compressedBytes.byteLength;
+  }
+
+  const centralDirectory = Buffer.concat(centralChunks);
+  const endOfCentralDirectory = Buffer.alloc(22);
+  endOfCentralDirectory.writeUInt32LE(0x06054b50, 0);
+  endOfCentralDirectory.writeUInt16LE(0, 4);
+  endOfCentralDirectory.writeUInt16LE(0, 6);
+  endOfCentralDirectory.writeUInt16LE(entries.length, 8);
+  endOfCentralDirectory.writeUInt16LE(entries.length, 10);
+  endOfCentralDirectory.writeUInt32LE(centralDirectory.byteLength, 12);
+  endOfCentralDirectory.writeUInt32LE(localOffset, 16);
+  endOfCentralDirectory.writeUInt16LE(0, 20);
+
+  return new Uint8Array(
+    Buffer.concat([...localChunks, centralDirectory, endOfCentralDirectory]),
+  );
+}
+
+function readZipEntries(bytes: Uint8Array): Map<string, string> {
+  const archive = Buffer.from(bytes.buffer, bytes.byteOffset, bytes.byteLength);
+  const entries = new Map<string, string>();
+  const endOfCentralDirectory = findEndOfCentralDirectory(archive);
+  const entryCount = archive.readUInt16LE(endOfCentralDirectory + 10);
+  let offset = archive.readUInt32LE(endOfCentralDirectory + 16);
+
+  for (let index = 0; index < entryCount; index += 1) {
+    assert.equal(archive.readUInt32LE(offset), 0x02014b50, "Expected ZIP central directory entry.");
+    const compressedSize = archive.readUInt32LE(offset + 20);
+    const fileNameLength = archive.readUInt16LE(offset + 28);
+    const extraLength = archive.readUInt16LE(offset + 30);
+    const commentLength = archive.readUInt16LE(offset + 32);
+    const localHeaderOffset = archive.readUInt32LE(offset + 42);
+    const path = archive.subarray(offset + 46, offset + 46 + fileNameLength).toString("utf8");
+    const localFileNameLength = archive.readUInt16LE(localHeaderOffset + 26);
+    const localExtraLength = archive.readUInt16LE(localHeaderOffset + 28);
+    const dataOffset = localHeaderOffset + 30 + localFileNameLength + localExtraLength;
+    const compressed = archive.subarray(dataOffset, dataOffset + compressedSize);
+    const uncompressed = inflateRawSync(compressed);
+
+    entries.set(
+      path,
+      path.endsWith(".png") ? Buffer.from(uncompressed).toString("binary") : Buffer.from(uncompressed).toString("utf8"),
+    );
+
+    offset += 46 + fileNameLength + extraLength + commentLength;
+  }
+
+  return entries;
+}
+
+function findEndOfCentralDirectory(archive: Buffer): number {
+  for (let offset = archive.length - 22; offset >= 0; offset -= 1) {
+    if (archive.readUInt32LE(offset) === 0x06054b50) {
+      return offset;
+    }
+  }
+
+  throw new Error("Expected ZIP end of central directory.");
+}
+
+function calculateCrc32(bytes: Uint8Array): number {
+  let crc = 0xffffffff;
+
+  for (const byte of bytes) {
+    crc ^= byte;
+    for (let bit = 0; bit < 8; bit += 1) {
+      const mask = -(crc & 1);
+      crc = (crc >>> 1) ^ (0xedb88320 & mask);
+    }
+  }
+
+  return (crc ^ 0xffffffff) >>> 0;
+}
+
+function encodeXml(xml: string): Uint8Array {
+  return new TextEncoder().encode(xml);
+}
+
+function escapeXml(value: string): string {
+  return value
+    .replace(/&/g, "&amp;")
+    .replace(/"/g, "&quot;")
+    .replace(/</g, "&lt;")
+    .replace(/>/g, "&gt;")
+    .replace(/'/g, "&apos;");
+}