Allow overriding entire handler function in generated MSW handlers, not just response object about orval HOT 4 OPEN

Regarding alternatives, when extending and defining a mock definition in a test, for example, you can use the following function that automatically generates the key.

Thanks for your reply!

The get*Key methods could be used, but there a number of downsides to that:

1. The method actually returns an array, where only the first element is the URL. So you would need to do something like http.post(getListPetsKey(123)[0], async () => new HttpResponse('', { status: 500 }))
2. You still have to repeat the HTTP verb (e.g. http.post). That's a possible source of errors, since the writer of the test has to manually make sure to pick the correct HTTP verb - even though orval actually knows the right verb.
3. It forces you to actually pick values for the path parameters, such as getListPetsKey(paramA, paramB). That's inconsistent with the Orval-generated handlers, which just uses a placeholder such as :paramA, :paramB in the URL given to MSW.

Overall, I'm afraid this would not be a good developer experience.

So for now, my team will keep hard-coding URLs in tests. And I would be delighted if in the future, Orval will provide support for more flexible handler overrides.

from orval.

@severinh

Thank you for made this issue.

Simulating HTTP errors in tests

Regarding alternatives, when extending and defining a mock definition in a test, for example, you can use the following function that automatically generates the key.

https://github.com/anymaniax/orval/blob/master/samples/react-app-with-swr/src/api/endpoints/petstoreFromFileSpecWithTransformer.ts#L35

const key = getListPetsKey()

server.use(
  http.post(key, async () => new HttpResponse('', { status: 500 }))
);

from orval.

Yes, this is an alternative method, but it is consistent and functional with the URL defined in OpenAPI, so please consider it as one method.

const key, _ = getListPetsKey()

from orval.

If you want to test different response types, you can use the generateEachHttpStatus config option in output.mock:

output: {
  mock: {
    type: "msw",
    generateEachHttpStatus: true
  }
}

With a specification that have two responses of a ListPets endpoint, one 200 and one 500, the following mock is generated:

export const getListPetsMockHandler200 = (
  overrideResponse?:
    | Pets
    | ((info: Parameters<Parameters<typeof http.get>[1]>[0]) => Pets),
) => {
  return http.get('*/v:version/pets', async (info) => {
    await delay(1000);
    return new HttpResponse(
      JSON.stringify(
        overrideResponse !== undefined
          ? typeof overrideResponse === 'function'
            ? overrideResponse(info)
            : overrideResponse
          : getListPetsResponseMock200(),
      ),
      {
        status: 200,
        headers: {
          'Content-Type': 'application/json',
        },
      },
    );
  });
};

export const getListPetsMockHandler500 = (
  overrideResponse?:
    | Error
    | ((info: Parameters<Parameters<typeof http.get>[1]>[0]) => Error),
) => {
  return http.get('*/v:version/pets', async (info) => {
    await delay(1000);
    return new HttpResponse(
      JSON.stringify(
        overrideResponse !== undefined
          ? typeof overrideResponse === 'function'
            ? overrideResponse(info)
            : overrideResponse
          : getListPetsResponseMock500(),
      ),
      {
        status: 500,
        headers: {
          'Content-Type': 'application/json',
        },
      },
    );
  });
};

And you no longer need to overwrite the whole mock handler.

from orval.