test: test for directives

packages/runtime-core/__tests__/directives.spec.ts

@@ -1,3 +1,146 @@
+import {
+  h,
+  applyDirectives,
+  ref,
+  render,
+  nodeOps,
+  DirectiveHook,
+  VNode,
+  ComponentInstance,
+  DirectiveBinding,
+  nextTick
+} from '@vue/runtime-test'
+import { currentInstance } from '../src/component'
+
 describe('directives', () => {
-  test.todo('should work')
+  it('should work', async () => {
+    const count = ref(0)
+
+    function assertBindings(binding: DirectiveBinding) {
+      expect(binding.value).toBe(count.value)
+      expect(binding.arg).toBe('foo')
+      expect(binding.instance).toBe(_instance && _instance.renderProxy)
+      expect(binding.modifiers && binding.modifiers.ok).toBe(true)
+    }
+
+    const beforeMount = jest.fn(((el, binding, vnode, prevVNode) => {
+      expect(el.tag).toBe('div')
+      // should not be inserted yet
+      expect(el.parentNode).toBe(null)
+      expect(root.children.length).toBe(0)
+
+      assertBindings(binding)
+
+      expect(vnode).toBe(_vnode)
+      expect(prevVNode).toBe(null)
+    }) as DirectiveHook)
+
+    const mounted = jest.fn(((el, binding, vnode, prevVNode) => {
+      expect(el.tag).toBe('div')
+      // should be inserted now
+      expect(el.parentNode).toBe(root)
+      expect(root.children[0]).toBe(el)
+
+      assertBindings(binding)
+
+      expect(vnode).toBe(_vnode)
+      expect(prevVNode).toBe(null)
+    }) as DirectiveHook)
+
+    const beforeUpdate = jest.fn(((el, binding, vnode, prevVNode) => {
+      expect(el.tag).toBe('div')
+      expect(el.parentNode).toBe(root)
+      expect(root.children[0]).toBe(el)
+
+      // node should not have been updated yet
+      expect(el.children[0].text).toBe(`${count.value - 1}`)
+
+      assertBindings(binding)
+
+      expect(vnode).toBe(_vnode)
+      expect(prevVNode).toBe(_prevVnode)
+    }) as DirectiveHook)
+
+    const updated = jest.fn(((el, binding, vnode, prevVNode) => {
+      expect(el.tag).toBe('div')
+      expect(el.parentNode).toBe(root)
+      expect(root.children[0]).toBe(el)
+
+      // node should have been updated
+      expect(el.children[0].text).toBe(`${count.value}`)
+
+      assertBindings(binding)
+
+      expect(vnode).toBe(_vnode)
+      expect(prevVNode).toBe(_prevVnode)
+    }) as DirectiveHook)
+
+    const beforeUnmount = jest.fn(((el, binding, vnode, prevVNode) => {
+      expect(el.tag).toBe('div')
+      // should be removed now
+      expect(el.parentNode).toBe(root)
+      expect(root.children[0]).toBe(el)
+
+      assertBindings(binding)
+
+      expect(vnode).toBe(_vnode)
+      expect(prevVNode).toBe(null)
+    }) as DirectiveHook)
+
+    const unmounted = jest.fn(((el, binding, vnode, prevVNode) => {
+      expect(el.tag).toBe('div')
+      // should have been removed
+      expect(el.parentNode).toBe(null)
+      expect(root.children.length).toBe(0)
+
+      assertBindings(binding)
+
+      expect(vnode).toBe(_vnode)
+      expect(prevVNode).toBe(null)
+    }) as DirectiveHook)
+
+    let _instance: ComponentInstance | null = null
+    let _vnode: VNode | null = null
+    let _prevVnode: VNode | null = null
+    const Comp = {
+      setup() {
+        _instance = currentInstance
+      },
+      render() {
+        _prevVnode = _vnode
+        _vnode = applyDirectives(h('div', count.value), [
+          {
+            beforeMount,
+            mounted,
+            beforeUpdate,
+            updated,
+            beforeUnmount,
+            unmounted
+          },
+          // value
+          count.value,
+          // argument
+          'foo',
+          // modifiers
+          { ok: true }
+        ])
+        return _vnode
+      }
+    }
+
+    const root = nodeOps.createElement('div')
+    render(h(Comp), root)
+
+    expect(beforeMount).toHaveBeenCalled()
+    expect(mounted).toHaveBeenCalled()
+
+    count.value++
+    await nextTick()
+    expect(beforeUpdate).toHaveBeenCalled()
+    expect(updated).toHaveBeenCalled()
+
+    render(null, root)
+    expect(beforeUnmount).toHaveBeenCalled()
+    expect(unmounted).toHaveBeenCalled()
+  })
 })

packages/runtime-core/__tests__/errorHandling.spec.ts

@@ -360,8 +360,16 @@ describe('error handling', () => {
   })
 
   it('should warn unhandled', () => {
+    // temporarily simulate non-test env
+    process.env.NODE_ENV = 'dev'
+
     const onError = jest.spyOn(console, 'error')
     onError.mockImplementation(() => {})
+    const groupCollpased = jest.spyOn(console, 'groupCollapsed')
+    groupCollpased.mockImplementation(() => {})
+    const log = jest.spyOn(console, 'log')
+    log.mockImplementation(() => {})
+
     const err = new Error('foo')
     const fn = jest.fn()
 
@@ -387,7 +395,11 @@ describe('error handling', () => {
       `Unhandled error during execution of setup function`
     ).toHaveBeenWarned()
     expect(onError).toHaveBeenCalledWith(err)
+
     onError.mockRestore()
+    groupCollpased.mockRestore()
+    log.mockRestore()
+    process.env.NODE_ENV = 'test'
   })
 
   // native event handler handling should be tested in respective renderers