fix: arguments call of controllers tree functions in client side

Author: ezypeeze

lib/plugins/api.template.js

@@ -29,15 +29,16 @@ function generateAPI(controllerMapping) {
     Object.keys(controllerMapping).forEach(function (key) {
         const context = controllerMapping[key];
         if (context && context.path && context.verb) {
-            api[key] = function (params, values) {
+            api[key] = function ({params, ...values}) {
                 return ApiHandler(
                     injectParamsIntoPath(
                         context.path[context.path.length - 1] === '/' ?
                             context.path.slice(0, context.path.length - 1) :
                             context.path,
                         params
 					),
-                    context.verb, values || {},
+                    context.verb,
+                    values || {},
                     <%= options.apiConfig %>
                 );
             }

tests/api.flow.test.js

@@ -7,22 +7,14 @@ test.before(globalBeforeAll({
 }));
 test.after(globalAfterAll());
 
-test('Test api prefix (GET /api/v2)', async (t) => {
-    try {
-        await api.get('/users/categories');
-    } catch (err) {
-        t.is(err.response.status, 404);
-    }
-});
-
 test('Test first level api (GET /api/v2/users)', async (t) => {
     const {data} = await api.get('/users');
     t.true(data.ok);
 });
 
-test('Test second level api (GET /api/v2/users/categories) - should give 404', async (t) => {
+test('Test second level api (GET /api/v2/foo) - should give 404', async (t) => {
     try {
-        await api.get('/users/categories');
+        await api.get('/foo');
     } catch (err) {
         t.is(err.response.status, 404);
     }
@@ -60,11 +52,13 @@ test('Test hybrid api data flow client side', async (t) => {
     const clickEvent = new window.Event('click');
     const path       = window.document.querySelector('.index span.path');
     const okay       = window.document.querySelector('.index span.okay');
+    const idParam    = window.document.querySelector('.index span.id-param');
     const changePath = window.document.querySelector('.index .change-path');
 
     changePath.dispatchEvent(clickEvent);
     await new Promise(resolve => setTimeout(resolve, 1000)); // wait for API request
 
-    t.is(path.textContent, '/api/v2/users');
+    t.is(path.textContent, '/api/v2/users/1');
     t.is(okay.textContent, "It's okay!");
+    t.is(idParam.textContent, '1');
 });

tests/fixtures/api/users/categories/index.js

@@ -0,0 +1 @@
+module.exports = TestController;

tests/fixtures/api/users/index.js

@@ -13,6 +13,15 @@ class UserController {
         }
     }
 
+    async getAction({params, query}) {
+        return {
+            ok: true,
+            path: this.request.originalUrl,
+            params,
+            query,
+        }
+    }
+
     createAction({params, body}) {
         return {
             ok: true,
@@ -47,6 +56,10 @@ UserController.ROUTES = {
         path: '/',
         verb: 'GET'
     },
+    getAction: {
+        path: '/:id',
+        verb: 'GET'
+    },
     createAction: {
         path: '/',
         verb: 'POST'

tests/fixtures/pages/index.vue

@@ -1,6 +1,7 @@
 <template>
     <div class="index">
         <span class="path">{{ data.path }}</span>
+        <span class="id-param">{{ data.params && data.params.id }}</span>
         <span class="okay" v-if="data.ok">It's okay!</span>
         <span class="okay" v-else>It's not okay...</span>
 
@@ -14,7 +15,7 @@
         asyncData: async ({app}) => ({data: await app.$api.users.categories.types.allAction()}),
         methods: {
             async handleClick() {
-                this.data = await this.$api.users.allAction();
+                this.data = await this.$api.users.getAction({params: {id: 1}});
             }
         }
     }