8
0

memory.js 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  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. /* globals console, document */
  6. import DecoupledEditor from '../../src/decouplededitor';
  7. import ArticlePluginSet from '@ckeditor/ckeditor5-core/tests/_utils/articlepluginset';
  8. const editorData = '<h2>Hello world</h2><p>This is the decoupled editor.</p><img src="sample.jpg" />';
  9. /*
  10. * Memory-leak safe version of decoupled editor manual test does not:
  11. * - define global variables (such as let editor; in main file scope)
  12. * - console.log() objects
  13. * - add event listeners with () => {} methods which reference other
  14. */
  15. function initEditor() {
  16. let editor;
  17. DecoupledEditor
  18. .create( editorData, {
  19. plugins: [ ArticlePluginSet ],
  20. toolbar: {
  21. items: [
  22. 'heading',
  23. '|',
  24. 'bold',
  25. 'italic',
  26. 'link',
  27. 'bulletedList',
  28. 'numberedList',
  29. 'blockQuote',
  30. 'insertTable',
  31. 'mediaEmbed',
  32. 'undo',
  33. 'redo'
  34. ]
  35. },
  36. image: {
  37. toolbar: [
  38. 'imageStyle:full',
  39. 'imageStyle:side',
  40. '|',
  41. 'imageTextAlternative'
  42. ]
  43. },
  44. table: {
  45. contentToolbar: [
  46. 'tableColumn',
  47. 'tableRow',
  48. 'mergeTableCells'
  49. ]
  50. }
  51. } )
  52. .then( newEditor => {
  53. editor = newEditor;
  54. document.querySelector( '.toolbar-container' ).appendChild( newEditor.ui.view.toolbar.element );
  55. document.querySelector( '.editable-container' ).appendChild( newEditor.ui.view.editable.element );
  56. document.getElementById( 'destroyEditor' ).addEventListener( 'click', destroyEditor );
  57. } )
  58. .catch( err => {
  59. console.error( err.stack );
  60. } );
  61. function destroyEditor() {
  62. editor.destroy().then( () => console.log( 'Editor was destroyed' ) );
  63. editor.ui.view.toolbar.element.remove();
  64. editor.ui.view.editable.element.remove();
  65. editor = null;
  66. document.getElementById( 'destroyEditor' ).removeEventListener( 'click', destroyEditor );
  67. }
  68. }
  69. document.getElementById( 'initEditor' ).addEventListener( 'click', initEditor );