vue3-yuanma/packages/reactivity/__tests__/ref.spec.ts

65 lines
1.2 KiB
TypeScript
Raw Normal View History

2019-08-16 21:42:46 +08:00
import { ref, effect, reactive } from '../src/index'
2019-05-29 22:11:33 +08:00
describe('observer/value', () => {
it('should hold a value', () => {
2019-08-16 21:42:46 +08:00
const a = ref(1)
2019-05-29 22:11:33 +08:00
expect(a.value).toBe(1)
a.value = 2
expect(a.value).toBe(2)
})
it('should be reactive', () => {
2019-08-16 21:42:46 +08:00
const a = ref(1)
2019-05-29 22:11:33 +08:00
let dummy
effect(() => {
dummy = a.value
})
expect(dummy).toBe(1)
a.value = 2
expect(dummy).toBe(2)
})
it('should make nested properties reactive', () => {
2019-08-16 21:42:46 +08:00
const a = ref({
2019-05-29 22:11:33 +08:00
count: 1
})
let dummy
effect(() => {
dummy = a.value.count
})
expect(dummy).toBe(1)
a.value.count = 2
expect(dummy).toBe(2)
})
it('should work like a normal property when nested in an observable', () => {
2019-08-16 21:42:46 +08:00
const a = ref(1)
const obj = reactive({
2019-05-29 22:11:33 +08:00
a,
b: {
2019-05-30 13:35:50 +08:00
c: a,
d: [a]
2019-05-29 22:11:33 +08:00
}
})
2019-05-30 13:35:50 +08:00
let dummy1
let dummy2
let dummy3
2019-05-29 22:11:33 +08:00
effect(() => {
2019-05-30 13:35:50 +08:00
dummy1 = obj.a
dummy2 = obj.b.c
dummy3 = obj.b.d[0]
2019-05-29 22:11:33 +08:00
})
2019-05-30 13:35:50 +08:00
expect(dummy1).toBe(1)
expect(dummy2).toBe(1)
expect(dummy3).toBe(1)
2019-05-29 22:11:33 +08:00
a.value++
2019-05-30 13:35:50 +08:00
expect(dummy1).toBe(2)
expect(dummy2).toBe(2)
expect(dummy3).toBe(2)
2019-05-29 22:11:33 +08:00
obj.a++
2019-05-30 13:35:50 +08:00
expect(dummy1).toBe(3)
expect(dummy2).toBe(3)
expect(dummy3).toBe(3)
2019-05-29 22:11:33 +08:00
})
})