MutationAction Type {} is not assignable to { count: newcount }

[bederuijter]

First of all, I love your library, great work!

Secondly I wanted to try out the MutationAction annotation

I've tried using this test as an example, but it didn't seem to work.

@MutationAction({ mutate: ['count'] })
    async updateCount(newcount: number) {
        return { count: newcount };
    }

It throws the following exception (from TypeScript)

Argument of type 'TypedPropertyDescriptor<(newcount: number) => Promise<{ count: number; }>>' is not assignable to parameter of type 'TypedPropertyDescriptor<(...args: any[]) => {}>'. Types of property 'set' are incompatible. Type '((value: (newcount: number) => Promise<{ count: number; }>) => void) | undefined' is not assignable to type '((value: (...args: any[]) => {}) => void) | undefined'. Type '(value: (newcount: number) => Promise<{ count: number; }>) => void' is not assignable to type '(value: (...args: any[]) => {}) => void'. Types of parameters 'value' and 'value' are incompatible. Type '{}' is not assignable to type 'Promise<{ count: number; }>'.

Through trail and error I did get it working by typing the annotation like

@MutationAction<MyVuexModule, Promise<{ count: number }>>({ mutate: ['count'] })
    async updateCount(newcount: number) {
        return { count: newcount };
    }

It seems by manually setting the Target Type and Response type it seems to play nice, but since this wasn't mentioned in the documentation, I would assume that there might be something wrong with my setup.

    "typescript": "^2.9.2",
    "vue": "^2.5.16",
    "vue-class-component": "^6.2.0",
    "vue-inversify-decorator": "^0.1.0",
    "vue-property-decorator": "^7.0.0",
    "vue-router": "^3.0.1",
    "vuetify": "^1.1.12",
    "vuex": "^3.0.1",
    "vuex-class": "^0.3.1",
    "vuex-module-decorators": "^0.3.1",
    "vuex-router-sync": "^5.0.0"

and my class file

@Module({ namespaced: true })
export class MyVuexModule extends VuexModule {
   count = 0;

   @MutationAction<VacationCalendarVuexModule, Promise<{ count: number }>>({ mutate: ['count'] })
    async updateCount(newcount: number) {
        return { count: newcount };
    }
}
export const instance = namespace(VacationCalendarVuexModule.name);

Thanks in advance!

[championswimmer]

Seems weird, probably because of difference in tsconfig ? It should ideally infer the type from the context. I'll try to run it with more node and typesscript versions to make sure of this.

Thanks for reporting!!!

[bederuijter]

When I have access to my tsconfig, ill post it here, anything else that might help?

[bederuijter]

{
    "compileOnSave": false,
    "compilerOptions": {
        "baseUrl": "ClientApp",
        "paths": {
            "@utilities/*": ["utilities/*"],
            "@services": ["services"],
            "@models": ["models"],
            "@plugins/*": ["plugins/*"],
            "@components/*": ["app/components/*"]
        },
        "lib": ["es6", "dom"],
        "experimentalDecorators": true,
        "emitDecoratorMetadata": true,
        "module": "commonjs",
        "moduleResolution": "node",
        "noUnusedLocals": true,
        "noUnusedParameters": true,
        "strict": true,
        "strictPropertyInitialization": false,
        "target": "es6",
        "outDir": "./",
        "types": ["reflect-metadata", "webpack-env"]
    },
    "include": [
        "./typings/type.d.ts",
        "./typings/vue.d.ts",
        "./ClientApp/**/*.ts"
    ],
    "exclude": ["bin"]
}

From the frontpage:

For reduced code with decorators, set emitHelpers: true and importHelpers: true

Could the fact that im missing both be a reason that it isn't working as expected?

[championswimmer]

Could the fact that im missing both be a reason that it isn't working as expected?

Shouldn't be. That just changes how import/export vs require transpilation helper functions work. Your error is at compile stage type-checking itself. I'll look into it.

[championswimmer]

Fixed in v0.4.2