Request failed with status code 400

[ricovitch]

Hello,

I'm testing figma export cli, in the goal of exporting svgs from figma file.
I created a Personal Access Token, and checked that using it through curl commands works fine.

But the same thing does not work through @figma-export/cli
I get the following error whatever the configuration I use

✖ fetching document
Error: while fetching file "tGSuhDDoppmJXa8Y5Pinq8": Request failed with status code 400
at /Users/helier_e/Dev/tests/figma/figma-export-cli/node_modules/@figma-export/core/dist/lib/export-components.js:21:15
at processTicksAndRejections (node:internal/process/task_queues:96:5)

I use this npm script : dotenv figma-export use-config
With an .env file providing FIGMA_TOKEN, and the following .figmaexportrc.js file content

module.exports = {
  commands: [
    [
      "components",
      {
        fileId: "tGSuhDDoppmJXa8Y5Pinq8",
        outputters: [
          require("@figma-export/output-components-as-svg")({
            output: "./dist/svg",
          }),
        ],
      },
    ],
  ],
};

Any hint on how I can debug this ?
I'm operating through a corporate proxy, but curl commands work (I have HTTP_PROXY and HTTPS_PROXY env vars defined)
I thing it uses axios internally, that should also take into account HTTP_PROXY env vars.

Am I missing something ? Or how can I debug the error further ?

[marcomontalbano]

Hi @ricovitch, thank you a lot for your bug report!

I suspect that the issue is the pretty old version of the Axios library I'm using. Reading their documentation they mention that using proxy env variables should work out-of-the-box.

I plan to upgrade all figma-export dependencies and drop the support for unmaintained Node.js versions. Hopefully, this will solve your issue. Otherwise, I'll introduce a new configuration to operate through a corporate proxy.

[ricovitch]

Hi @marcomontalbano thank you for the quick answer.
That must explain why it does not work.
I think the CLI uses figma-js library (that itself uses axios 0.21.1) internally to wrap Figma API calls, axios 0.21.1 is pretty old effectively so that must be the reason it does not support PROXY env vars.

I created a feature request in figma-js github project to ask for axios update : jemgold/figma-js#65

That could solve this issue I imagine 🙂

[marcomontalbano]

Hi @ricovitch , I just released the v4.8.0-alpha.2 that upgrades Axios to the latest version. It should also force figma-js to use the latest version of Axios.

Lastest version of Axios should support PROXY env vars. Inside their README they mention:

You can also define your proxy using the conventional http_proxy and https_proxy environment variables.
https://github.com/axios/axios

Can you install v4.8.0-alpha.2 and let me know if now figma-export works with PROXY?

[ricovitch]

Thanks for the update @marcomontalbano I'll share this internally so we can have a try and get back to you

[marcomontalbano]

Hi @ricovitch, I just released the v4.8.0 that hopefully could fix this issue. Let me know so that I can close the issue 🤞

[ricovitch]

Hi @marcomontalbano just tried with v4.8.0
We still get an error but now a 407 error instead of 400

Error: while fetching file "V2O4pOutueF8rY0M66NCv4": Request failed with status code 407

Maybe related to this axios issue : axios/axios#4533 (we are using port 3128 for our proxy url)
So it may work for other people using different proxy ports.

[marcomontalbano]

Thanks a lot @ricovitch for the feedback!

[marcomontalbano]

Hi @ricovitch! Sorry if I bother you, but I don't have a way to test a corporate proxy.

I realized that in the previous version v4.8.0, figma-js was still using the old version of Axios, when you install figma-export as a dependency.

You could try to install the latest figma-export version v5.0.1 and add the following to your package.json to force the latest version of Axios:

{
  "overrides": {
    "axios": "^1.6.7"
  },
  "resolutions": {
    "axios": "^1.6.7"
  }
}

[ricovitch]

No worry @marcomontalbano actually I thank you for giving your time on this topic, since you are not concerned with it yourself 🙂
I added override with v4.8.0, without it it was still using old version of axios like you highlighted.
I just tried bumping to v5 and I get the same 407 error, that I suspect to be linked to the axios isssue I mentionned in my last comment.
Maybe if someone else can confirm that figma-export now works with a more "standard" proxy url, or that could be checked by simulating a proxy environment in one that does not need it for corporate constraints. I can not check that myself currently sorry.