refactor(directives): remove binding.instance

BREAKING CHANGE: custom directive bindings no longer expose instance

    This is a rarely used property that creates extra complexity in
    ensuring it points to the correct instance. From a design
    perspective, a custom directive should be scoped to the element and
    data it is bound to and should not have access to the entire
    instance in the first place.

Author: yyx990803

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

@@ -9,7 +9,6 @@ import {
   DirectiveBinding,
   nextTick
 } from '@vue/runtime-test'
-import { currentInstance, ComponentInternalInstance } from '../src/component'
 
 describe('directives', () => {
   it('should work', async () => {
@@ -18,7 +17,6 @@ describe('directives', () => {
     function assertBindings(binding: DirectiveBinding) {
       expect(binding.value).toBe(count.value)
       expect(binding.arg).toBe('foo')
-      expect(binding.instance).toBe(_instance && _instance.proxy)
       expect(binding.modifiers && binding.modifiers.ok).toBe(true)
     }
 
@@ -107,13 +105,9 @@ describe('directives', () => {
       unmounted
     }
 
-    let _instance: ComponentInternalInstance | null = null
     let _vnode: VNode | null = null
     let _prevVnode: VNode | null = null
     const Comp = {
-      setup() {
-        _instance = currentInstance
-      },
       render() {
         _prevVnode = _vnode
         _vnode = withDirectives(h('div', count.value), [
@@ -153,7 +147,6 @@ describe('directives', () => {
     function assertBindings(binding: DirectiveBinding) {
       expect(binding.value).toBe(count.value)
       expect(binding.arg).toBe('foo')
-      expect(binding.instance).toBe(_instance && _instance.proxy)
       expect(binding.modifiers && binding.modifiers.ok).toBe(true)
     }
 
@@ -167,13 +160,9 @@ describe('directives', () => {
       expect(prevVNode).toBe(_prevVnode)
     }) as DirectiveHook)
 
-    let _instance: ComponentInternalInstance | null = null
     let _vnode: VNode | null = null
     let _prevVnode: VNode | null = null
     const Comp = {
-      setup() {
-        _instance = currentInstance
-      },
       render() {
         _prevVnode = _vnode
         _vnode = withDirectives(h('div', count.value), [
@@ -207,7 +196,6 @@ describe('directives', () => {
     function assertBindings(binding: DirectiveBinding) {
       expect(binding.value).toBe(count.value)
       expect(binding.arg).toBe('foo')
-      expect(binding.instance).toBe(_instance && _instance.proxy)
       expect(binding.modifiers && binding.modifiers.ok).toBe(true)
     }
 
@@ -296,7 +284,6 @@ describe('directives', () => {
       unmounted
     }
 
-    let _instance: ComponentInternalInstance | null = null
     let _vnode: VNode | null = null
     let _prevVnode: VNode | null = null
 
@@ -307,9 +294,6 @@ describe('directives', () => {
     }
 
     const Comp = {
-      setup() {
-        _instance = currentInstance
-      },
       render() {
         return withDirectives(h(Child, { count: count.value }), [
           [

packages/runtime-core/src/directives.ts

@@ -15,12 +15,9 @@ import { VNode } from './vnode'
 import { isFunction, EMPTY_OBJ, makeMap, EMPTY_ARR } from '@vue/shared'
 import { warn } from './warning'
 import { ComponentInternalInstance } from './component'
-import { currentRenderingInstance } from './componentRenderUtils'
 import { callWithAsyncErrorHandling, ErrorCodes } from './errorHandling'
-import { ComponentPublicInstance } from './componentProxy'
 
 export interface DirectiveBinding {
-  instance: ComponentPublicInstance | null
   value: any
   oldValue: any
   arg?: string
@@ -108,14 +105,9 @@ export function withDirectives<T extends VNode>(
   vnode: T,
   directives: DirectiveArguments
 ): T {
-  const internalInstance = currentRenderingInstance
-  if (internalInstance === null) {
-    __DEV__ && warn(`withDirectives can only be used inside render functions.`)
-    return vnode
-  }
-  const instance = internalInstance.proxy
   const props = vnode.props || (vnode.props = {})
-  const bindings = vnode.dirs || (vnode.dirs = new Array(directives.length))
+  const bindings: DirectiveBinding[] =
+    vnode.dirs || (vnode.dirs = new Array(directives.length))
   const injected: Record<string, true> = {}
   for (let i = 0; i < directives.length; i++) {
     let [dir, value, arg, modifiers = EMPTY_OBJ] = directives[i]
@@ -127,7 +119,6 @@ export function withDirectives<T extends VNode>(
     }
     bindings[i] = {
       dir,
-      instance,
       value,
       oldValue: void 0,
       arg,