Merge pull request #16358 from edx/dahlia/EDU-1529

Pass contextual data to studio-frontend

cms/templates/asset_index.html

@@ -56,8 +56,17 @@
     <div class="content">
         <div class="content-primary">
             % if waffle_flag_enabled:
-                <div id="root"></div>
-                <%static:webpack entry="AssetsPage"></%static:webpack>
+                <%static:studiofrontend page="AssetsPage" lang="fr">
+                    {
+                        "id": "${context_course.id | n, js_escaped_string}",
+                        "name": "${context_course.display_name_with_default | n, js_escaped_string}",
+                        "url_name": "${context_course.location.name | n, js_escaped_string}",
+                        "org": "${context_course.location.org | n, js_escaped_string}",
+                        "num": "${context_course.location.course | n, js_escaped_string}",
+                        "display_course_number": "${context_course.display_coursenumber | n, js_escaped_string}",
+                        "revision": "${context_course.location.revision | n, js_escaped_string}"
+                    }
+                </%static:studiofrontend>
             % else:
                 <div class="wrapper-assets"></div>
             % endif

common/djangoapps/pipeline_mako/templates/static_content.html

@@ -86,6 +86,45 @@ engine = Engine(dirs=settings.DEFAULT_TEMPLATE_ENGINE['DIRS'])
 source, template_path = Loader(engine).load_template_source(path)
 %>${source | n, decode.utf8}</%def>
 
+<%def name="studiofrontend(page, lang='en')">
+    <%doc>
+        Loads a studio-frontend page, with the necessary context. Context is expected
+        as a dictionary in the body of this tag.
+
+        Dev note: we could also add the locale-injection script in this block
+            -use a better default than the hardcoded 'en'. There should be a setting or something?
+            -lookup (webpack exported) locale-injection script using lang as key
+            -include it as the first script in this block
+    </%doc>
+    <%
+        from django.template import Template, Context
+        from webpack_loader.exceptions import WebpackLoaderBadStatsError
+        import json
+
+        def _convert_dict_to_json(input_dict):
+            output_json = "{"
+            for key in input_dict:
+                output_json = "{}{}:\"{}\",".format(output_json, key, input_dict[key])
+            output_json += "}"
+            return output_json
+
+        body = capture(caller.body)
+        body_dict = json.loads(body)
+        body_dict['lang'] = lang
+        return Template("""
+            <script type="text/javascript" id='courseContext'>
+                var courseContext = {% autoescape off %}{{ body }}{% endautoescape %};
+            </script>
+            <div id="root"></div>
+            {% load render_bundle from webpack_loader %}
+            {% render_bundle page %}
+        """).render(Context({
+            'body': _convert_dict_to_json(body_dict),
+            'page': page
+        }))
+    %>
+</%def>
+
 <%def name="webpack(entry)">
     <%doc>
         Loads Javascript onto your page from a Webpack-generated bundle.

scripts/tests/test_xss_linter.py

@@ -741,16 +741,22 @@ class TestMakoTemplateLinter(TestLinter):
                 ${x | h}
             </%static:require_module>
             ${x | h}
+            <%static:studiofrontend page="${x}" lang="en">
+                ${x | h}
+            </%static:studiofrontend>
+            ${x | h}
         """)
 
         linter._check_mako_file_is_safe(mako_template, results)
 
-        self.assertEqual(len(results.violations), 5)
+        self.assertEqual(len(results.violations), 7)
         self.assertEqual(results.violations[0].rule, Rules.mako_unwanted_html_filter)
         self.assertEqual(results.violations[1].rule, Rules.mako_invalid_js_filter)
         self.assertEqual(results.violations[2].rule, Rules.mako_unwanted_html_filter)
         self.assertEqual(results.violations[3].rule, Rules.mako_invalid_js_filter)
         self.assertEqual(results.violations[4].rule, Rules.mako_unwanted_html_filter)
+        self.assertEqual(results.violations[5].rule, Rules.mako_invalid_js_filter)
+        self.assertEqual(results.violations[6].rule, Rules.mako_unwanted_html_filter)
 
     def test_check_mako_expressions_javascript_strings(self):
         """

scripts/xss_linter.py

@@ -2382,6 +2382,8 @@ class MakoTemplateLinter(BaseLinter):
                 </%static:require_module(_async)?> | # require js script tag end (optionally the _async version)
                 <%static:webpack.*?> |  # webpack script tag start
                 </%static:webpack> | # webpack script tag end
+                <%static:studiofrontend.*?> | # studiofrontend script tag start
+                </%static:studiofrontend> | # studiofrontend script tag end
                 <%block[ ]*name=['"]requirejs['"]\w*> |  # require js tag start
                 </%block>  # require js tag end
             """,