ref,
toRef,
toRefs,
+ toValue,
} from '../src/index'
import { computed } from '@vue/runtime-dom'
import { customRef, shallowRef, triggerRef, unref } from '../src/ref'
x: 1,
})
const x = toRef(a, 'x')
+
+ const b = ref({ y: 1 })
+
+ const c = toRef(b)
+
+ const d = toRef({ z: 1 })
+
+ expect(isRef(d)).toBe(true)
+ expect(d.value.z).toBe(1)
+
+ expect(c).toBe(b)
+
expect(isRef(x)).toBe(true)
expect(x.value).toBe(1)
expect(a.value).toBe(rr)
expect(a.value).not.toBe(r)
})
+
+ test('toValue', () => {
+ const a = ref(1)
+ const b = computed(() => a.value + 1)
+ const c = () => a.value + 2
+ const d = 4
+
+ expect(toValue(a)).toBe(1)
+ expect(toValue(b)).toBe(2)
+ expect(toValue(c)).toBe(3)
+ expect(toValue(d)).toBe(4)
+ })
})
unwatch!()
expect(scope.effects.length).toBe(0)
})
+
+ test('circular reference', async () => {
+ const obj = { a: 1 }
+ // @ts-expect-error
+ obj.b = obj
+ const foo = ref(obj)
+ const spy = vi.fn()
+
+ watch(foo, spy, { deep: true })
+
+ // @ts-expect-error
+ foo.value.b.a = 2
+ await nextTick()
+ expect(spy).toHaveBeenCalledTimes(1)
+ expect(foo.value.a).toBe(2)
+ })
})
const cloned8 = cloneVNode(original4)
expect(cloned8.ref).toMatchObject({ i: mockInstance2, r, k: 'foo' })
+ // @ts-expect-error #8230
+ const original5 = createVNode('div', { ref: 111, ref_key: 'foo' })
+ expect(original5.ref).toMatchObject({
+ i: mockInstance2,
+ r: '111',
+ k: 'foo',
+ })
+ const cloned9 = cloneVNode(original5)
+ expect(cloned9.ref).toMatchObject({ i: mockInstance2, r: '111', k: 'foo' })
+
setCurrentRenderingInstance(null)
})
it('should support modifiers', async () => {
const component = defineComponent({
data() {
- return { number: null, trim: null, lazy: null, trimNumber: null }
+ return {
+ number: null,
+ trim: null,
+ lazy: null,
+ trimNumber: null,
+ trimLazy: null,
+ }
},
render() {
return [
trim: true,
},
),
+ withVModel(
+ h('input', {
+ class: 'trim-lazy',
+ 'onUpdate:modelValue': (val: any) => {
+ this.trimLazy = val
+ },
+ }),
+ this.trim,
+ {
+ trim: true,
+ lazy: true,
+ },
+ ),
withVModel(
h('input', {
class: 'trim-number',
const number = root.querySelector('.number')
const trim = root.querySelector('.trim')
const trimNumber = root.querySelector('.trim-number')
+ const trimLazy = root.querySelector('.trim-lazy')
const lazy = root.querySelector('.lazy')
const data = root._vnode.component.data
await nextTick()
expect(data.trimNumber).toEqual(1.2)
+ trimLazy.value = ' ddd '
+ triggerEvent('change', trimLazy)
+ await nextTick()
+ expect(data.trimLazy).toEqual('ddd')
+
lazy.value = 'foo'
triggerEvent('change', lazy)
await nextTick()