test: add TIFF MIME, fallback, and branch coverage tests; extract shared dataUriToArrayBuffer helper

Address remaining PR review feedback: add tests for .tif → image/tiff MIME mapping
(import data URI and export Content_Types), TIFF conversion failure fallback alt text,
greyscale/grey+alpha/Uint16/Float32 toRGBA branches, and extract duplicate data-URI-stripping
logic from metafile-converter and tiff-converter into shared dataUriToArrayBuffer in helpers.js.

Author: gpardhivvarma

packages/super-editor/src/core/DocxZipper.test.js

@@ -338,6 +338,64 @@ describe('DocxZipper - exportFromCollaborativeDocx media handling', () => {
   });
 });
 
+describe('DocxZipper - .tif MIME type mapping', () => {
+  it('produces image/tiff data URI for .tif files on import', async () => {
+    const zipper = new DocxZipper();
+    const zip = new JSZip();
+
+    const contentTypes = `<?xml version="1.0" encoding="UTF-8"?>
+      <Types xmlns="http://schemas.openxmlformats.org/package/2006/content-types">
+        <Default Extension="rels" ContentType="application/vnd.openxmlformats-package.relationships+xml"/>
+        <Default Extension="xml" ContentType="application/xml"/>
+        <Override PartName="/word/document.xml" ContentType="application/vnd.openxmlformats-officedocument.wordprocessingml.document.main+xml"/>
+      </Types>`;
+    zip.file('[Content_Types].xml', contentTypes);
+    zip.file('word/document.xml', '<w:document/>');
+
+    // Arbitrary binary data stored as a .tif file
+    const tifData = new Uint8Array([0x49, 0x49, 0x2a, 0x00, 0x08, 0x00, 0x00, 0x00]);
+    zip.file('word/media/image1.tif', tifData);
+
+    const buf = await zip.generateAsync({ type: 'arraybuffer' });
+    await zipper.getDocxData(buf, false);
+
+    // Must use image/tiff, not image/tif
+    expect(zipper.mediaFiles['word/media/image1.tif']).toMatch(/^data:image\/tiff;base64,/);
+  });
+
+  it('writes image/tiff content type in [Content_Types].xml on export', async () => {
+    const zipper = new DocxZipper();
+
+    const contentTypes = `<?xml version="1.0" encoding="UTF-8"?>
+      <Types xmlns="http://schemas.openxmlformats.org/package/2006/content-types">
+        <Default Extension="rels" ContentType="application/vnd.openxmlformats-package.relationships+xml"/>
+        <Default Extension="xml" ContentType="application/xml"/>
+        <Override PartName="/word/document.xml" ContentType="application/vnd.openxmlformats-officedocument.wordprocessingml.document.main+xml"/>
+      </Types>`;
+
+    const docx = [
+      { name: '[Content_Types].xml', content: contentTypes },
+      { name: 'word/document.xml', content: '<w:document/>' },
+    ];
+
+    const result = await zipper.updateZip({
+      docx,
+      updatedDocs: {},
+      media: { 'word/media/image1.tif': 'AAAA' },
+      fonts: {},
+      isHeadless: true,
+    });
+
+    const readBack = await new JSZip().loadAsync(result);
+    const updatedContentTypes = await readBack.file('[Content_Types].xml').async('string');
+
+    // Should contain Extension="tif" with ContentType="image/tiff"
+    expect(updatedContentTypes).toContain('Extension="tif"');
+    expect(updatedContentTypes).toContain('ContentType="image/tiff"');
+    expect(updatedContentTypes).not.toContain('ContentType="image/tif"');
+  });
+});
+
 describe('DocxZipper - .tmp image file detection', () => {
   it('detects and processes .tmp files with PNG signatures as PNG images', async () => {
     const zipper = new DocxZipper();

packages/super-editor/src/core/super-converter/helpers.js

@@ -33,6 +33,33 @@ function base64ToUint8Array(base64) {
   return bytes;
 }
 
+/**
+ * Convert a base64 string or data URI to an ArrayBuffer.
+ * Accepts ArrayBuffer, TypedArray, data URI, or raw base64 string.
+ *
+ * @param {string|ArrayBuffer|Uint8Array} data
+ * @returns {ArrayBuffer}
+ */
+function dataUriToArrayBuffer(data) {
+  if (data instanceof ArrayBuffer) return data;
+  if (ArrayBuffer.isView(data)) return data.buffer.slice(data.byteOffset, data.byteOffset + data.byteLength);
+
+  if (typeof data !== 'string') {
+    throw new Error('Unsupported data type for conversion to ArrayBuffer');
+  }
+
+  let base64 = data;
+  if (data.startsWith('data:')) {
+    const commaIndex = data.indexOf(',');
+    if (commaIndex === -1) {
+      throw new Error('Invalid data URI: missing base64 content');
+    }
+    base64 = data.substring(commaIndex + 1);
+  }
+
+  return base64ToUint8Array(base64).buffer;
+}
+
 // CSS pixels per inch; used to convert between Word's inch-based measurements and DOM pixels.
 const PIXELS_PER_INCH = 96;
 
@@ -720,5 +747,6 @@ export {
   resolveOpcTargetPath,
   computeCrc32Hex,
   base64ToUint8Array,
+  dataUriToArrayBuffer,
   detectImageType,
 };

packages/super-editor/src/core/super-converter/v3/handlers/w/p/helpers/legacy-handle-paragraph-node.test.js

@@ -13,12 +13,16 @@ vi.mock('@converter/v2/importer/index.js', () => ({
 }));
 
 // Simple and predictable conversion for positions
-vi.mock('@converter/helpers.js', () => ({
-  twipsToPixels: (twips) => (twips === undefined ? undefined : Number(twips) / 20),
-  twipsToInches: (twips) => (twips === undefined ? undefined : Number(twips) / 10),
-  twipsToLines: (twips) => (twips === undefined ? undefined : Number(twips) / 240),
-  pixelsToTwips: (pixels) => (pixels === undefined ? undefined : Math.round(Number(pixels) * 20)),
-}));
+vi.mock('@converter/helpers.js', async (importOriginal) => {
+  const actual = await importOriginal();
+  return {
+    ...actual,
+    twipsToPixels: (twips) => (twips === undefined ? undefined : Number(twips) / 20),
+    twipsToInches: (twips) => (twips === undefined ? undefined : Number(twips) / 10),
+    twipsToLines: (twips) => (twips === undefined ? undefined : Number(twips) / 240),
+    pixelsToTwips: (pixels) => (pixels === undefined ? undefined : Math.round(Number(pixels) * 20)),
+  };
+});
 
 import { handleParagraphNode } from './legacy-handle-paragraph-node.js';
 import { parseMarks, mergeTextNodes } from '@converter/v2/importer/index.js';

packages/super-editor/src/core/super-converter/v3/handlers/wp/helpers/decode-image-node-helpers.test.js

@@ -5,18 +5,22 @@ import {
 import * as helpers from '@converter/helpers.js';
 import * as annotationHelpers from '@converter/v3/handlers/w/sdt/helpers/translate-field-annotation.js';
 
-vi.mock('@converter/helpers.js', () => ({
-  emuToPixels: vi.fn((v) => v / 9525), // 1 emu ≈ 1/9525 px
-  pixelsToEmu: vi.fn((v) => v * 9525),
-  getTextIndentExportValue: vi.fn((v) => v),
-  inchesToTwips: vi.fn((v) => v),
-  linesToTwips: vi.fn((v) => v),
-  pixelsToEightPoints: vi.fn((v) => v),
-  pixelsToTwips: vi.fn((v) => v),
-  ptToTwips: vi.fn((v) => v),
-  rgbToHex: vi.fn(() => '#000000'),
-  degreesToRot: vi.fn((v) => v),
-}));
+vi.mock('@converter/helpers.js', async (importOriginal) => {
+  const actual = await importOriginal();
+  return {
+    ...actual,
+    emuToPixels: vi.fn((v) => v / 9525), // 1 emu ≈ 1/9525 px
+    pixelsToEmu: vi.fn((v) => v * 9525),
+    getTextIndentExportValue: vi.fn((v) => v),
+    inchesToTwips: vi.fn((v) => v),
+    linesToTwips: vi.fn((v) => v),
+    pixelsToEightPoints: vi.fn((v) => v),
+    pixelsToTwips: vi.fn((v) => v),
+    ptToTwips: vi.fn((v) => v),
+    rgbToHex: vi.fn(() => '#000000'),
+    degreesToRot: vi.fn((v) => v),
+  };
+});
 
 vi.mock('@converter/v3/handlers/w/sdt/helpers/translate-field-annotation.js', () => ({
   prepareTextAnnotation: vi.fn(() => ({ type: 'text', text: 'annotation' })),

packages/super-editor/src/core/super-converter/v3/handlers/wp/helpers/encode-image-node-helpers.test.js

@@ -244,6 +244,20 @@ describe('handleImageNode', () => {
     expect(result.attrs.extension).toBe('png');
   });
 
+  it('returns alt text when convertTiffToPng returns null', () => {
+    convertTiffToPng.mockReturnValue(null);
+    const node = makeNode();
+    const params = {
+      ...makeParams('media/photo.tif'),
+      converter: { media: { 'word/media/photo.tif': 'data:image/tiff;base64,AAAA' } },
+    };
+    const result = handleImageNode(node, params, false);
+
+    expect(convertTiffToPng).toHaveBeenCalledWith('data:image/tiff;base64,AAAA');
+    expect(result.attrs.alt).toBe('Unable to render image');
+    expect(result.attrs.extension).toBe('tif');
+  });
+
   it('captures unhandled drawing children for passthrough preservation', () => {
     const node = makeNode();
     node.elements.push({

packages/super-editor/src/core/super-converter/v3/handlers/wp/helpers/metafile-converter.js

@@ -15,7 +15,7 @@
 /* global btoa, XMLSerializer */
 
 import { EMFJS, WMFJS } from './rtfjs';
-import { base64ToUint8Array } from '../../../../helpers.js';
+import { dataUriToArrayBuffer } from '../../../../helpers.js';
 
 // Disable verbose logging from the renderers
 EMFJS.loggingEnabled(false);
@@ -74,39 +74,8 @@ const MM_ANISOTROPIC = 8;
 const EMF_SIGNATURE = 0x464d4520; // ' EMF'
 const EMF_PLUS_SIGNATURE = 0x2b464d45; // 'EMF+' inside EMR_COMMENT
 
-/**
- * Converts input data to an ArrayBuffer.
- *
- * Accepts:
- * - ArrayBuffer
- * - TypedArray / Buffer
- * - base64 string or data URI
- *
- * @param {string|ArrayBuffer|Uint8Array} data
- * @returns {ArrayBuffer}
- */
-function base64ToArrayBuffer(data) {
-  if (data instanceof ArrayBuffer) return data;
-  if (ArrayBuffer.isView(data)) return data.buffer.slice(data.byteOffset, data.byteOffset + data.byteLength);
-
-  if (typeof data !== 'string') {
-    throw new Error('Unsupported data type for conversion to ArrayBuffer');
-  }
-
-  // Handle both data URI format and raw base64
-  let base64 = data;
-
-  // Check if it's a data URI and extract the base64 portion
-  if (data.startsWith('data:')) {
-    const commaIndex = data.indexOf(',');
-    if (commaIndex === -1) {
-      throw new Error('Invalid data URI: missing base64 content');
-    }
-    base64 = data.substring(commaIndex + 1);
-  }
-
-  return base64ToUint8Array(base64).buffer;
-}
+// Re-export for local use — shared implementation lives in ../../../../helpers.js
+const base64ToArrayBuffer = dataUriToArrayBuffer;
 
 /**
  * Encodes a Uint8Array into base64 using chunked processing to avoid call stack overflows.

packages/super-editor/src/core/super-converter/v3/handlers/wp/helpers/tiff-converter.js

@@ -9,7 +9,7 @@
  */
 
 import { decode } from 'tiff';
-import { base64ToUint8Array } from '../../../../helpers.js';
+import { dataUriToArrayBuffer } from '../../../../helpers.js';
 
 // Optional DOM environment provided by callers (e.g., JSDOM in Node)
 let domEnvironment = null;
@@ -116,16 +116,7 @@ export function convertTiffToPng(data) {
   try {
     if (typeof data !== 'string') return null;
 
-    // Parse input — accept data URI or raw base64
-    let base64 = data;
-    if (data.startsWith('data:')) {
-      const commaIndex = data.indexOf(',');
-      if (commaIndex === -1) return null;
-      base64 = data.substring(commaIndex + 1);
-    }
-    const bytes = base64ToUint8Array(base64);
-
-    const buffer = bytes.buffer.slice(bytes.byteOffset, bytes.byteOffset + bytes.byteLength);
+    const buffer = dataUriToArrayBuffer(data);
 
     // Read metadata first without decompressing pixel data so the size
     // guard fires before a huge RGBA buffer is allocated.

packages/super-editor/src/core/super-converter/v3/handlers/wp/helpers/tiff-converter.test.js

@@ -90,6 +90,134 @@ describe('tiff-converter', () => {
       });
     });
 
+    it('converts a greyscale (1 channel) TIFF to PNG', () => {
+      // 2x2 greyscale: pixel values [50, 100, 150, 200]
+      const greyData = new Uint8Array([50, 100, 150, 200]);
+      vi.doMock('tiff', () => ({
+        decode: (_buf, opts) => {
+          if (opts?.ignoreImageData) return [{ width: 2, height: 2 }];
+          return [{ width: 2, height: 2, data: greyData, samplesPerPixel: 1, alpha: false }];
+        },
+      }));
+
+      const mockCanvas = {
+        width: 0,
+        height: 0,
+        getContext: () => ({
+          createImageData: (w, h) => ({ data: new Uint8Array(w * h * 4), width: w, height: h }),
+          putImageData: () => {},
+        }),
+        toDataURL: () => 'data:image/png;base64,grey',
+      };
+      const spy = vi.spyOn(document, 'createElement').mockReturnValue(mockCanvas);
+
+      return import('./tiff-converter.js?grey').then(({ convertTiffToPng: fn }) => {
+        const result = fn('SU8qAA==');
+        expect(result).toEqual({ dataUri: 'data:image/png;base64,grey', format: 'png' });
+        spy.mockRestore();
+        vi.doUnmock('tiff');
+      });
+    });
+
+    it('converts a grey+alpha (2 channel) TIFF to PNG', () => {
+      // 2x1 grey+alpha: [grey, alpha, grey, alpha]
+      const greyAlphaData = new Uint8Array([128, 255, 64, 128]);
+      vi.doMock('tiff', () => ({
+        decode: (_buf, opts) => {
+          if (opts?.ignoreImageData) return [{ width: 2, height: 1 }];
+          return [{ width: 2, height: 1, data: greyAlphaData, samplesPerPixel: 2, alpha: true }];
+        },
+      }));
+
+      const mockCanvas = {
+        width: 0,
+        height: 0,
+        getContext: () => ({
+          createImageData: (w, h) => ({ data: new Uint8Array(w * h * 4), width: w, height: h }),
+          putImageData: () => {},
+        }),
+        toDataURL: () => 'data:image/png;base64,greyAlpha',
+      };
+      const spy = vi.spyOn(document, 'createElement').mockReturnValue(mockCanvas);
+
+      return import('./tiff-converter.js?greyAlpha').then(({ convertTiffToPng: fn }) => {
+        const result = fn('SU8qAA==');
+        expect(result).toEqual({ dataUri: 'data:image/png;base64,greyAlpha', format: 'png' });
+        spy.mockRestore();
+        vi.doUnmock('tiff');
+      });
+    });
+
+    it('normalizes Uint16Array pixel data to 8-bit', () => {
+      // 1x1 RGB with 16-bit values; 65535 → 255, 32768 → 128, 0 → 0
+      const uint16Data = new Uint16Array([65535, 32768, 0]);
+      vi.doMock('tiff', () => ({
+        decode: (_buf, opts) => {
+          if (opts?.ignoreImageData) return [{ width: 1, height: 1 }];
+          return [{ width: 1, height: 1, data: uint16Data, samplesPerPixel: 3, alpha: false }];
+        },
+      }));
+
+      const putCalls = [];
+      const mockCanvas = {
+        width: 0,
+        height: 0,
+        getContext: () => ({
+          createImageData: (w, h) => ({ data: new Uint8Array(w * h * 4), width: w, height: h }),
+          putImageData: (imageData) => putCalls.push(Array.from(imageData.data)),
+        }),
+        toDataURL: () => 'data:image/png;base64,u16',
+      };
+      const spy = vi.spyOn(document, 'createElement').mockReturnValue(mockCanvas);
+
+      return import('./tiff-converter.js?uint16').then(({ convertTiffToPng: fn }) => {
+        const result = fn('SU8qAA==');
+        expect(result).toEqual({ dataUri: 'data:image/png;base64,u16', format: 'png' });
+        // Verify normalization: (65535+128)/257|0 = 255, (32768+128)/257|0 = 128, (0+128)/257|0 = 0
+        expect(putCalls[0][0]).toBe(255);
+        expect(putCalls[0][1]).toBe(128);
+        expect(putCalls[0][2]).toBe(0);
+        expect(putCalls[0][3]).toBe(255); // alpha
+        spy.mockRestore();
+        vi.doUnmock('tiff');
+      });
+    });
+
+    it('normalizes Float32Array pixel data to 8-bit', () => {
+      // 1x1 RGB with float values; 1.0 → 255, 0.5 → 128, 0.0 → 0
+      const floatData = new Float32Array([1.0, 0.5, 0.0]);
+      vi.doMock('tiff', () => ({
+        decode: (_buf, opts) => {
+          if (opts?.ignoreImageData) return [{ width: 1, height: 1 }];
+          return [{ width: 1, height: 1, data: floatData, samplesPerPixel: 3, alpha: false }];
+        },
+      }));
+
+      const putCalls = [];
+      const mockCanvas = {
+        width: 0,
+        height: 0,
+        getContext: () => ({
+          createImageData: (w, h) => ({ data: new Uint8Array(w * h * 4), width: w, height: h }),
+          putImageData: (imageData) => putCalls.push(Array.from(imageData.data)),
+        }),
+        toDataURL: () => 'data:image/png;base64,f32',
+      };
+      const spy = vi.spyOn(document, 'createElement').mockReturnValue(mockCanvas);
+
+      return import('./tiff-converter.js?float32').then(({ convertTiffToPng: fn }) => {
+        const result = fn('SU8qAA==');
+        expect(result).toEqual({ dataUri: 'data:image/png;base64,f32', format: 'png' });
+        // Verify normalization: 1.0 → 255, 0.5 → 128, 0.0 → 0
+        expect(putCalls[0][0]).toBe(255);
+        expect(putCalls[0][1]).toBe(128);
+        expect(putCalls[0][2]).toBe(0);
+        expect(putCalls[0][3]).toBe(255); // alpha
+        spy.mockRestore();
+        vi.doUnmock('tiff');
+      });
+    });
+
     it('returns null for TIFF with dimensions exceeding pixel limit', () => {
       // Mock tiff metadata-only decode to return oversized dimensions
       // (100k × 10k = 1 billion pixels). The full decode should never be called.