fix: images in header and footer

dantio · Jun 30, 2022 · 254ad44 · 254ad44
1 parent d1fa780
commit 254ad44
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 1 deletion.
diff --git a/examples/invoice.html b/examples/invoice.html
@@ -34,6 +34,9 @@
 
     <header>
         <p>Header Page1</p>
+        <div>
+            <img src="https://picsum.photos/100/20" alt="logo" height="20px">
+        </div>
     </header>
     <header data-page="default">
         <p>Default Header</p>

diff --git a/examples/margin.html b/examples/margin.html
@@ -1,6 +1,6 @@
 <div>
     <h1>Margin between block elements is collapsed</h1>
-    <h2 style="text-align: center">H2 - text-align: right</h2>
+    <h2 style="text-align: center">H2 - text-align: center</h2>
     <h3 style="text-align: right">H3 - text-align: right</h3>
     <h4 style="margin: 60px 0">H4 - margin: 60px 0</h4>
     <h5>H5</h5>

diff --git a/src/render/header-footer.ts b/src/render/header-footer.ts
@@ -1,5 +1,6 @@
 import {Context} from '../context.js';
 import {parseChildren} from '../parser/index.js';
+import {parseImg} from '../parser/parse-img.js';
 import {Item} from '../types/item.types.js';
 
 type HeaderFooter = Record<string | number, (data: Record<string, unknown>) => Item[]>
@@ -10,6 +11,13 @@ export const headerFooterContent = (els: NodeListOf<Element>, ctx: Context): Hea
   let index = 1;
   for (let i = 0; i < els.length; i++) {
     const el = els[i];
+
+    // Add Images to context
+    const images = el.querySelectorAll(':scope img');
+    for (let i = 0; i < images.length; i++) {
+      parseImg(images[i], ctx);
+    }
+
     const dataPage: string | null = el.getAttribute('data-page');
     let page: string | number = index;