1 files changed, 16 insertions, 8 deletions
diff --git a/ext/js/dom/html-template-collection.js b/ext/js/dom/html-template-collection.js
index 981d5528..a71d954f 100644
--- a/ext/js/dom/html-template-collection.js
+++ b/ext/js/dom/html-template-collection.js
@@ -16,6 +16,8 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
  */
 
+import {fetchText} from '../core/fetch-utilities.js';
+
 export class HtmlTemplateCollection {
     constructor() {
         /** @type {Map<string, HTMLTemplateElement>} */
@@ -23,17 +25,23 @@ export class HtmlTemplateCollection {
     }
 
     /**
-     * @param {string|Document} source
+     * @param {string[]} urls
      */
-    load(source) {
-        const sourceNode = (
-            typeof source === 'string' ?
-            new DOMParser().parseFromString(source, 'text/html') :
-            source
-        );
+    async loadFromFiles(urls) {
+        const htmlRawArray = await Promise.all(urls.map((url) => fetchText(url)));
+        const domParser = new DOMParser();
+        for (const htmlRaw of htmlRawArray) {
+            const templatesDocument = domParser.parseFromString(htmlRaw, 'text/html');
+            this.load(templatesDocument);
+        }
+    }
 
+    /**
+     * @param {Document} source
+     */
+    load(source) {
         const pattern = /^([\w\W]+)-template$/;
-        for (const template of sourceNode.querySelectorAll('template')) {
+        for (const template of source.querySelectorAll('template')) {
             const match = pattern.exec(template.id);
             if (match === null) { continue; }
             this._prepareTemplate(template);