test('remove the unload message', () => {
ltiMessageHandler(postMessageEvent(unloadMessage()))
sinon.spy(window, 'removeEventListener')
notOk(window.removeEventListener.calledOnce)
ltiMessageHandler(postMessageEvent(removeUnloadMessage))
ok(window.removeEventListener.calledOnce)
})
test('hides the module navigation', () => {
ltiToolWrapperFixture.append(`
<div>
<div id="module-footer" class="module-sequence-footer">Next</div>
</div>
`)
const moduleFooter = $('#module-footer')
ok(moduleFooter.is(':visible'))
ltiMessageHandler(postMessageEvent(showMessage(false)));
notOk(moduleFooter.is(':visible'))
})
test('finds and resizes an iframe in embedded content', () => {
ltiToolWrapperFixture.append(`
<div>
<h1 class="page-title">LTI resize test</h1>
<p><iframe style="width: 100%; height: ${intialHeight}px;" src="https://canvas.example.com/courses/4/external_tools/retrieve?display=borderless" width="100%" height="${intialHeight}px" allowfullscreen="allowfullscreen" webkitallowfullscreen="webkitallowfullscreen" mozallowfullscreen="mozallowfullscreen"></iframe></p>
</div>
`)
const iframe = $('iframe')
equal(iframe.height(), 100)
ltiMessageHandler(postMessageEvent(resizeMessage, iframe[0].contentWindow));
equal(iframe.height(), finalHeight)
})
test('finds and resizes the tool content wrapper', () => {
ltiToolWrapperFixture.append(`
<div id="content-wrapper" class="ic-Layout-contentWrapper">
<div id="content" class="ic-Layout-contentMain" role="main">
<div class="tool_content_wrapper" data-tool-wrapper-id="b58b20b7-c097-43bd-9f6c-c08adbac0ea3" style="height: ${intialHeight}px;">
<iframe src="about:blank" name="tool_content" id="tool_content" class="tool_launch" allowfullscreen="allowfullscreen" webkitallowfullscreen="true" mozallowfullscreen="true" tabindex="0" title="Tool Content" style="height:100%;width:100%;" allow="geolocation *; microphone *; camera *; midi *; encrypted-media *"></iframe>
</div>
</div>
</div>
`)
const el = $('#content-wrapper')
const toolContentWrapper = el.find('.tool_content_wrapper')
equal(toolContentWrapper.height(), 100)
ltiMessageHandler(postMessageEvent(resizeMessage));
equal(toolContentWrapper.height(), finalHeight)
})
test('scrolls to the top of the content wrapper', () => {
ltiToolWrapperFixture.append(`
<div style="height:333px;">
</div>
<div id="content-wrapper" class="ic-Layout-contentWrapper">
<div id="content" class="ic-Layout-contentMain" role="main">
<div class="tool_content_wrapper" data-tool-wrapper-id="b58b20b7-c097-43bd-9f6c-c08adbac0ea3" style="height: ${intialHeight}px;">
<iframe src="about:blank" name="tool_content" id="tool_content" class="tool_launch" allowfullscreen="allowfullscreen" webkitallowfullscreen="true" mozallowfullscreen="true" tabindex="0" title="Tool Content" style="height:4000px;width:100%;" allow="geolocation *; microphone *; camera *; midi *; encrypted-media *"></iframe>
</div>
</div>
</div>
<div style="height:444px;">
</div>
`)
const wrapper = $('.tool_content_wrapper')
const html = $('html,body')
const scrolledTo = 1
html.scrollTop(scrolledTo)
equal(html.scrollTop(), scrolledTo)
ltiMessageHandler(postMessageEvent(scrollMessage));
clock.tick(1000)
equal(html.scrollTop(), wrapper.offset().top)
})
test('triggers a screen reader alert', () => {
sinon.spy($, 'screenReaderFlashMessageExclusive')
ltiMessageHandler(postMessageEvent(alertMessage()));
ok($.screenReaderFlashMessageExclusive.calledOnce)
})
test('sets the unload message', () => {
sinon.spy(window, 'addEventListener')
notOk(window.addEventListener.calledOnce)
ltiMessageHandler(postMessageEvent(unloadMessage()))
ok(window.addEventListener.calledOnce)
})