feature(slide): add elements to slide by creationId OR by name fallback

Author: singerla

__tests__/modify-by-creation-id.test.ts

@@ -28,15 +28,16 @@ test('create presentation, add and modify an existing table by creation id.', as
       slide.modifyElement('{EFC74B4C-D832-409B-9CF4-73C1EFF132D8}', [
         modify.setTableData(data1),
       ]);
-
+    })
+    .addSlide('tables', 1950777067, (slide) => {
       slide.addElement(
         'tables',
         1950777067,
         '{EFC74B4C-D832-409B-9CF4-73C1EFF132D8}',
         [modify.setTableData(data1)],
       );
     })
-    .write(`modify-existing-table.test.pptx`);
+    .write(`modify-by-creation-id.test.pptx`);
 
   // expect(result.tables).toBe(2); // tbd
 });

__tests__/modify-by-element-selector.test.ts

@@ -0,0 +1,52 @@
+import Automizer, { modify } from '../src/index';
+import { vd } from '../src/helper/general-helper';
+
+test('create presentation, add and modify an existing table by FindElementSelector', async () => {
+  const automizer = new Automizer({
+    templateDir: `${__dirname}/pptx-templates`,
+    outputDir: `${__dirname}/pptx-output`,
+    useCreationIds: true,
+  });
+
+  const data1 = {
+    body: [
+      { label: 'item test r1', values: ['test1', 10, 16, 12, 11] },
+      { label: 'item test r2', values: ['test2', 12, 18, 15, 12] },
+      { label: 'item test r3', values: ['test3', 14, 12, 11, 14] },
+    ],
+  };
+
+  const pres = automizer
+    .loadRoot(`RootTemplate.pptx`)
+    .load(`SlideWithTables.pptx`, 'tables');
+
+  const creationIds = await pres.setCreationIds();
+  // vd(creationIds);
+
+  const result = await pres
+    .addSlide('tables', 1950777067, (slide) => {
+      // This will try to match the given creationId first, and, if failed,
+      // match by element name.
+      slide.modifyElement(
+        {
+          creationId: '{EFC74B4C-D832-409B-9CF4-73C1EFF132D8}',
+          name: 'TableDefault',
+        },
+        [modify.setTableData(data1)],
+      );
+
+      // CreationID is not valid/has changed, but we can use a fallback element name:
+      slide.addElement(
+        'tables',
+        1950777067,
+        {
+          creationId: '{XXXXX-XXXXX-XXXXX-XX-XXX}',
+          name: 'TableWithLabels',
+        },
+        [modify.setTableData(data1)],
+      );
+    })
+    .write(`modify-by-element-selector.test.pptx`);
+
+  // expect(result.tables).toBe(2); // tbd
+});

src/classes/slide.ts

@@ -2,6 +2,8 @@ import { FileHelper } from '../helper/file-helper';
 import { XmlHelper } from '../helper/xml-helper';
 import {
   AnalyzedElementType,
+  FindElementSelector,
+  FindElementStrategy,
   ImportedElement,
   ImportElement,
   ShapeModificationCallback,
@@ -239,7 +241,7 @@ export class Slide implements ISlide {
    * Depending on the shape type (e.g. chart or table), different arguments will be passed to the callback.
    */
   modifyElement(
-    selector: string,
+    selector: FindElementSelector,
     callback: ShapeModificationCallback | ShapeModificationCallback[],
   ): this {
     const presName = this.sourceTemplate.name;
@@ -265,7 +267,7 @@ export class Slide implements ISlide {
   addElement(
     presName: string,
     slideNumber: number,
-    selector: string,
+    selector: FindElementSelector,
     callback?: ShapeModificationCallback | ShapeModificationCallback[],
   ): this {
     return this.addElementToModificationsList(
@@ -281,7 +283,7 @@ export class Slide implements ISlide {
    * Remove a single element from slide.
    * @param {string} selector - Element's name on the slide.
    */
-  removeElement(selector: string): this {
+  removeElement(selector: FindElementSelector): this {
     const presName = this.sourceTemplate.name;
     const slideNumber = this.sourceNumber;
 
@@ -290,6 +292,7 @@ export class Slide implements ISlide {
       slideNumber,
       selector,
       'remove',
+      undefined,
     );
   }
 
@@ -306,7 +309,7 @@ export class Slide implements ISlide {
   private addElementToModificationsList(
     presName: string,
     slideNumber: number,
-    selector: string,
+    selector: FindElementSelector,
     mode: string,
     callback?: ShapeModificationCallback | ShapeModificationCallback[],
   ): this {
@@ -374,24 +377,19 @@ export class Slide implements ISlide {
     const sourceArchive = await template.archive;
     const useCreationIds =
       template.useCreationIds === true && template.creationIds !== undefined;
-    const method = useCreationIds
-      ? 'findByElementCreationId'
-      : 'findByElementName';
 
-    const sourceElement = await XmlHelper[method](
+    const { sourceElement, selector } = await this.findElementOnSlide(
+      importElement.selector,
       sourceArchive,
       sourcePath,
-      importElement.selector,
+      useCreationIds,
     );
 
     if (!sourceElement) {
-      vd(importElement);
-      vd(
-        `Can't find ${importElement.selector} on slide ${slideNumber} in ${importElement.presName}`,
+      console.error(
+        `Can't find element on slide ${slideNumber} in ${importElement.presName}: `,
       );
-      // throw new Error(
-      //   `Can't find ${importElement.selector} on slide ${slideNumber} in ${importElement.presName}`,
-      // );
+      console.log(importElement);
       return;
     }
 
@@ -403,7 +401,7 @@ export class Slide implements ISlide {
 
     return {
       mode: importElement.mode,
-      name: importElement.selector,
+      name: selector,
       hasCreationId: useCreationIds,
       sourceArchive,
       sourceSlideNumber: slideNumber,
@@ -414,6 +412,55 @@ export class Slide implements ISlide {
     };
   }
 
+  async findElementOnSlide(
+    selector: FindElementSelector,
+    sourceArchive: IArchive,
+    sourcePath: string,
+    useCreationIds: boolean,
+  ): Promise<{
+    sourceElement: XmlDocument;
+    selector: string;
+  }> {
+    const strategies: FindElementStrategy[] = [];
+    if (typeof selector === 'string') {
+      if (useCreationIds) {
+        strategies.push({
+          mode: 'findByElementCreationId',
+          selector: selector,
+        });
+      }
+      strategies.push({
+        mode: 'findByElementName',
+        selector: selector,
+      });
+    } else if (selector.name) {
+      strategies.push({
+        mode: 'findByElementCreationId',
+        selector: selector.creationId,
+      });
+      strategies.push({
+        mode: 'findByElementName',
+        selector: selector.name,
+      });
+    }
+
+    for (const findElement of strategies) {
+      const mode = findElement.mode;
+
+      const sourceElement = await XmlHelper[mode](
+        sourceArchive,
+        sourcePath,
+        findElement.selector,
+      );
+
+      if (sourceElement) {
+        return { sourceElement, selector: findElement.selector };
+      }
+    }
+
+    return { sourceElement: undefined, selector: JSON.stringify(selector) };
+  }
+
   /**
    * Analyzes element
    * @internal

src/types/types.ts

@@ -130,9 +130,20 @@ export type ArchiveParams = {
 export type ImportElement = {
   presName: string;
   slideNumber: number;
-  selector: string;
+  selector: FindElementSelector;
   mode: string;
   callback?: ShapeModificationCallback | ShapeModificationCallback[];
+  info?: any;
+};
+export type FindElementSelector =
+  | string
+  | {
+      creationId: string;
+      name: string;
+    };
+export type FindElementStrategy = {
+  mode: 'findByElementCreationId' | 'findByElementName';
+  selector: string;
 };
 export type ImportedElement = {
   mode: string;