Add logging to Learning MFE iframe, temporarily
to debug Firefox event handling that cannot be reproduced locally. See TNL-7187 [1] for more details. - [1] https://openedx.atlassian.net/browse/TNL-7187
This commit is contained in:
@@ -115,22 +115,30 @@ ${HTML(fragment.foot_html())}
|
||||
% endif
|
||||
|
||||
% if is_learning_mfe:
|
||||
## TODO: Remove console.log statements after production debugging
|
||||
<script type="text/javascript">
|
||||
(function() {
|
||||
// If this view is rendered in an iframe within the learning microfrontend app
|
||||
// it will report the height of its contents to the parent window when the
|
||||
// document loads, window resizes, or DOM mutates.
|
||||
console.log('MFE', 'Start script', document.referrer);
|
||||
if (window !== window.parent) {
|
||||
document.body.className += ' view-in-mfe';
|
||||
var lastHeight = window.offsetHeight;
|
||||
var lastWidth = window.offsetWidth;
|
||||
var contentElement = document.getElementById('content');
|
||||
|
||||
function dispatchResizeMessage() {
|
||||
function dispatchResizeMessage(event) {
|
||||
// Note: event is actually an Array of MutationRecord objects
|
||||
// when fired from the MutationObserver
|
||||
var eventType = event.type || 'mutate';
|
||||
console.log('MFE', 'Handle resize', eventType);
|
||||
|
||||
var newHeight = contentElement.offsetHeight;
|
||||
var newWidth = contentElement.offsetWidth;
|
||||
|
||||
if (newWidth === lastWidth && newHeight === lastHeight) {
|
||||
console.log('MFE', 'Ignore resize', newWidth, newHeight, eventType);
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -153,6 +161,7 @@ ${HTML(fragment.foot_html())}
|
||||
// height. This window.scrollTo is an attempt to keep the content at the
|
||||
// top of the page. See TNL-7094
|
||||
window.scrollTo(0, 0);
|
||||
console.log('MFE', 'Did resize', newWidth, newHeight, eventType);
|
||||
}
|
||||
|
||||
// Create an observer instance linked to the callback function
|
||||
@@ -163,6 +172,7 @@ ${HTML(fragment.foot_html())}
|
||||
|
||||
window.addEventListener('load', dispatchResizeMessage);
|
||||
window.addEventListener('resize', dispatchResizeMessage);
|
||||
console.log('MFE', 'Bind events to element', contentElement);
|
||||
}
|
||||
}());
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user