diff --git a/src/runtime/template_set.ts b/src/runtime/template_set.ts index e7d404030..a2148a1bb 100644 --- a/src/runtime/template_set.ts +++ b/src/runtime/template_set.ts @@ -41,7 +41,7 @@ export interface TemplateSetConfig { dev?: boolean; translatableAttributes?: string[]; translateFn?: (s: string) => string; - templates?: string | Document; + templates?: string | Document | Record; } export class TemplateSet { @@ -60,7 +60,13 @@ export class TemplateSet { this.translateFn = config.translateFn; this.translatableAttributes = config.translatableAttributes; if (config.templates) { - this.addTemplates(config.templates); + if (config.templates instanceof Document || typeof config.templates === "string") { + this.addTemplates(config.templates); + } else { + for (const name in config.templates) { + this.addTemplate(name, config.templates[name]); + } + } } } diff --git a/tests/app/__snapshots__/app.test.ts.snap b/tests/app/__snapshots__/app.test.ts.snap index e170910ca..dcee7a5eb 100644 --- a/tests/app/__snapshots__/app.test.ts.snap +++ b/tests/app/__snapshots__/app.test.ts.snap @@ -57,6 +57,19 @@ exports[`app can configure an app with props 1`] = ` }" `; +exports[`app can load templates from an object name-string 1`] = ` +"function anonymous(app, bdom, helpers +) { + let { text, createBlock, list, multi, html, toggler, comment } = bdom; + + let block1 = createBlock(\`
hello
\`); + + return function template(ctx, node, key = \\"\\") { + return block1(); + } +}" +`; + exports[`app can mount app in an iframe 1`] = ` "function anonymous(app, bdom, helpers ) { diff --git a/tests/app/app.test.ts b/tests/app/app.test.ts index ffc986866..6eab991bf 100644 --- a/tests/app/app.test.ts +++ b/tests/app/app.test.ts @@ -167,4 +167,21 @@ describe("app", () => { ] `); }); + + test("can load templates from an object name-string", async () => { + const templates = { + hello: `
hello
`, + world: `
world
`, + }; + class SomeComponent extends Component { + static template = "hello"; + } + + const app = new App(SomeComponent, { templates }); + await app.mount(fixture); + expect(fixture.querySelector(".hello")).toBeDefined(); + // Only the "hello" template is used, so the "world" template is not yet loaded + expect(Object.keys(app.templates)).toEqual(["hello"]); + expect(Object.keys(app.rawTemplates)).toEqual(["hello", "world"]); + }); });