[IMP] web, project: introduce and use renderToMarkup

Part-of: odoo/odoo#92475

addons/project/static/src/js/project_task_kanban_examples.js

@@ -3,7 +3,7 @@
 import { _lt } from 'web.core';
 import kanbanExamplesRegistry from 'web.kanban_examples_registry';
 import { registry } from "@web/core/registry";
-import { renderToString } from '@web/core/utils/render';
+import { renderToMarkup } from '@web/core/utils/render';
 
 const { markup } = owl;
 const greenBullet = markup(`<span class="o_status d-inline-block o_status_green"></span>`);
@@ -18,83 +18,83 @@ const exampleData = {
         name: _lt('Software Development'),
         columns: [_lt('Backlog'), _lt('Specifications'), _lt('Development'), _lt('Tests'), _lt('Delivered')],
         get description() {
-            return markup(renderToString("project.example.generic"));
+            return renderToMarkup("project.example.generic");
         },
         bullets: [greenBullet, redBullet, star],
     }, {
         name: _lt('Agile Scrum'),
         columns: [_lt('Backlog'), _lt('Sprint Backlog'), _lt('Sprint in Progress'), _lt('Sprint Complete'), _lt('Old Completed Sprint')],
         get description() {
-            return markup(renderToString("project.example.agilescrum"));
+            return renderToMarkup("project.example.agilescrum");
         },
         bullets: [greenBullet, redBullet],
     }, {
         name: _lt('Digital Marketing'),
         columns: [_lt('Ideas'), _lt('Researching'), _lt('Writing'), _lt('Editing'), _lt('Done')],
         get description() {
-            return markup(renderToString("project.example.digitalmarketing"));
+            return renderToMarkup("project.example.digitalmarketing");
         },
         bullets: [greenBullet, redBullet],
     }, {
         name: _lt('Customer Feedback'),
         columns: [_lt('New'), _lt('In development'), _lt('Done'), _lt('Refused')],
         get description() {
-            return markup(renderToString("project.example.customerfeedback"));
+            return renderToMarkup("project.example.customerfeedback");
         },
         bullets: [greenBullet, redBullet],
     }, {
         name: _lt('Consulting'),
         columns: [_lt('New Projects'), _lt('Resources Allocation'), _lt('In Progress'), _lt('Done')],
         get description() {
-            return markup(renderToString("project.example.consulting"));
+            return renderToMarkup("project.example.consulting");
         },
         bullets: [greenBullet, redBullet],
     }, {
         name: _lt('Research Project'),
         columns: [_lt('Brainstorm'), _lt('Research'), _lt('Draft'), _lt('Final Document')],
         get description() {
-            return markup(renderToString("project.example.researchproject"));
+            return renderToMarkup("project.example.researchproject");
         },
         bullets: [greenBullet, redBullet],
     }, {
         name: _lt('Website Redesign'),
         columns: [_lt('Page Ideas'), _lt('Copywriting'), _lt('Design'), _lt('Live')],
         get description() {
-            return markup(renderToString("project.example.researchproject"));
+            return renderToMarkup("project.example.researchproject");
         },
     }, {
         name: _lt('T-shirt Printing'),
         columns: [_lt('New Orders'), _lt('Logo Design'), _lt('To Print'), _lt('Done')],
         get description() {
-            return markup(renderToString("project.example.tshirtprinting"));
+            return renderToMarkup("project.example.tshirtprinting");
         },
         bullets: [star],
     }, {
         name: _lt('Design'),
         columns: [_lt('New Request'), _lt('Design'), _lt('Client Review'), _lt('Handoff')],
         get description() {
-            return markup(renderToString("project.example.generic"));
+            return renderToMarkup("project.example.generic");
         },
         bullets: [greenBullet, redBullet, star, clock],
     }, {
         name: _lt('Publishing'),
         columns: [_lt('Ideas'), _lt('Writing'), _lt('Editing'), _lt('Published')],
         get description() {
-            return markup(renderToString("project.example.generic"));
+            return renderToMarkup("project.example.generic");
         },
         bullets: [greenBullet, redBullet, star, clock],
     }, {
         name: _lt('Manufacturing'),
         columns: [_lt('New Orders'), _lt('Material Sourcing'), _lt('Manufacturing'), _lt('Assembling'), _lt('Delivered')],
         get description() {
-            return markup(renderToString("project.example.generic"));
+            return renderToMarkup("project.example.generic");
         },
         bullets: [greenBullet, redBullet, star, clock],
     }, {
         name: _lt('Podcast and Video Production'),
         columns: [_lt('Research'), _lt('Script'), _lt('Recording'), _lt('Mixing'), _lt('Published')],
         get description() {
-            return markup(renderToString("project.example.generic"));
+            return renderToMarkup("project.example.generic");
         },
         bullets: [greenBullet, redBullet, star, clock],
     }],

addons/web/static/src/core/utils/render.js

@@ -1,15 +1,15 @@
 /** @odoo-module **/
 
-const { blockDom } = owl;
+const { blockDom, markup } = owl;
 
 /**
- * loads a template using getTemplate, and render the template immediately;
+ * renders a template with an (optional) context and returns a Markup string,
+ * suitable to be inserted in a template with a t-out directive
  *
  * @param {string} template
  * @param {Object} context
  * @returns string: the html of the template
  */
-
 export function renderToString(template, context = {}) {
     const app = renderToString.app;
     if (!app) {
@@ -21,3 +21,15 @@ export function renderToString(template, context = {}) {
     blockDom.mount(bdom, div);
     return div.innerHTML;
 }
+
+/**
+ * renders a template with an (optional) context and returns a Markup string,
+ * suitable to be inserted in a template with a t-out directive
+ *
+ * @param {string} template
+ * @param {Object} context
+ * @returns string: the html of the template, as a markup string
+ */
+export function renderToMarkup(template, context = {}) {
+    return markup(renderToString(template, context));
+}