Detecting faulty handlebar/spacebar tags in texteditor : MeteorJS - meteor

I want the user to be able to write handlebar tags in a text editor like {{username}} which will be saved in the database to be rendered later in the server using server-side rendering.
However, I want to add a client-side check to see if there is any faulty handlebar tags like {{username} or {username}} or {{username or username}}
I tried using Blaze.renderWithData(), but it didn't throw any error and just rendered the values as is.
Is there a way to detect faulty tags?
Thanks.

Related

How to wait until HTML file loads?

In a page I am working on I replace the HTML code in a DIV with different HTML, then using Javascript I insert additional HTML into a DIV the new code using innerHTML.
If that is confusing, the original HTML contained a form, the HTML that replaced it contains the response to the form's Submit, and the code I want to insert is the information from the form.
This seemed to work as long as I had alert code in the script, which I use to check the progress as I debug this. Once I removed the all of alert lines the insert would fail. I figure it has to do something with the asynchronous nature of page rendering, so I think I need to find a way to make sure the new HTML code has loaded before I try writing to the DIV it contains.
In the code below the script fails at show_member_info unless I uncomment the preceding alert line.
function handle_join(X)
{
do_trace('handle_update');
get_member_info();
send_emails(X);
do_trace('clear content');
document.getElementById("members_content").innerHTML='';
document.getElementById("members_image").innerHTML='';
do_trace('load content');
Load_HTML('members/joinConf.html','members_content');
// alert('show_member_info');
show_member_info();
show_trace();
}
How do I determine when the new HTML has loaded and is ready to be manipulated?
Thanks, Mike
The question is a bit dry, but from what i can understand the problem is that you are not awaiting Load_HTML and that's causing some issue with show_member_info.

In Meteor, how do I mark up some user-entered text before displaying it?

I have a Meteor 0.8.3 app with the template:
<template name="example">
Description: {{desc}}
</template>
and javascript:
Template.example.desc = function(){
return Session.get("desc");
}
where the user has set the Session's desc.
I want to mark up the text slightly before displaying it, eg. replacing carriage returns with <br>, and adding some word-breaks (html code ​).
I believe I could do this with some regex replacements in Template.example.desc and triple-braces {{{desc}}} in the template - however, this opens the door to the user entering their own html into the string, which is unsafe. So I'd like to let Meteor first make the string safe, and only then apply my markup.
How do I do it? Thanks!
{{{desc}}} is the way to go.
I do not see this as a security fault since you can only alter your own Session "desc".
If you are talking about a variable that is saved in database and show to all users, a server side check or wrap the variable with your markup before sending back to client side will be more appropriate.

Can not display base64 encoded images in an HTML fragment in WinJS app

I'm writing a WinJS app that takes an HTML fragment the user has copied to the clipboard, replaces their
Later, when I go to display the .html, I create an iFrame element (using jQuery $(''), and attempt to source the .html into it, and get the following error
0x800c001c - JavaScript runtime error: Unable to add dynamic content. A script attempted to inject dynamic content, or elements previously modified dynamically, that might be unsafe. For example, using the innerHTML property to add script or malformed HTML will generate this exception. Use the toStaticHTML method to filter dynamic content, or explicitly create elements and attributes with a method such as createElement. For more information, see http://go.microsoft.com/fwlink/?LinkID=247104.
I don't get the exception if I don't base64 encoded the images, i.e. leave them intact and can display iframes on the page with the page showing images.
If I take the html after subbing the urls for base64 and run it through toStaticHTML, it removes the src= attribute completely from the tags.
I know the .html with the encoded pngs is right b/c I can open it in Chrome and it displays fine.
My question is I'm trying to figure out why it strips the src= attributes from the tags and how to fix it, for instance, creating the iframe without using jquery and some MS voodoo, or a different technique to sanitize the HTML?
So, a solution I discovered (not 100% convinced it the best and am still looking for something a little less M$ specific) is the MS Webview
http://msdn.microsoft.com/en-us/library/windows/apps/bg182879.aspx#WebView
I use some code like below (where content is the html string with base64 encoded images)
var loadHtmlSuccess = function (content) {
var webview = document.createElement("x-ms-webview");
webview.navigateToString(content);
assetItem.append(webview);
}
I believe you want to use execUnsafeLocalFunction. For example:
var target = document.getElementById('targetDIV');
MSApp.execUnsafeLocalFunction(function () {
target.innerHTML = content}
);

jQuery syntax while using master Page

I am using master page where i need to move value of one listbox to the other with the help of jQuery I tried many ways but wasn't able to hit the nail.
The methods I tried are as follows:
$("[id$='ModuleMasterListBox option:[#selected]']").appendTo($("[id$='ModuleSelectListBox']"));
$("[id$='ModuleMasterListBox option:#selected]'").appendTo($("[id$='ModuleSelectListBox']"));
var module = $("[id$='ModuleMasterListBox']").val();
module.appendTo($("[id$='ModuleSelectListBox']"));
These are the methods I tried which failed - please help me out....
You should be able to do it like this:
$("[id$='ModuleMasterListBox'] :selected").appendTo("[id$='ModuleSelectListBox']");
From your markup and the # sign it looks like you're using an outdated version of jQuery, you may want to consider upgrading. In the above we're using the attribute-ends-with selector to get the <select> the using :selected to grab the selected <option> before moving it.
Keep in mind since it looks like you're using ASP.Net this will by default throw validation errors on the server-side, you'll have to disable page validation for it to allow items it didn't bind.

Input Validation When Using a Rich Text Editor

I have an ASP.NET MVC application and I'm using CKEditor for text entry. I have turned off input validation so the HTML created from CKEditor can be passed into the controller action. I am then showing the entered HTML on a web page.
I only have certain buttons on CKEditor enabled, but obviously someone could send whatever text they want down. I want to be able to show the HTML on the page after the user has entered it. How can I validate the input, but still be able to show the few things that are enabled in the editor?
So basically I want to sanitize everything except for a few key things like bold, italics, lists and links. This needs to be done server side.
How about AntiXSS?
See my full answer here from similar question:
I have found that replacing the angel
brackets with encoded angel brackets
solves most problems
You could create a "whitelist" of sorts for the html tags you'd like to allow. You could start by HTML encoding the whole thing. Then, replace a series of "allowed" sequences, such as:
"<strong>" and "</strong>" back to "<strong>" and "</strong>"
"<em>" and "</em>" back to "<em>" and "</em>"
"<li>" and "</li>" back to ... etc. etc.
For things like the A tag, you could resort to a regular expression (since you'd want the href attribute to be allowed too). You would still want to be careful about XSS; someone else already recommended AntiXSS.
Sample Regexp to replace the A tags:
<a href="([^"]+)">
Then replace as
<a href="$1">
Good luck!

Resources