React-app deployment to Github Pages - Build Successful but deploy failed

Question

Initially, I deployed my React app (created with create-react-app) to Github Pages and it works fine. However, after a few changes to the src files, I wanted to update the website so I decided to re-deploy the app using npm run deploy and it finishes with Published being printed at the end of the command. On Github, the actions shows that the build is successful, but it's not able to deploy, giving me an error code of 400.

Complete error log from Github is as follow:

Actor: github-pages[bot]
Action ID: 1996792679
Artifact URL: https://pipelines.actions.githubusercontent.com/P4vIRQYdOzrk38NoGmJNrF5GvwW7S92VAUyJNinMXyLtZzPbIB/_apis/pipelines/workflows/1996792679/artifacts?api-version=6.0-preview
{"count":1,"value":[{"containerId":354579,"size":3092480,"signedContent":null,"fileContainerResourceUrl":"https://pipelines.actions.githubusercontent.com/P4vIRQYdOzrk38NoGmJNrF5GvwW7S92VAUyJNinMXyLtZzPbIB/_apis/resources/Containers/354579","type":"actions_storage","name":"github-pages","url":"https://pipelines.actions.githubusercontent.com/P4vIRQYdOzrk38NoGmJNrF5GvwW7S92VAUyJNinMXyLtZzPbIB/_apis/pipelines/1/runs/2/artifacts?artifactName=github-pages","expiresOn":"2022-06-15T05:21:40.7473658Z","items":null}]}
Creating deployment with payload:
{
    "artifact_url": "https://pipelines.actions.githubusercontent.com/P4vIRQYdOzrk38NoGmJNrF5GvwW7S92VAUyJNinMXyLtZzPbIB/_apis/pipelines/1/runs/2/artifacts?artifactName=github-pages&%24expand=SignedContent",
    "pages_build_version": "8e6a4594c3e946a3f32ab67af68f527ec66ffc90",
    "oidc_token": "***"
}
Failed to create deployment for 8e6a4594c3e946a3f32ab67af68f527ec66ffc90.
{"message":"Deployment request failed for 8e6a4594c3e946a3f32ab67af68f527ec66ffc90 due to in progress deployment. Please cancel c1852e5059b99567d48405d0610990fdc25f0946 first or wait for it to complete.","documentation_url":"https://docs.github.com/rest/reference/repos#create-a-github-pages-deployment"}
Error: Error: Request failed with status code 400
Error: Error: Request failed with status code 400
Sending telemetry for run id 1996792679

I'm very confused with what the error is, has anyone countered a 400 error code before while deploying to Gh Pages?

Additional Note: If you need any additional information, please do comment below as this is my first time deploying react app to github pages so I would love to help you in helping me

UPDATE
You can visit the github repo here: cynclar.github.io

Salvucci

what changes did you add to src? – Fancy

I just added animations to my components using framer-motion – Salvucci

And they run fine in npm start locally @DharmikPatel – Salvucci

Delete the whole thing from github pages and try reuploading. – Fancy

I'm having the same problem; I'm just using vanilla JS, but I also ran gh-pages, and it's saying that I need to cancel the deployment. I've tried deleting the entire repo but it didn't work. – Leiker

I'm having the same problem and I did not change anything to my repo. I tried deleting the whole repo and uploading it again without success. – Acetum

Same here, initial deployment worked, then I updated one file and ever since it fails with the same message. – Cosmism

@Cosmism An issue has been filed: github.com/actions/deploy-pages/issues/22 – Acetum

Answer 1

I haven't found a solution, but I have a workaround. If you go to the last working workflow run in the Actions tab (look for a green checkmark), you can click Re-run all jobs, which should deploy your webpage for you, including the latest changes.

Hope this works for the time being until there is a better solution!

Leiker

Might this be a bug? This is so weird but hey as long as it works right haha – Salvucci

How about if there's not one with a green checkmark? How do you work around this? @Leiker – Salvucci

Take a look at the newest answer – Leiker

Answer 2

GitHub has fixed the issue:

If you navigate to the Actions tab, find the last deployment, and Re-run all jobs, it should work. I have tried this myself and it has been successful!

I'll leave the last answer up in case this doesn't work for anyone.

Leiker

This got me past the 400 error, but then I'm getting a 502 error instead. – Herstein

Then it worked a few hours later. /shrug – Herstein

Answer 3

I had the same issue and this didn't work, re-running the old deploy used the same code and didn't have my changes. I deleted all the workflows from the github Actions tab and then pushing again triggered a new deployment that worked.

Vinegarroon