Markdown-UI & Template-UI node do not process HTML\Markdown sent to it by NR Template node about node-red-dashboard HOT 6 OPEN

If I understand correctly I have the same issue. I am calling a remote function that returns HTML formatted text I want to display - using the HTML formatting. However I have not found a way to make this happen.
Here is my template (Widget, group scoped)

Here is what is displayed

The problem appears to be that my text is injected into the generated HTML as a quoted string - and because it is quoted the embedded html controls are ignored. This is what I see when I inspect my web page:

Thanks for your help
Colin

from node-red-dashboard.

This is a very difficult thing to get right given the lifecycle of events that needs to take place. The steps are as follows:

• Config for the node is received with content defined
• Parse content and convert it from markdown to HTML
• Bind the resulting HTML to the template of the Vue component
  • This triggers Vue internals to parse of any HTML tags, etc, and allow for injection of {{ msg.<stuff> }}
• On receiving a new msg, we replace any appearances of {{ msg.<stuff> }} with the relevant value received
• We run the renderMermaid function to parse any mermaid content

This falls over because it's possible for the {{ msg.<stuff> }} to contain HTML/Markdown, which is not re-parsed by VueJS at that point.

from node-red-dashboard.

Commenting on the above I'm not sure it is clear what I'm saying:

• when defining HTML content in a (non-ui) template node and sending it to the UI-template node (which should render HTML), this does not work
• • when defining Markdown in a (non-ui) template node and sending it to the UI-Markdown node (which should render Markdown) this does not work

And with "this does not work" I mean: the defined content is not displayed in the UI node, and we've even experienced lockups of the entire UI\Dashboard2 (by simply sending HTML to a UI-template node).

I am not asking to rewrite\convert markdown to HTML, that would not make sense (i.e. just use the correct content node). But I would like to be able to just define markdown as a template and send that to and have it rendered by the UI-Markdown node. Same for HTML.
Why: this allows to have one (1) markdown\html node on the dashboard the (entire) content of which can change dynamically.
And this was not working at the time of issue submission.

from node-red-dashboard.

Hi Joe
Thanks for your quick reply.
I also experienced lockups of the entire dashboard when I was experimenting with this - Sorry, I did not pursue this to document exactly how to reproduce the issue. Now I have tidied my code that problem has gone away. If I hit it again I'll document the issue properly.

Re the text formatting. I was mislead by the HTML displayed by Chrome inspect. Copying to notepad I can see the problem is my text has had the HTML control characters escaped so that the exact text I supply is displayed. In most cases this is what is wanted... But not always. To handle this we would need a switch - some way of telling the system not to escape the inserted text.

Markdown uses different controls, perhaps I can use this...
"To create paragraphs, use a blank line to separate one or more lines of text."
"To create a line break or new line (
), end a line with two or more spaces, and then type return."
No joy :-(
The problem appears to be the Markdown processing is done before my text is inserted - the controls I put in the Markdown widget definition work as they should. The same controls in the inserted text do not.

Here is my markdown definition

Here is the generated HTML

Here is what I see on the dashboard

I think this is wrong. Text should be inserted before the markdown processing.

All I want to do is display a plain text log file. The only formatting I need is line feed. Is there another way?

Thanks again
Colin

from node-red-dashboard.

This is similar to #715 "support HTML in msg.payload of ui-text."

from node-red-dashboard.

@colin-grierson : discovered this week that using <pre> {{msg.payload}} </pre> in a ui-template node will display JSON in a (more or less) correct format. Maybe this is of some help..

from node-red-dashboard.