refactor: updated container_embed_handler and added comments to conta…

…iner_chromeless.html

cms/djangoapps/contentstore/views/component.py

@@ -146,32 +146,29 @@ def container_handler(request, usage_key_string):  # pylint: disable=too-many-st
 @login_required
 def container_embed_handler(request, usage_key_string):  # pylint: disable=too-many-statements
     """
-    Returns an HttpResponse with HTML content for the container xBlock.
-    The returned HTML is a chromeless rendering of the xBlock.
+    Returns an HttpResponse with HTML content for the container XBlock.
+    The returned HTML is a chromeless rendering of the XBlock.
 
     GET
         html: returns the HTML page for editing a container
         json: not currently supported
     """
 
+    # Avoiding a circular dependency
     from ..utils import get_container_handler_context
 
-    if 'text/html' in request.META.get('HTTP_ACCEPT', 'text/html'):
-
+    try:
+        usage_key = UsageKey.from_string(usage_key_string)
+    except InvalidKeyError:  # Raise Http404 on invalid 'usage_key_string'
+        return HttpResponseBadRequest()
+    with modulestore().bulk_operations(usage_key.course_key):
         try:
-            usage_key = UsageKey.from_string(usage_key_string)
-        except InvalidKeyError:  # Raise Http404 on invalid 'usage_key_string'
+            course, xblock, lms_link, preview_lms_link = _get_item_in_course(request, usage_key)
+        except ItemNotFoundError:
             raise Http404  # lint-amnesty, pylint: disable=raise-missing-from
-        with modulestore().bulk_operations(usage_key.course_key):
-            try:
-                course, xblock, lms_link, preview_lms_link = _get_item_in_course(request, usage_key)
-            except ItemNotFoundError:
-                return HttpResponseBadRequest()
 
-            container_handler_context = get_container_handler_context(request, usage_key, course, xblock)
-            return render_to_response('container_chromeless.html', container_handler_context)
-    else:
-        return HttpResponseBadRequest("Only supports HTML requests")
+        container_handler_context = get_container_handler_context(request, usage_key, course, xblock)
+        return render_to_response('container_chromeless.html', container_handler_context)
 
 
 def get_component_templates(courselike, library=False):  # lint-amnesty, pylint: disable=too-many-statements

cms/templates/container_chromeless.html

@@ -1,5 +1,10 @@
 ## coding=utf-8
 ## mako
+##
+## Studio view template for rendering the whole Unit in an iframe with
+## XBlocks controls specifically for Authoring MFE. This template renders
+## a chromeless version of a unit container without headers, footers,
+## and a navigation bar.
 
 <%! main_css = "style-main-v1" %>
 
@@ -93,21 +98,13 @@
             <%static:include path="common/templates/image-modal.underscore" />
         </script>
         <link rel="stylesheet" type="text/css" href="${static.url('js/vendor/timepicker/jquery.timepicker.css')}" />
+        ## The following stylesheets are included for studio-frontend debugging.
+        ## Remove this as part of studio frontend deprecation.
+        ## https://github.com/openedx/studio-frontend/issues/381
         % if not settings.STUDIO_FRONTEND_CONTAINER_URL:
             <link rel="stylesheet" type="text/css" href="${static.url('common/css/vendor/common.min.css')}" />
             <link rel="stylesheet" type="text/css" href="${static.url('common/css/vendor/editImageModal.min.css')}" />
         % endif
-        <!-- Hotjar Tracking Code for studio -->
-        <script>
-        (function(h,o,t,j,a,r){
-            h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
-            h._hjSettings={hjid: Number("${settings.HOTJAR_ID |n, js_escaped_string}"),hjsv:6};
-            a=o.getElementsByTagName('head')[0];
-            r=o.createElement('script');r.async=1;
-            r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
-            a.appendChild(r);
-        })(window,document,'https://static.hotjar.com/c/hotjar-','.js?sv=');
-        </script>
     </head>
 
     <body class="${static.dir_rtl()} is-signedin course container view-container lang_${LANGUAGE_CODE}">
@@ -167,8 +164,6 @@
                 </div>
             </div>
         </main>
-
-        ##   <div id="page-notification"></div>
         </div>
 
         <div id="page-prompt"></div>
@@ -194,6 +189,7 @@
         <script type="text/javascript">
         require(['js/factories/base'], function () {});
         </script>
+
         <%static:webpack entry="js/factories/container">
             ContainerFactory(
                 ${component_templates | n, dump_js_escaped_json},
@@ -209,6 +205,9 @@
             );
         </%static:webpack>
     </body>
+
+    ## Initialize MutationObserver and ResizeObserver to update the iframe size.
+    ## These are used to provide resize events for the Authoring MFE.
     <script type="text/javascript">
     (function() {
         // If this view is rendered in an iframe within the authoring microfrontend app