ImageRun not working with data of ArrayBuffer type

[takose]

Problem:

The current implementation for creating a Word document with an inserted image is not functioning as expected. Upon running the script, the resulting Word file is generated, but the image does not appear in the document. No errors are reported during the execution.

      const response = await axios.get("https://dummyimage.com/600x400/000/fff.png", { responseType: "arraybuffer" });
      const buffer = Buffer.from(response.data);
      buffer &&
        sections.children.push(
          new ImageRun({
            data: buffer,
            transformation: {
              width: 100,
              height: 100,
            },
          })
        );

Expected Behavior:

The script should successfully download an image from the specified URL and insert it into the Word document. The resulting Word file should contain the correctly embedded image.

docx package version: 8.5.0 axios package version: 1.1.3

[anti-the-social]

Have you tried to push img as a child to paragraph?

[msnyder-wayside]

Still an issue, I've verified the arrayBuffer is correct for the uploaded file, but nothing ends up in the final document. Can anyone shed light on what I'm missing here?

const imageResponse = await fetch(item.url!)
const imageArrayBuffer = await imageResponse.arrayBuffer()
const imageParagraph = new Paragraph({
	spacing: {
		after: 150,
	},
	children: [
		new ImageRun({
			data: imageArrayBuffer,
			transformation: {
				width: 100,
				height: 100,
			}
		}),
	],
})

docSectionChildren.push(imageParagraph) // from here they're added to the document section. All of that is working for everything else.

[kalda341]

ImageRun now requires the mimetype (eg. 'image/png') to be specified undertype property. FWIW this library is much easier to use with Typescript.

[msnyder-wayside]

ImageRun now requires the mimetype (eg. 'image/png') to be specified undertype property. FWIW this library is much easier to use with Typescript.

I'm using TypeScript, but the IImageOptions interface doesn't have a type property:

export interface IImageOptions {
    readonly data: Buffer | string | Uint8Array | ArrayBuffer;
    readonly transformation: IMediaTransformation;
    readonly floating?: IFloating;
    readonly altText?: DocPropertiesOptions;
    readonly outline?: OutlineOptions;
}

But I see this in GitHub: https://github.com/dolanmiu/docx/blob/master/src/file/paragraph/run/image-run.ts where there is a type property. Also, I'm using the current release (8.5.0). Any ideas?

[msnyder-wayside]

I also tried pulling down the repo and using a freshly built version. IImageOptions is updated to have the image type which is good, but it still isn't rendering images.

[kalda341]

You're right - I forgot that I'm running a fork off of master. I've always supplied a Blob to IImageOptions (even though it's not in the supported type) - might be worth a try?