How to make a resource embedded to a page through LTI 1.3 responsive ?

Question

Hi everyone,

When using an LTI 1.3 tool , the resource returned from an LTI 1.3 tool can be embedded through  an iframe in the page.  At the moment, we cannot see any option to make the resource responsive because of the iframe. Does anyone have any idea about how to achieve this ?

Thank you!

matthew_buckett · Answer

Canvas allows you to resize the iframe that you are contained in to eliminate the scroll bars on the iframe. We do this with lots of our tools. The resize is done through a postMessage call and is documented in: https://canvas.instructure.com/doc/api/file.lti_window_post_message.html#lti-frameresize

We have a mutation observer in our iframe that updates the iframe size when the content changes.