Typings: Improve $slots and $scopedSlots type to prevent unchecked ac…

…cess to undefined (#8946)

* fix(types): Declare $scopedSlots as potentially undefined to enable stricter TS checks

* fix(types): Fix tests

* fix(types): declare $slots option as potentially undefined

declare $slots option as potentially undefined to enable stricter TS checks

types/test/options-test.ts

@@ -304,8 +304,8 @@ Vue.component('component-with-scoped-slot', {
     child: {
       render (this: Vue, h: CreateElement) {
         return h('div', [
-          this.$scopedSlots['default']({ msg: 'hi' }),
-          this.$scopedSlots['item']({ msg: 'hello' })
+          this.$scopedSlots['default']!({ msg: 'hi' }),
+          this.$scopedSlots['item']!({ msg: 'hello' })
         ])
       }
     }
@@ -314,7 +314,7 @@ Vue.component('component-with-scoped-slot', {
 
 Vue.component('narrow-array-of-vnode-type', {
   render (h): VNode {
-    const slot = this.$scopedSlots.default({})
+    const slot = this.$scopedSlots.default!({})
     if (typeof slot !== 'string') {
       const first = slot[0]
       if (!Array.isArray(first) && typeof first !== 'string') {

types/vue.d.ts

@@ -27,8 +27,8 @@ export interface Vue {
   readonly $root: Vue;
   readonly $children: Vue[];
   readonly $refs: { [key: string]: Vue | Element | Vue[] | Element[] };
-  readonly $slots: { [key: string]: VNode[] };
-  readonly $scopedSlots: { [key: string]: ScopedSlot };
+  readonly $slots: { [key: string]: VNode[] | undefined };
+  readonly $scopedSlots: { [key: string]: ScopedSlot | undefined };
   readonly $isServer: boolean;
   readonly $data: Record<string, any>;
   readonly $props: Record<string, any>;