SWAMPy

✎ CARVE FLESH

EDITING: ImmersiveReader.test.js

/*
 * Copyright (C) 2019 - present Instructure, Inc.
 *
 * This file is part of Canvas.
 *
 * Canvas is free software: you can redistribute it and/or modify it under
 * the terms of the GNU Affero General Public License as published by the Free
 * Software Foundation, version 3 of the License.
 *
 * Canvas is distributed in the hope that it will be useful, but WITHOUT ANY
 * WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
 * A PARTICULAR PURPOSE. See the GNU Affero General Public License for more
 * details.
 *
 * You should have received a copy of the GNU Affero General Public License along
 * with this program. If not, see <http://www.gnu.org/licenses/>.
 */
import React from 'react'
import {initializeReaderButton, ImmersiveReaderButton} from '../ImmersiveReader'
import {render, fireEvent} from '@testing-library/react'

describe('#initializeReaderButton', () => {
  it('renders the immersive reader button into the given mount point', () => {
    document.body.innerHTML = '<div id="mount_point"></div>'
    initializeReaderButton(document.getElementById('mount_point'))
    const buttonElement = document.querySelector('button')
    expect(buttonElement.textContent).toMatch(/Immersive Reader/)
    document.body.innerHTML = ''
  })

describe('ImmersiveReaderButton', () => {
    const fakeContent = {
      title: 'fake title',
      content: () => '<p>Some fake content yay</p>',
    }

describe('onClick', () => {
      beforeEach(() => {
        fetch.mockResponseOnce(JSON.stringify({token: 'fakeToken', subdomain: 'fakeSubdomain'}))
      })

it('calls to launch the Immersive Reader with the proper content', async () => {
        expect.assertions(1)
        const fakeLaunchAsync = (...args) =>
          expect(args).toEqual([
            'fakeToken',
            'fakeSubdomain',
            {
              title: 'fake title',
              chunks: [
                {
                  content: fakeContent.content(),
                  mimeType: 'text/html',
                },
              ],
            },
            {
              cookiePolicy: 0,
            },
          ])
        const fakeReaderLib = Promise.resolve({
          launchAsync: fakeLaunchAsync,
        })
        const {findByText} = render(
          <ImmersiveReaderButton content={fakeContent} readerSDK={fakeReaderLib} />
        )
        const button = await findByText(/Immersive Reader/)
        fireEvent.click(button)
      })

describe('with MathML content', () => {
        const fakeContentWithMath = {
          title: 'fake title',
          content: () => `
            <div>
              Some simple content
              <img src="something"
                class="MathJax_SVG"
                data-mathml="<mrow><apply><minus/><ci>a</ci><ci>b</ci></apply></mrow>"
              />
              Some post math content
            </div>
          `,
        }

it('sends the HTML and MathML as chunks', async () => {
          expect.assertions(1)

// This whitespace is meaningful for the snapshot so please don't remove it!
          const fakeLaunchAsync = (...args) => {
            expect(args[2].chunks).toMatchInlineSnapshot(`
              Array [
                Object {
                  "content": "<div>
                            Some simple content
                            </div>",
                  "mimeType": "text/html",
                },
                Object {
                  "content": "<mrow><apply><minus/><ci>a</ci><ci>b</ci></apply></mrow>",
                  "mimeType": "application/mathml+xml",
                },
                Object {
                  "content": "Some post math content
                          
                        ",
                  "mimeType": "text/html",
                },
              ]
            `)
          }

const fakeReaderLib = Promise.resolve({
            launchAsync: fakeLaunchAsync,
          })

const {findByText} = render(
            <ImmersiveReaderButton content={fakeContentWithMath} readerSDK={fakeReaderLib} />
          )

const button = await findByText(/^Immersive Reader$/)
          fireEvent.click(button)
        })
      })
    })
  })
})

CANCEL

Name	Type	Size	Modified	Actions
↩ ..	DIR	—	—
📄 ContentChunker.test.ts	TS	8 KB	2023-09-24 03:36	EDIT
📄 ContentUtils.test.ts	TS	4.2 KB	2023-09-24 03:36	EDIT
📄 ImmersiveReader.test.js	JS	4.2 KB	2023-09-24 03:39	EDIT