Axios call in cypress test

Question

I am trying to call axios.post in my cypress test. I don't wanna use cy.request() in this case. I'm trying to add a command which will log in.

Cypress.Commands.add('login', async () => {
    const refreshToken =
        'harcoded refresh_token';

    window.localStorage.setItem(
        `NS0ok4dltKxG7nzk/FT3dMxlHf9CvcKG0O8bqz+ktV0upHWl6mlJ52ml1ei92UyohsEkL92VWLpJ4E1a/ZvK3A==`,
        JSON.stringify({
            refreshToken,
        })
    );

    await auth.refreshAccessToken();
});

basically here I'm setting hardcoded long refresh_token which is used only for tests purposes. Then I'm setting it into localstorage and then I'm executing method from my service which will basically handle everything else -

it will detect lack of access_token and will call API to get new access_token using refresh_token which was set into storage.

Unfortunetally it says that I need some kind of loader:

Error: Webpack Compilation Error
./src/service/AuthService.ts 43:170
Module parse failed: Unexpected token (43:170)
File was processed with these loaders:
 * ./node_modules/ts-loader/index.js
You may need an additional loader to handle the result of these loaders.
|     }
|     async refreshAccessToken() {

>         const { data } = await axiosAws.post(`/oauth2/token?grant_type=refresh_token&client_id=${process.env.VUE_APP_CLIENT_ID}&refresh_token=${this.getStoredApiTokens()?.refreshToken}`, {});

So this is failing. I also tried to remove process.env and changed await to then just to check if maybe envs or await are causing this but no. It fails even with

Error: Webpack Compilation Error
./src/service/AuthService.ts 45:100
Module parse failed: Unexpected token (45:100)
File was processed with these loaders:
 * ./node_modules/ts-loader/index.js
You may need an additional loader to handle the result of these loaders.
|         let data;
|         axiosAws
>             .post(`/oauth2/token?grant_type=refresh_token&refresh_token=${this.getStoredApiTokens()?.refreshToken}`, {})
|             .then(response => {
|             data = response.data;

Seems like I'm obligated to use cy.request() . Can't I somehow use my method instead? Don't really wanna recreate entire refreshAccessToken() within the test using cy.request()

Axios call in cypress test

0 Answers