Problem with returning a render_template when processing a POST request (getting JSON data from another html template)?

Question

My javascript code in my HTML template, test.html, in my /test route.

        var p = (correct/5) * 100;

        var score = {p: p}; 
        
        fetch("http://127.0.0.1:5000/score", {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            },
            body: JSON.stringify(score)
        })
        .then (res => {
            return res.json()
        })
          .then(console.log(score))
          .catch(error => console.log('ERROR')) 

As you can see from the code above, I am trying to send score to the /score route.

Below is my python code:

@app.route("/score", methods=["POST", "GET"])
def score():
    if request.method == "POST":
        data = request.get_json()
        score = data['p']
        return render_template("score.html", score=score)
        
    return render_template("beforetest.html")

When I do print(score), it prints the correct value so that works fine. However, it doesn't pull up the score.html page, I'm guessing because it is not a GET request but I am not sure how to do both a POST and GET request in this situation.

Also, one other thing I noticed (not sure if this is related to this issue or not) is that in the /test route, when I open the console, in the first line it has the correct value of p as intended but on the next line it has "ERROR" (from the .catch method).

How can I return the render_template to pull up the page and why am I getting an error with the .catch method?

EDIT: The suggested link in the comment got rid of the console error, but it still doesn't pull up the page. I noticed that it had "1 hidden" in the top right and when I opened it, it had:

XHR finished loading: POST "http://127.0.0.1:5000/score" but it still doesn't pull up score.html