Microsoft.JSInterop.JSException: Could not find 'browserInterop.getPropertyRef' ('browserInterop' was undefined) - in Blazor

I am having an issue in my blazor application with the JS Interop. The method is for a pop up to allow to access users location for a weather API call but if its a users first time hitting the site it crashes...but if refreshed it all works fine and if the users exists it works fine aswell here is the method and it being called. Would appreciate any input.

Method:

public async Task GetUserLocation()
    {
        try
        {
            //Ask user access to geolocation
            var window = await jsRuntime.Window();
            var navigator = await window.Navigator();
            GeolocationWrapper = navigator.Geolocation;
        }
        catch (Exception)
        {
            throw;
        }

        //Gets current Geolocation
        CurrentPosition = await GeolocationWrapper.GetCurrentPosition();

        //Lattitude coords
        UserLocaion.Lat = CurrentPosition.Location.Coords.Latitude.ToString("0.00");
         
        //Longitude coords
        UserLocaion.Lon = CurrentPosition.Location.Coords.Longitude.ToString("0.00");
    }

called here:

protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        if (firstRender)
        {
            // Gets coordinates from geolocation using IJSRuntime Geoloaction navigator
            await GetUserLocation();

            //Gets data from Open Weather API
            OPW_WeatherData = await iOPW.GetWeatherData(UserLocaion.Lat,UserLocaion.Lon);

            //Gets the forecast for the week 
            WeeksForecast = iOPW.GetWeeksForecast(OPW_WeatherData);

            //Get todays weather
            TodaysWeather = iOPW.GetTodaysWeather(OPW_WeatherData, WeeksForecast);

            //Sets the Timezone of the current User
            TimeZone = OPW_WeatherData.Timezone;

            StateHasChanged();
        }
    }