Can't clear cache through code automatically even though meta.json is generated react-clear-cache package

I have added scripts for generating meta data and also imported react-clear-cache.

The script for the building meta data is below:

"prebuild": "npm run generate-build-meta", "generate-build-meta": "./node_modules/react-clear-cache/bin/cli.js",

As I start the npm or my project it builds the script and meta.json file with new version is created.

I used ClearCache in return function of the main component from the other source referred and i have copied it below.

return(
 <div>
      <ClearCache>
        {({ isLatestVersion, emptyCacheStorage }) => (
          <div>
            {
              !isLatestVersion &&
                caches.keys().then((cacheNames) => {
                  cacheNames.forEach((cacheName) => {
                    caches.delete(cacheName);
                  });
                })
             }
          </div>
        )}
      </ClearCache>
    </div>
   )

I am using the cache keys for handling the array of requests and iterating one by one and deleting the old cache if a new cache arrives.

Also tried emptyCacheStorage() instead of cache Keys;

But if I made changes in my code and open in an incognito browser the changes don't occur and the cache is not cleared.