CORs Error from s3 Static pages

We are serving React Javascript static pages from an s3 bucket. The bucket has set CORs permissions to allow for api calls to two different api-gateway HTTP endpoints.

[
    {
        "AllowedHeaders": [
            "api-key"
        ],
        "AllowedMethods": [
            "GET",
            "POST",
            "PUT",
            "DELETE",
            "HEAD"
        ],
        "AllowedOrigins": [
            "http://*",
            "https://rest-api.com",
            "https://http-api.com"
        ],
        "ExposeHeaders": [
            "Access-Control-Allow-Origin"
        ]
    }
]

In the HTTP API We have CORs enabled:

I can run the API and frontend locally - make the call the HTTP API to upload the file and it works, but when the files are hosted in s3 we get the error.

THe call isn't even making it to the lambda function because its not getting logged in Cloudwatch, and the only information getting logged to Cloudwatch from the HTTP API is a 500 error but no reason is given.

I do have an OPTIONS method specified on this specific endpoint with a lambda integration.

And this stage (test) is set up for autodeployments. Even though its not reaching the lamda - we are handling the options request there:

 try {
        if (event.routeKey.includes('OPTIONS')) {
            return {
                statusCode: 200,
                headers: {
                    "Access-Control-Allow-Headers" : "*",
                    "Access-Control-Allow-Origin": "*",
                    "Access-Control-Allow-Methods": "OPTIONS,POST"
                }
            };
        }

I must be overlooking something. TIA