shallowReactive.spec.ts 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125
  1. import { shallowReactive, isReactive, reactive } from '../src/reactive'
  2. import { effect } from '../src/effect'
  3. describe('shallowReactive', () => {
  4. test('should not make non-reactive properties reactive', () => {
  5. const props = shallowReactive({ n: { foo: 1 } })
  6. expect(isReactive(props.n)).toBe(false)
  7. })
  8. test('should keep reactive properties reactive', () => {
  9. const props: any = shallowReactive({ n: reactive({ foo: 1 }) })
  10. props.n = reactive({ foo: 2 })
  11. expect(isReactive(props.n)).toBe(true)
  12. })
  13. describe('collections', () => {
  14. test('should be reactive', () => {
  15. const shallowSet = shallowReactive(new Set())
  16. const a = {}
  17. let size
  18. effect(() => {
  19. size = shallowSet.size
  20. })
  21. expect(size).toBe(0)
  22. shallowSet.add(a)
  23. expect(size).toBe(1)
  24. shallowSet.delete(a)
  25. expect(size).toBe(0)
  26. })
  27. test('should not observe when iterating', () => {
  28. const shallowSet = shallowReactive(new Set())
  29. const a = {}
  30. shallowSet.add(a)
  31. const spreadA = [...shallowSet][0]
  32. expect(isReactive(spreadA)).toBe(false)
  33. })
  34. test('should not get reactive entry', () => {
  35. const shallowMap = shallowReactive(new Map())
  36. const a = {}
  37. const key = 'a'
  38. shallowMap.set(key, a)
  39. expect(isReactive(shallowMap.get(key))).toBe(false)
  40. })
  41. test('should not get reactive on foreach', () => {
  42. const shallowSet = shallowReactive(new Set())
  43. const a = {}
  44. shallowSet.add(a)
  45. shallowSet.forEach(x => expect(isReactive(x)).toBe(false))
  46. })
  47. // #1210
  48. test('onTrack on called on objectSpread', () => {
  49. const onTrackFn = jest.fn()
  50. const shallowSet = shallowReactive(new Set())
  51. let a
  52. effect(
  53. () => {
  54. a = Array.from(shallowSet)
  55. },
  56. {
  57. onTrack: onTrackFn
  58. }
  59. )
  60. expect(a).toMatchObject([])
  61. expect(onTrackFn).toHaveBeenCalled()
  62. })
  63. })
  64. describe('array', () => {
  65. test('should be reactive', () => {
  66. const shallowArray = shallowReactive<unknown[]>([])
  67. const a = {}
  68. let size
  69. effect(() => {
  70. size = shallowArray.length
  71. })
  72. expect(size).toBe(0)
  73. shallowArray.push(a)
  74. expect(size).toBe(1)
  75. shallowArray.pop()
  76. expect(size).toBe(0)
  77. })
  78. test('should not observe when iterating', () => {
  79. const shallowArray = shallowReactive<object[]>([])
  80. const a = {}
  81. shallowArray.push(a)
  82. const spreadA = [...shallowArray][0]
  83. expect(isReactive(spreadA)).toBe(false)
  84. })
  85. test('onTrack on called on objectSpread', () => {
  86. const onTrackFn = jest.fn()
  87. const shallowArray = shallowReactive([])
  88. let a
  89. effect(
  90. () => {
  91. a = Array.from(shallowArray)
  92. },
  93. {
  94. onTrack: onTrackFn
  95. }
  96. )
  97. expect(a).toMatchObject([])
  98. expect(onTrackFn).toHaveBeenCalled()
  99. })
  100. })
  101. })