Support for differentiating URL

[erprilianoAbbas]

Hi,

I have this case where this URL is being called in getLookupValue(lookupName) function on my React component : api/lookup/?lookupName={lookupName},

then in my code I'd call that API like this :

const [title, gender, contactMethod] = await Promise.all([
  getLookupValue('TITLE'),
  getLookupValue('GENDER'),
  getLookupValue('CONTACT_METHOD')
]);

// rest of the code

Then this is how I wrote the mockData on my stories.

// other codes
parameters: {
  mockData: [
    {
        url: 'https://dummy-api.com/api/lookup/?lookupName=TITLE',
        method: 'GET',
        status: 200,
        response: [ { lookupText: 'Mr', lookupValue: 1 } ]
    },
    {
        url: 'https://dummy-api.com/api/lookup/?lookupName=GENDER',
        method: 'GET',
        status: 200,
        response: [ { lookupText: 'Male', lookupValue: 1 } ]
    },
    {
        url: 'https://dummy-api.com/api/lookup/?lookupName=CONTACT_METHOD',
        method: 'GET',
        status: 200,
        response: [ { lookupText: 'Email', lookupValue: 1 } ]
    },
  ],
}

// rest of the codes

Issue

When I debug my code, it seems only CONTACT_METHOD that successfully being mocked, then when I commented that part, GENDER was successfully being mocked. So, I'm assuming all the previous values are being overwritten by the latest value, which in this case is CONTACT_METHOD, because it has almost identical url and only distinguished by the query params.

Question

Is there any other ways to successfully handle this case using this plugin?

[nutboltu]

@erprilianoAbbas if you use the custom response function, you can easily intercept the request params and respond by the lookup name

parameters: {
  mockData: [
    {
      url: 'https://dummy-api.com/api/lookup',
      method: 'GET',
      status: 200,
      response: (request) => {
        if (request.query.lookupName === 'TITLE') {
          return [ { lookupText: 'Mr', lookupValue: 1 } ];
        } else if (request.query.lookupName === 'GENDER') {
          return [ { lookupText: 'Male', lookupValue: 1 } ]
        } else if (request.query.lookupName === 'CONTACT_METHOD') {
          return [ { lookupText: 'Email', lookupValue: 1 } ]
        }
        return [];
      }
    }
  ]
}

[pryahin]

@nutboltu Unfortunately, this isn't a perfect solution. Sometimes, it is necessary to send the first request immediately and the second with a delay. At the moment, it seems that there is no way to do this with this addon