JSImport / JSExport Attributes

[0xNinshu]

Hello all, my project is a Blazor WebAssembly Azure Static Webapp. I have a component that is using jsinterop to store values in the browsers local storage with static methods from a class that is importing the localStorage, methods from globalThis.

I can't figure out how to use get my tests to work with my component since it is making JS calls through this class instead of InvokeAsync / InvokeVoidAsync or JSHost.ImportAsync.

Can someone help me out with an example?

---

For reference here is my interop class.

    public static partial class JsLocalStorage
    {
        [JSImport("globalThis.localStorage.getItem")]
        internal static partial string? GetItem([JSMarshalAs<JSType.String>] string key);

        [JSImport("globalThis.localStorage.setItem")]
        internal static partial void SetItem([JSMarshalAs<JSType.String>] string key, [JSMarshalAs<JSType.String>] string value);

        [JSImport("globalThis.localStorage.clear")]
        internal static partial void Clear();

        [JSImport("globalThis.localStorage.removeItem")]
        internal static partial void RemoveItem([JSMarshalAs<JSType.String>] string key);

        [JSImport("globalThis.localStorage.key")]
        internal static partial string? Key([JSMarshalAs<JSType.Number>] int index);
    }

[linkdotnet]

Hey @DesuNinshu.

Maybe this thread and the linked github issues help you further: #806

[0xNinshu]

Hey there! @linkdotnet thanks for the reply, I've read the documentation a bunch of times now thinking I missed something. I am new to testing, I wouldn't know how to wrap the JsImports properly. So, I guess I will find another way of defining these functions in an easily reusable way. Maybe I will create a class and interface that calls IJsRuntime.InvokeAsync / IJsRuntime.InvokeVoidAsync that I can inject, or I will just inherit from that class.
Any suggestions?

[linkdotnet]

From the comment of Steve Sanderson, the usage of JSImport/ JSExport is meant as a replacement for IJSUnmarshalledRuntime. IJSUnmarshalledRuntime is meant for some edge cases. So the "normal" procedure would be using IJSRuntime with calls to InvokeAsync or InvokeVoidAsync.

In any case you could have, as @egil suggested, in the linked topic create a type that you can mock:

public interface IJsLocalStorage
{
  string? GetItem(string key);
}

Your implementation then can use the source generated code internally - basically creating a humble object around the js calls, giving you the ability to mock the behavior as you please.
If you "just" use IJSRuntime.InvokeAsync and friends this should help you.