locked
Unable to add dynamic content

    Question

  • I'm encountering this error:

    Unhandled exception at line 16, column 5 in ms-appx://f3761e14-0dcd-42d1-bb88-fb42aaf9d182/default.html

    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.

    in this line:

    frames['display'].document.documentElement.innerHTML = x;

    The whole function is:

    function update() {
        var x = document.getElementById('mycode').value;
        frames['display'].document.documentElement.innerHTML = x;

    }

    I'm making a code interpreter which takes HTML/CSS input form user in "mycode" and then displays its output in "display"

    please provide a suitable solution for this. 

    Thank you!


    Saturday, June 29, 2013 9:54 AM

Answers

All replies

  • You're hitting a security restriction. Look at HTML, CSS, and JavaScript features and differences (Windows Store apps) in the dynamically adding html section for more information.

    There's a list of safe tags which you may add to the innerhtml property and a list of unsafe tags which you may not add to the innerhtml proprety in local context at : Making HTML safer: details for toStaticHTML (Windows Store apps using JavaScript and HTML)

    However, the execUnsafeLocalFunction method should help you with your problem. But pay attention: this bypasses the filtering and might introduce a security problem in your app!

    Something like: 

    function update(){
      MSApp.execUnsafeLocalFunction(function() {
        var x = document.getElementById('mycode').value;
        frames['display'].document.documentElement.innerHTML = x; 
      });
    }
    should do the trick!

    • Proposed as answer by Ealsur Tuesday, July 2, 2013 2:51 PM
    • Marked as answer by Anshul119 Wednesday, July 3, 2013 9:09 AM
    Monday, July 1, 2013 9:27 PM
  • Thank you Andre!

    I altered the code and now the application works without any error but now the application is not fulfilling its objective. To test the application I inserted a source code which involves CSS transitions but the output windows didn't show the result as it should. CSS effects are not working in there. What can I do with that?

    Thank you!

    Wednesday, July 3, 2013 9:09 AM