Component crashes if cookieconsent.js is blocked

[bent-rasmussen]

We have just deployed the (otherwise excellent) Cookie Consent on our site and one of our developers noticed the site crashes for him when he clicks on one of the cookie consent dialog buttons. It tries to call some javascript function and crashes. In this specific case it is due to the user having cookie script blocking turned on. Javascript is not blocked but some scripts are blocked.

Screenshot:

Stacktrace:

blazor.server.js:1 [2022-07-06T15:38:41.900Z] Error: Microsoft.JSInterop.JSException: Failed to fetch dynamically imported module: http://localhost:8000/_content/BytexDigital.Blazor.Components.CookieConsent/cookieconsent.js
TypeError: Failed to fetch dynamically imported module: http://localhost:8000/_content/BytexDigital.Blazor.Components.CookieConsent/cookieconsent.js
   at Microsoft.JSInterop.JSRuntime.InvokeAsync[TValue](Int64 targetInstanceId, String identifier, Object[] args)
   at BytexDigital.Blazor.Components.CookieConsent.CookieConsentService.SavePreferencesAsync(CookiePreferences cookiePreferences)
   at BytexDigital.Blazor.Components.CookieConsent.CookieConsentService.SavePreferencesNecessaryOnlyAsync()
   at BytexDigital.Blazor.Components.CookieConsent.CookieConsentHandler.AcceptAsync(Boolean all)
   at BytexDigital.Blazor.Components.CookieConsent.CookieConsentHandler.<BuildRenderTree>b__38_1()
   at Microsoft.AspNetCore.Components.ComponentBase.CallStateHasChangedOnAsyncCompletion(Task task)
   at Microsoft.AspNetCore.Components.Render

So perhaps the component could use error handling in the case a javascript is not available and respond gracefully (for example ignore it).

As a workaround I have created an <ErrorBoundary> around the CookieConsent-based CookieConsentHandler in App.razor.

[RyanTT]

Not sure why it got published as a stable package, but an updated version is available at https://www.nuget.org/packages/BytexDigital.Blazor.Components.CookieConsent/1.0.14

This version handles unavailable JS by simply writing all data to a memory cache and also returning from it if JS can't. This will effectively make the library forget anything that was written once the tab is closed, and also JS tags won't get activated due to the inability to call the JS lib.

Please let me know if this handles your problematic situation appropriately

[bent-rasmussen]

Well, it doesn't quite solve the issue this time. :-) Bizarrely it now crashes in browsers that do not have cookie script blocking but it shows the UI just fine when cookie script blocking is turned on in Vivaldi. There is no existing cookies in either browser so the difference is just Vivaldi has cookie script blocking turned on and the others do not.

Here is the stack trace:

[2022-07-07T05:00:02.560Z] Error: System.Text.Json.JsonException: The input does not contain any JSON tokens. Expected the input to start with a valid JSON token, when isFinalBlock is true. Path: $ | LineNumber: 0 | BytePositionInLine: 0.
 ---> System.Text.Json.JsonReaderException: The input does not contain any JSON tokens. Expected the input to start with a valid JSON token, when isFinalBlock is true. LineNumber: 0 | BytePositionInLine: 0.
   at System.Text.Json.ThrowHelper.ThrowJsonReaderException(Utf8JsonReader& json, ExceptionResource resource, Byte nextByte, ReadOnlySpan`1 bytes)
   at System.Text.Json.Utf8JsonReader.Read()
   at System.Text.Json.Serialization.JsonConverter`1.ReadCore(Utf8JsonReader& reader, JsonSerializerOptions options, ReadStack& state)
   --- End of inner exception stack trace ---
   at System.Text.Json.ThrowHelper.ReThrowWithPath(ReadStack& state, JsonReaderException ex)
   at System.Text.Json.Serialization.JsonConverter`1.ReadCore(Utf8JsonReader& reader, JsonSerializerOptions options, ReadStack& state)
   at System.Text.Json.JsonSerializer.ReadFromSpan[TValue](ReadOnlySpan`1 utf8Json, JsonTypeInfo jsonTypeInfo, Nullable`1 actualByteCount)
   at System.Text.Json.JsonSerializer.ReadFromSpan[TValue](ReadOnlySpan`1 json, JsonTypeInfo jsonTypeInfo)
   at System.Text.Json.JsonSerializer.Deserialize[TValue](String json, JsonSerializerOptions options)
   at BytexDigital.Blazor.Components.CookieConsent.CookieConsentService.GetPreferencesAsync()
   at BytexDigital.Blazor.Components.CookieConsent.CookieConsentService.NotifyPageLoadedAsync()
   at BytexDigital.Blazor.Components.CookieConsent.CookieConsentHandler.OnAfterRenderAsync(Boolean firstRender)
   at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle, ComponentState owningComponentState)

[bent-rasmussen]

I see you are handling a JSException in GetPreferencesAsync but the actual exception thrown is a JsonException - quite close, in terms of letters. :-)

2423321#r77893978

[RyanTT]

Ah.

The behaviour is partially correct, I do not want to handle exceptions but JSException in most of these methods, but GetPreferencesAsync is missing a check for an empty cookie value, which is why it tries to parse an empty string as JSON.

Please try this new release https://www.nuget.org/packages/BytexDigital.Blazor.Components.CookieConsent/1.0.15-preview.1657203345

[bent-rasmussen]

Back from extended weekend and I can confirm this works as expected. Thanks again Ryan!

[RyanTT]

Thanks for the feedback! I released the package as a stable 1.0.15 a few days ago.