function VitalSourceBookViewer({
  launchParams,
  launchUrl,
  willSubmitLaunchForm,
}) {
  const iframe = /** @type {{ current: HTMLIFrameElement }} */ (useRef());

  useEffect(() => {
    const iframeDoc = /** @type {Document} */ (iframe.current.contentDocument);
    const launchForm = iframeDoc.createElement('form');

    launchForm.method = 'POST';
    launchForm.action = launchUrl;

    Object.entries(launchParams).forEach(([key, value]) => {
      const field = iframeDoc.createElement('input');
      field.type = 'hidden';
      field.name = key;
      field.value = value;
      launchForm.appendChild(field);
    });
    iframeDoc.body.appendChild(launchForm);

    // Hook for tests to observe submitted form parameters.
    willSubmitLaunchForm?.(launchForm);

    // Submit the form, triggering a navigation to the VitalSource book viewer.
    launchForm.submit();
  }, [launchParams, launchUrl, willSubmitLaunchForm]);

  return (
    <iframe
      ref={iframe}
      width="100%"
      height="100%"
      title="Course content with Hypothesis annotation viewer"
      src="about:blank"
    />
  );
}
/**
 * Render the VitalSource book viewer application in an iframe.
 *
 * The VitalSource book viewer application uses LTI authentication, similar to
 * how an LMS launches our "lms" app. This works by having the lms frontend
 * create an iframe containing a form with the parameters for an LTI launch
 * as hidden fields, and then automatically submitting that form.
 *
 * The form field names and values are generated by the backend. See the
 * `VitalSourceService` class.
 *
 * @param {VitalSourceBookViewerProps} props
 */
Render the VitalSource book viewer application in an iframe.
The VitalSource book viewer application uses LTI authentication, similar to
how an LMS launches our "lms" app. This works by having the lms frontend
create an iframe containing a form with the parameters for an LTI launch
as hidden fields, and then automatically submitting that form.

The form field names and values are generated by the backend. See the
`VitalSourceService` class.


Render the VitalSource book viewer application in an iframe . The VitalSource book viewer application uses LTI authentication similar to how an LMS launches our " lms " app . This works by having the lms frontend create an iframe containing a form with the parameters for an LTI launch as hidden fields and then automatically submitting that form . The form field names and values are generated by the backend . See the ` VitalSourceService ` class .
function VitalSourceBookViewer({
  launchParams,
  launchUrl,
  willSubmitLaunchForm,
}) {
  const iframe =  (useRef());
  useEffect(() => {
    const iframeDoc =  (iframe.current.contentDocument);
    const launchForm = iframeDoc.createElement('form');
    launchForm.method = 'POST';
    launchForm.action = launchUrl;
    Object.entries(launchParams).forEach(([key, value]) => {
      const field = iframeDoc.createElement('input');
      field.type = 'hidden';
      field.name = key;
      field.value = value;
      launchForm.appendChild(field);
    });
    iframeDoc.body.appendChild(launchForm);
    willSubmitLaunchForm?.(launchForm);
    launchForm.submit();
  }, [launchParams, launchUrl, willSubmitLaunchForm]);
  return (
    <iframe
      ref={iframe}
      width="100%"
      height="100%"
      title="Course content with Hypothesis annotation viewer"
      src="about:blank"
    />
  );
}
function VitalSourceBookViewer ( { launchParams , launchUrl , willSubmitLaunchForm , } ) { const iframe = ( useRef ( ) ) ; useEffect ( ( ) => { const iframeDoc = ( iframe . current . contentDocument ) ; const launchForm = iframeDoc . createElement ( 'form' ) ; launchForm . method = 'POST' ; launchForm . action = launchUrl ; Object . entries ( launchParams ) . forEach ( ( [ key , value ] ) => { const field = iframeDoc . createElement ( 'input' ) ; field . type = 'hidden' ; field . name = key ; field . value = value ; launchForm . appendChild ( field ) ; } ) ; iframeDoc . body . appendChild ( launchForm ) ; willSubmitLaunchForm ?. ( launchForm ) ; launchForm . submit ( ) ; } , [ launchParams , launchUrl , willSubmitLaunchForm ] ) ; return ( < iframe ref = { iframe } width = "100%" height = "100%" title = "Course content with Hypothesis annotation viewer" src = "about:blank" / > ) ; }
Render the VitalSource book viewer application in an iframe.
Render the VitalSource book viewer application in an iframe .
/** @type {{ current: HTMLIFrameElement }} */ /** @type {Document} */ // Hook for tests to observe submitted form parameters. // Submit the form, triggering a navigation to the VitalSource book viewer.