missing result options in SubscriptionOptions #1014

sprhawk · 2020-07-10T08:05:09Z

Describe the bug
Missing result options in SubscriptionOptions

To Reproduce

 18 import Vue from 'vue'
 19 import Component from 'vue-class-component'
 20
 21 import { UsbDisk, OnUsbdisksChanged } from "generated/graphql";
 22
 23 @Component({
 24   apollo: {
 25     $subscribe: {
 26       usbDisksChanged: {
 27         query: OnUsbdisksChanged,
 28         result({ data }: any) {
 29           let disks: UsbDisk[] = data.usbDisksChanged;
 33           Vue.set(this, 'usbdisks', disks); // <- this is VueComponent
 34         }
 36       },
 37     }
 38   }})
 39 export default class DisksPage extends Vue {
 55
 56   usbdisks: UsbDisk[] = [];
 57
 58   created() {
 59   }
 60 }

On line 28, the result will fail to pass 'type check' or 'compile' from typescript compiler, reporting:

TS2769: No overload matches this call.
  Overload 1 of 2, '(options: ComponentOptions<Vue, DefaultData<Vue>, DefaultMethods<Vue>, DefaultComputed, PropsDefinition<Record<string, any>>, Record<...>> & ThisType<...>): <VC extends VueClass<...>>(target: VC) => VC', gave the following error.
    Type '{ query: DocumentNode; result({ data }: { data: any; }): void; }' is not assignable to type 'VueApolloSubscriptionDefinition<OperationVariables>'.
      Object literal may only specify known properties, and 'result' does not exist in type 'VueApolloSubscriptionDefinition<OperationVariables>'.
  Overload 2 of 2, '(target: VueClass<Vue>): VueClass<Vue>', gave the following error.
    Argument of type '{ apollo: { $subscribe: { usbDisksChanged: { query: DocumentNode; result({ data }: { data: any; }): void; }; }; }; }' is not assignable to parameter of type 'VueClass<Vue>'.
      Object literal may only specify known properties, and 'apollo' does not exist in type 'VueClass<Vue>'.

The code after compiled can run without problem. (I set only to use typescript compiler to do type check in webpack configuration)
Expected behavior
result should pass the type-check and compiling

Versions
vue: 2.6.11
vue-apollo:3.0.3
apollo-client:2.6.9
vue-class-component: 7.2.3

*** Additional Context***
I guess the problem is here? Missing a definition to result?

vue-apollo/packages/vue-apollo/types/options.d.ts

Lines 84 to 87 in b13d688

    
           export interface VueApolloSubscriptionDefinition<Variables = OperationVariables> extends Omit<SubscriptionOptions<Variables>, 'variables'> { 
        
             variables?: QueryVariables<Variables> 
        
             client?: string 
        
           }

rwebb-sgefdf · 2020-08-21T12:45:06Z

For anyone looking for a work around - overwriting this type worked for me:

<project-root>/src/types/vue-apollo/index.d.ts

import 'vue-apollo'

declare module 'vue-apollo/types/options' {
	interface VueApolloSubscriptionDefinition<Variables = OperationVariables>
		extends Omit<SubscriptionOptions<Variables>, 'variables'> {
		variables?: QueryVariables<Variables>
		result?: (result: ApolloQueryResult<Result>, key: string) => void
		client?: string
	}
}

It's worth saying the alternative syntax is also affected by this issue (not surprising, but in case anyone tries it anyway like I did):

{
	...
	created() {
		this.$apollo.addSmartQuery("usbDisksChanged", {
			query: OnUsbdisksChanged,
			result({ data }: any) {
				let disks: UsbDisk[] = data.usbDisksChanged;
				Vue.set(this, 'usbdisks', disks); // <- this is VueComponent
		        }
		})
	}
}

Otherwise, using a standard query might be sufficient for the next person's needs, as per the docs

sprhawk added the pending triage label Jul 10, 2020

Akryum added the types label Oct 15, 2020

vuejs / vue-apollo

missing result options in SubscriptionOptions #1014

missing result options in SubscriptionOptions #1014

sprhawk commented Jul 10, 2020 •

edited

rwebb-sgefdf commented Aug 21, 2020

vuejs / vue-apollo

Sponsor vuejs/vue-apollo

Join GitHub today

missing result options in SubscriptionOptions #1014

missing result options in SubscriptionOptions #1014

Comments

sprhawk commented Jul 10, 2020 • edited

rwebb-sgefdf commented Aug 21, 2020

Essential cookies

Always active

Analytics cookies

sprhawk commented Jul 10, 2020 •

edited