utils.js 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132
  1. /**
  2. * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
  3. * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  4. */
  5. import {
  6. FONT_COLOR,
  7. FONT_BACKGROUND_COLOR,
  8. normalizeColorOptions,
  9. addColorTableToDropdown
  10. } from './../src/utils';
  11. import { createDropdown } from '@ckeditor/ckeditor5-ui/src/dropdown/utils';
  12. import ColorTableView from './../src/ui/colortableview';
  13. describe( 'utils', () => {
  14. describe( 'color and background color related', () => {
  15. it( 'plugin names has proper values', () => {
  16. expect( FONT_COLOR ).to.equal( 'fontColor' );
  17. expect( FONT_BACKGROUND_COLOR ).to.equal( 'fontBackgroundColor' );
  18. } );
  19. it( 'normalizeColorOptions can produce the same output object', () => {
  20. const normalizedArray = normalizeColorOptions( [
  21. 'black',
  22. {
  23. color: 'black'
  24. },
  25. {
  26. color: 'black',
  27. label: 'Black'
  28. },
  29. {
  30. color: 'black',
  31. label: 'Black',
  32. hasBorder: true
  33. },
  34. {
  35. color: 'black',
  36. hasBorder: true
  37. }
  38. ] );
  39. expect( normalizedArray ).to.deep.equal( [
  40. {
  41. model: 'black',
  42. label: 'black',
  43. hasBorder: false,
  44. view: {
  45. name: 'span',
  46. styles: {
  47. color: 'black'
  48. }
  49. }
  50. },
  51. {
  52. model: 'black',
  53. label: 'black',
  54. hasBorder: false,
  55. view: {
  56. name: 'span',
  57. styles: {
  58. color: 'black'
  59. }
  60. }
  61. },
  62. {
  63. model: 'black',
  64. label: 'Black',
  65. hasBorder: false,
  66. view: {
  67. name: 'span',
  68. styles: {
  69. color: 'black'
  70. }
  71. }
  72. },
  73. {
  74. model: 'black',
  75. label: 'Black',
  76. hasBorder: true,
  77. view: {
  78. name: 'span',
  79. styles: {
  80. color: 'black'
  81. }
  82. }
  83. },
  84. {
  85. model: 'black',
  86. label: 'black',
  87. hasBorder: true,
  88. view: {
  89. name: 'span',
  90. styles: {
  91. color: 'black'
  92. }
  93. }
  94. },
  95. ] );
  96. } );
  97. it( 'adding colors table to dropdown works', () => {
  98. const dropdown = createDropdown();
  99. dropdown.render();
  100. addColorTableToDropdown( {
  101. dropdownView: dropdown,
  102. colors: [
  103. {
  104. label: 'Black',
  105. color: '#000',
  106. options: {
  107. hasBorder: false
  108. }
  109. },
  110. {
  111. label: 'White',
  112. color: '#FFFFFF',
  113. options: {
  114. hasBorder: true
  115. }
  116. }
  117. ],
  118. columns: 2,
  119. removeButtonTooltip: 'Remove Color'
  120. } );
  121. expect( dropdown.colorTableView ).to.be.instanceOf( ColorTableView );
  122. expect( dropdown.panelView.children.length ).to.equal( 1 );
  123. } );
  124. } );
  125. } );