iframeview.js 1.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475
  1. /**
  2. * @license Copyright (c) 2003-2020, CKSource - Frederico Knabben. All rights reserved.
  3. * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  4. */
  5. /**
  6. * @module ui/iframe/iframeview
  7. */
  8. import View from '../view';
  9. /**
  10. * The iframe view class.
  11. *
  12. * const iframe = new IframeView();
  13. *
  14. * iframe.render();
  15. * document.body.appendChild( iframe.element );
  16. *
  17. * iframe.on( 'loaded', () => {
  18. * console.log( 'The iframe has loaded', iframe.element.contentWindow );
  19. * } );
  20. *
  21. * iframe.element.src = 'https://ckeditor.com';
  22. *
  23. * @extends module:ui/view~View
  24. */
  25. export default class IframeView extends View {
  26. /**
  27. * Creates a new instance of the iframe view.
  28. *
  29. * @param {module:utils/locale~Locale} [locale] The locale instance.
  30. */
  31. constructor( locale ) {
  32. super( locale );
  33. const bind = this.bindTemplate;
  34. this.setTemplate( {
  35. tag: 'iframe',
  36. attributes: {
  37. class: [
  38. 'ck',
  39. 'ck-reset_all'
  40. ],
  41. // It seems that we need to allow scripts in order to be able to listen to events.
  42. // TODO: Research that. Perhaps the src must be set?
  43. sandbox: 'allow-same-origin allow-scripts'
  44. },
  45. on: {
  46. load: bind.to( 'loaded' )
  47. }
  48. } );
  49. }
  50. /**
  51. * Renders the iframe's {@link #element} and returns a `Promise` for asynchronous
  52. * child `contentDocument` loading process.
  53. *
  54. * @returns {Promise} A promise which resolves once the iframe `contentDocument` has
  55. * been {@link #event:loaded}.
  56. */
  57. render() {
  58. return new Promise( resolve => {
  59. this.on( 'loaded', resolve );
  60. super.render();
  61. } );
  62. }
  63. }
  64. /**
  65. * Fired when the DOM iframe's `contentDocument` finished loading.
  66. *
  67. * @event loaded
  68. */