fix(image): handle svg images properly

Author: singerla

__tests__/add-svg-images.test.ts

@@ -0,0 +1,22 @@
+import Automizer from '../src/automizer';
+
+test('create presentation and append slides with images', async () => {
+  const automizer = new Automizer({
+    templateDir: `${__dirname}/pptx-templates`,
+    outputDir: `${__dirname}/pptx-output`,
+  });
+
+  const pres = automizer
+    .loadRoot(`RootTemplate.pptx`)
+    .load(`EmptySlide.pptx`, 'empty')
+    .load(`SVGImages.pptx`, 'images');
+
+  pres.addSlide('empty', 1, (slide) => {
+    slide.addElement('images', 1, 'Heart');
+    slide.addElement('images', 1, 'Leaf');
+  });
+
+  const result = await pres.write(`add-svg-images.test.pptx`);
+
+  expect(result.images).toBe(4);
+});

__tests__/pptx-templates/SVGImages.pptx

@@ -59,6 +59,7 @@ export class Image extends Shape implements IImage {
     targetSlideNumber: number,
   ): Promise<Image> {
     await this.prepare(targetTemplate, targetSlideNumber);
+
     await this.setTargetElement();
     await this.updateTargetElementRelId();
 
@@ -69,6 +70,19 @@ export class Image extends Shape implements IImage {
     return this;
   }
 
+  async modifySvgRelation(
+    targetTemplate: RootPresTemplate,
+    targetSlideNumber: number,
+    targetElement: XmlElement,
+  ): Promise<Image> {
+    await this.prepare(targetTemplate, targetSlideNumber);
+
+    this.targetElement = targetElement;
+    await this.updateTargetElementRelId();
+
+    return this;
+  }
+
   async append(
     targetTemplate: RootPresTemplate,
     targetSlideNumber: number,
@@ -81,7 +95,10 @@ export class Image extends Shape implements IImage {
 
     this.applyImageCallbacks();
 
-    if (this.hasSvgRelation()) {
+    /*
+     * SVG images require a corresponding PNG image.
+     */
+    if (this.hasSvgBlipRelation()) {
       const relsPath = `ppt/slides/_rels/slide${this.sourceSlideNumber}.xml.rels`;
       const target = await XmlHelper.getTargetByRelId(
         this.sourceArchive,
@@ -98,7 +115,11 @@ export class Image extends Shape implements IImage {
           type: ElementType.Image,
         },
         this.targetType,
-      ).modify(targetTemplate, targetSlideNumber);
+      ).modifySvgRelation(
+        targetTemplate,
+        targetSlideNumber,
+        this.targetElement,
+      );
     }
 
     return this;
@@ -182,7 +203,7 @@ export class Image extends Shape implements IImage {
     );
   }
 
-  hasSvgRelation(): boolean {
+  hasSvgBlipRelation(): boolean {
     return this.targetElement.getElementsByTagName('asvg:svgBlip').length > 0;
   }