Need simple MVVM example hooking up component as it loads

[bgoldstein14]

I need to avoid using code behind and I've been trying to figure out how to hook up to an event like LoadingStateChanged. I keep getting thread errors when the component tries to load. This way I can grab onto the control instance itself. Is there a simple pure MVVM example (with zero code-behind) that shows how to hook up some of the commands (especially loading) to a viewmodel?

Ultimately, I'm trying to initialize the cefSharp browser instance with something like this:

ChromiumBrowser cefControl = sender as ChromiumBrowser;
cefControl.JavascriptObjectRepository.Settings.LegacyBindingEnabled = true;
cefControl.JavascriptObjectRepository.Register("cefTestClass", testClass, isAsync: false, options: BindingOptions.DefaultBinder);

I've tried to use the Loaded event, but even though it shows that the Command is being setup (in the getter), the event itself never fires off (and neither did Initialized when I tested that one, too), but the Unloaded event does fire off fine:

      <i:Interaction.Triggers>
          <i:EventTrigger EventName="Loaded" >
              <mvvmlightCommand:EventToCommand 
                  Command="{Binding RelativeSource={RelativeSource FindAncestor,
                      AncestorType={x:Type controls:BrowserWindow}}, Path=LoadedCommand}" 
                  PassEventArgsToCommand="True" />
          </i:EventTrigger>
          <i:EventTrigger EventName="Unloaded" >
              <mvvmlightCommand:EventToCommand 
                  Command="{Binding RelativeSource={RelativeSource FindAncestor,
                      AncestorType={x:Type controls:BrowserWindow}}, Path=UnloadedCommand}" 
                  PassEventArgsToCommand="True" />
          </i:EventTrigger>
      </i:Interaction.Triggers>

My next challenge will be how to do that registration of the JavascriptObjectRepository of the test class instance. An MVVM example of that would also be superb!

Thanks.

[amaitland]

I've been trying to figure out how to hook up to an event like LoadingStateChanged.

The http://cefsharp.github.io/api/90.6.x/html/F_CefSharp_Wpf_ChromiumWebBrowser_IsLoadingProperty.htm dependency property is equivalent to LoadingStateChange event.

Ultimately, I'm trying to initialize the cefSharp browser instance with something like this:

LoadingStateChange would be too late to enable legacy JavaScript Binding. It's unlikely you'd be able to set LegacyBindingEnabled in a ViewModel, it needs to be set before the underlying CEF browser is created and cannot be changed after.

Subclassing ChromiumWebBrowser and setting the value in the constructor is likely the only option currently.

Possibly an event could be added, there are a few other use cases where this might be useful.

My next challenge will be how to do that registration of the JavascriptObjectRepository of the test class instance.

The http://cefsharp.github.io/api/90.6.x/html/E_CefSharp_IJavascriptObjectRepository_ResolveObject.htm event can be used. Once you have set LegacyBindingEnabled

[amaitland]

If you just need simple message passing then CefSharp.PostMessage is a very simple alternative to binding an object.

#2775 (comment)

[bgoldstein14]

Thank you for your responses @amaitland and quick turnaround. We will explore our options as we try to move forward with the control and we appreciate this information.

I am curious as to why we never saw the Loaded (or Initialized) event fire off but the Unloaded event worked fine.

Be on guard for more questions, though! :)

[amaitland]

I am curious as to why we never saw the Loaded (or Initialized) event fire off but the Unloaded event worked fine.

The https://docs.microsoft.com/en-us/dotnet/api/system.windows.frameworkelement.loaded?view=net-5.0 event is inherited. We subscribe to the event internally at https://github.com/cefsharp/CefSharp/blob/cefsharp/90/CefSharp.Wpf/ChromiumWebBrowser.cs#L543

We don't mark the event has handled, other handlers should fire as expected. I'd suggest subscribing to the event in the code behind and confirm that the problem reproduces. Source is there should you wish to dig deeper.

Be on guard for more questions, though! :)

Please use https://github.com/cefsharp/CefSharp/discussions to ask questions in future please.