Following the documentation gives CORS policy errors on my Firebase Functions

Question

I have a web app that is already using Firebase for authentications and also Firestore. I want to call my function from the web app so I am using onCall because it's recommended by Functions documentation.

When I run my web app on localhost, I got this error: blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Server:

import { onCall, HttpsError } from "firebase-functions/v2/https";
import { onDocumentWritten } from "firebase-functions/v2/firestore";

import * as logger from "firebase-functions/logger";

exports.plusone = onCall({
    cors: true,
}, (request) => {
    const email = request.auth?.token.email;
    const num = request.data.num;

    logger.log(email + " tried to increase his number by one:" + num);

    return {
        finalNum: num + 1,
    }
})

Client:

const functions = getFunctions();
const plusone = httpsCallable(
  functions, 'plusone'
)
plusone().then((result) => {
    console.log(result.data.message)
})

Update: Also, I do think I gave the necessary permissions:

Answer 1

I deleted the entire firebase functions folder and restarted from scratch and the error is gone.