[Enhancement] Support for "full stack" debug and automated acceptance testing

[fizxmike]

Hi,
Now that I've hit a stride with Neutronium and created a working SPA prototype, I'm thinking long an hard about automated testing. Unit test are easy (either testing ViewModel in C#, or Vue.js components with a JS test runner using mocks of vm.cjson).

But, what I really need is automated "acceptance" testing where I simulate user interactions on the "full stack". So I was looking into launching the full Neutronium app with npm run dev serving up the JS. I was able to get it to work by replacing the following options in webpack.config.js:

  //webpackOptions.entry= './src/main.js'; // dev mode entry
  
  //testing live dev START
  webpackOptions.entry= './src/entry.js';
  webpackOptions.externals={
     'vue' : 'Vue',
     'vueHelper' : 'glueHelper'
  }
  //testing live dev FINISH

and replacing the Uri in MainWindow.xaml:

<!--<WPF:HTMLViewControl x:Name="HtmlView" IsDebug="True" Uri="pack://application:,,,/View/Main/dist/index.html" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>-->
<WPF:HTMLViewControl x:Name="HtmlView" IsDebug="True" Uri="http://localhost:9000/index.html" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>

The only problem is that when JavaScript code is updated, the browser window contents are reloaded, and I get an error that Vue is not defined...

Two Questions/Requests:

1. Is there some way for you to listen for the re-load event and re-inject the ViewModel IPC stuff into the browser window instance (I'm assuming it's the externals you point to in the above webpack config)?
2. Is there a way to programatically trigger the saving of vm.cjson data so I can have some testing functions prepare vm mocks of specific situations?

What do you think of this approach? I think it would be a better debugging and testing experience since you wouldn't have to wait for npm run build to run a Neutronium App in debug mode, and we could use test runners like Karma to launch our "custom" (Neutronium) browser window and do fully automated acceptance testing.

... I'm also open to alternatives you may have tried.

Best,
Michael

[David-Desmaisons]

@fizxmike , first I am glad you have been abble to prototype an application with Neutronium. I will be great if you can share information about it once it is finalized.

Thanks for your suggestion about Neutronium tests/debugs: tooling is an import part of neutronium.

1. I can image a new debug mode for neutronium where the C# application will use locally served files as you suggest. I think this may be a very interesting solution where it could be possible to use web-pack hot-reload with a live C# application. I will investigate this possibility as there are many chalenges regarding how to "re-bind" viewModel on javascript changes and how to incorporate this mode into Neutronium archictecture. Final result may be worth the effort.

2. I can provide an API expose by HTMLWindow and HTMLViewControl that will perform export to ..cjson . Is this what you need?

[fizxmike]

My prototype is big enough now that any new feature or re-factor I do, I spend more and more time manually checking that nothing has broken. I need to get automated testing figured out very soon.

1. This would be awesome for development! I know CefSharp does NOT support on-the-fly re-binding. If ChomiumFX is the same way, then I would be totally happy with the browser window being closed then having a new window launched & re-bound to ViewModel while preserving the full URL string (I'm using vue-router and would want to stay in the same "place" in the app); this wouldn't be too bad since all the DLLs in the C# app are already loaded. If you point me to some places in the code, I might be able to help out with this feature.

2. The use case for me is JS-only unit testing which primarily relies on "mocked" data. I'd like to run C# unit tests on my ViewModel, and dump various "snap shots" of the VM into .cjson files as mocked data for subsequent JavaScript unit tests. So, if you could expose just a "VMdump" testing utility function (taking a ViewModel, and file path as parameters), that would cover a lot of my testing needs. It would be nice to avoid launching the browser window during the dump, if possible.

Of course, the "holy grail" would be automated "full stack" tests, which relies on item 1 above. The method I tried in my first post might work... it really depends on the behavior of the test runner (whether or not it triggers window.location.reload() or not). I'll let you know more when I find out.

[David-Desmaisons]

1. I guess the "holy grail" is well worth trying considering the confort and awesome user experience it will provide. I will definitivelly investigate.
   

2. Understood the need and API proposed. I can provide it as an helper method for test purpose.

[David-Desmaisons]

Provided in version 1.3.0