theme_data3.spec.js 4.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150
  1. // import { topoSort } from 'src/services/theme_data/theme_data.service.js'
  2. import {
  3. getAllPossibleCombinations
  4. } from 'src/services/theme_data/iss_utils.js'
  5. import {
  6. init
  7. } from 'src/services/theme_data/theme_data_3.service.js'
  8. import {
  9. basePaletteKeys
  10. } from 'src/services/theme_data/theme2_to_theme3.js'
  11. describe('Theme Data 3', () => {
  12. describe('getAllPossibleCombinations', () => {
  13. it('test simple 3 values case', () => {
  14. const out = getAllPossibleCombinations([1, 2, 3]).map(x => x.sort((a, b) => a - b))
  15. expect(out).to.eql([
  16. [1], [2], [3],
  17. [1, 2], [1, 3], [2, 3],
  18. [1, 2, 3]
  19. ])
  20. })
  21. it('test simple 4 values case', () => {
  22. const out = getAllPossibleCombinations([1, 2, 3, 4]).map(x => x.sort((a, b) => a - b))
  23. expect(out).to.eql([
  24. [1], [2], [3], [4],
  25. [1, 2], [1, 3], [1, 4], [2, 3], [2, 4], [3, 4],
  26. [1, 2, 3], [1, 2, 4], [1, 3, 4], [2, 3, 4],
  27. [1, 2, 3, 4]
  28. ])
  29. })
  30. it('test massive 5 values case, using strings', () => {
  31. const out = getAllPossibleCombinations(['a', 'b', 'c', 'd', 'e']).map(x => x.sort((a, b) => a - b))
  32. expect(out).to.eql([
  33. // 1
  34. ['a'], ['b'], ['c'], ['d'], ['e'],
  35. // 2
  36. ['a', 'b'], ['a', 'c'], ['a', 'd'], ['a', 'e'],
  37. ['b', 'c'], ['b', 'd'], ['b', 'e'],
  38. ['c', 'd'], ['c', 'e'],
  39. ['d', 'e'],
  40. // 3
  41. ['a', 'b', 'c'], ['a', 'b', 'd'], ['a', 'b', 'e'],
  42. ['a', 'c', 'd'], ['a', 'c', 'e'],
  43. ['a', 'd', 'e'],
  44. ['b', 'c', 'd'], ['b', 'c', 'e'],
  45. ['b', 'd', 'e'],
  46. ['c', 'd', 'e'],
  47. // 4
  48. ['a', 'b', 'c', 'd'], ['a', 'b', 'c', 'e'],
  49. ['a', 'b', 'd', 'e'],
  50. ['a', 'c', 'd', 'e'],
  51. ['b', 'c', 'd', 'e'],
  52. // 5
  53. ['a', 'b', 'c', 'd', 'e']
  54. ])
  55. })
  56. })
  57. describe('init', function () {
  58. this.timeout(5000)
  59. it('Test initialization without anything', () => {
  60. const out = init({ inputRuleset: [], ultimateBackgroundColor: '#DEADAF' })
  61. expect(out).to.have.property('eager')
  62. expect(out).to.have.property('lazy')
  63. expect(out).to.have.property('staticVars')
  64. expect(out.lazy).to.be.an('array')
  65. expect(out.lazy).to.have.lengthOf.above(1)
  66. expect(out.eager).to.be.an('array')
  67. expect(out.eager).to.have.lengthOf.above(1)
  68. expect(out.staticVars).to.be.an('object')
  69. // check backwards compat/generic stuff
  70. basePaletteKeys.forEach(key => {
  71. expect(out.staticVars).to.have.property(key)
  72. })
  73. })
  74. it('Test initialization with a basic palette', () => {
  75. const out = init({
  76. inputRuleset: [{
  77. component: 'Root',
  78. directives: {
  79. '--bg': 'color | #008080',
  80. '--fg': 'color | #00C0A0'
  81. }
  82. }],
  83. ultimateBackgroundColor: '#DEADAF'
  84. })
  85. expect(out.staticVars).to.have.property('bg').equal('#008080')
  86. expect(out.staticVars).to.have.property('fg').equal('#00C0A0')
  87. const panelRule = out.eager.filter(x => {
  88. if (x.component !== 'Panel') return false
  89. return true
  90. })[0]
  91. expect(panelRule).to.have.nested.deep.property('dynamicVars.stacked', { r: 0, g: 128, b: 128 })
  92. })
  93. it('Test initialization with opacity', () => {
  94. const out = init({
  95. inputRuleset: [{
  96. component: 'Root',
  97. directives: {
  98. '--bg': 'color | #008080'
  99. }
  100. }, {
  101. component: 'Panel',
  102. directives: {
  103. opacity: 0.5
  104. }
  105. }],
  106. ultimateBackgroundColor: '#DEADAF'
  107. })
  108. expect(out.staticVars).to.have.property('bg').equal('#008080')
  109. const panelRule = out.eager.filter(x => {
  110. if (x.component !== 'Panel') return false
  111. return true
  112. })[0]
  113. expect(panelRule).to.have.nested.deep.property('dynamicVars.background', { r: 0, g: 128, b: 128, a: 0.5 })
  114. expect(panelRule).to.have.nested.deep.property('dynamicVars.stacked')
  115. // Somewhat incorrect since we don't do gamma correction
  116. // real expectancy should be this:
  117. /*
  118. expect(panelRule).to.have.nested.deep.property('dynamicVars.stacked.r').that.is.closeTo(147.0, 0.01)
  119. expect(panelRule).to.have.nested.deep.property('dynamicVars.stacked.g').that.is.closeTo(143.2, 0.01)
  120. expect(panelRule).to.have.nested.deep.property('dynamicVars.stacked.b').that.is.closeTo(144.0, 0.01)
  121. */
  122. expect(panelRule).to.have.nested.deep.property('dynamicVars.stacked.r').that.is.closeTo(88.8, 0.01)
  123. expect(panelRule).to.have.nested.deep.property('dynamicVars.stacked.g').that.is.closeTo(133.2, 0.01)
  124. expect(panelRule).to.have.nested.deep.property('dynamicVars.stacked.b').that.is.closeTo(134, 0.01)
  125. })
  126. })
  127. })