Hot-reload using webpack 5

.gitignore

@@ -51,3 +51,5 @@ Sample.Avalonia/Generated/
 Sample.Avalonia/node_modules/
 **/*.DS_Store
 **/*.idea
+**/RunWebpackDevServer.sh
+**/RunWebpackDevServer.bat

Directory.Build.props

@@ -4,7 +4,7 @@
     <Platforms>x64;ARM64</Platforms>
     <AssemblyVersion>2.0.0.0</AssemblyVersion>
     <FileVersion>2.0.0.0</FileVersion>
-    <Version>2.117.1</Version>
+    <Version>2.117.2</Version>
     <Authors>OutSystems</Authors>
     <Product>ReactView</Product>
     <Copyright>Copyright © OutSystems 2023</Copyright>

Directory.Packages.props

@@ -22,11 +22,11 @@
 
         <PackageVersion Include="WebViewControl-Avalonia" Version="$(WebViewVersion)" />
         <PackageVersion Include="WebViewControl-Avalonia-ARM64" Version="$(WebViewVersion)" />
-        
+
         <PackageVersion Include="WebViewControl-WPF" Version="$(WebViewVersion)" />
         <PackageVersion Include="WebViewControl-WPF-ARM64" Version="$(WebViewVersion)" />
 
-        <PackageVersion Include="ViewGenerator" Version="1.0.330" />
+        <PackageVersion Include="ViewGenerator" Version="1.1.22" />
         <PackageVersion Include="ViewGeneratorCore" Version="1.0.229" />
 
         <PackageVersion Include="NLog" Version="4.6.2" />
@@ -35,6 +35,6 @@
         <PackageVersion Include="nunit" Version="3.12.0" />
         <PackageVersion Include="NUnit3TestAdapter" Version="3.17.0" />
         <PackageVersion Include="Microsoft.NET.Test.Sdk" Version="16.6.1" />
-        
+
     </ItemGroup>
 </Project>

ReactViewControl.Avalonia/ReactViewControl.Avalonia.csproj

@@ -34,6 +34,10 @@
     <Compile Include="..\ReactViewControl\ViewModuleContainer.cs" Link="ViewModuleContainer.cs" />
     <Compile Include="..\ReactViewControl\ViewModuleExtensions.cs" Link="ViewModuleExtensions.cs" />
     <Compile Include="..\ReactViewControl\StringExtensions.cs" Link="StringExtensions.cs" />
+    <Compile Include="..\ReactViewControl\IModuleDependenciesProviderFactory.cs" Link="IModuleDependenciesProviderFactory.cs" />
+    <Compile Include="..\ReactViewControl\ModuleDependenciesProviderFactory.cs" Link="ModuleDependenciesProviderFactory.cs" />
+    <Compile Include="..\ReactViewControl\IModuleDependenciesProvider.cs" Link="IModuleDependenciesProvider.cs" />
+    <Compile Include="..\ReactViewControl\FileDependenciesProvider.cs" Link="FileDependenciesProvider.cs" />
   </ItemGroup>
 
   <ItemGroup>

ReactViewControl/FileDependenciesProvider.cs

@@ -0,0 +1,47 @@
+using System;
+using System.IO;
+using System.Linq;
+using WebViewControl;
+
+namespace ReactViewControl {
+    internal class FileDependenciesProvider : IModuleDependenciesProvider {
+
+        private const string JsEntryFileExtension = ".js.entry";
+        private const string CssEntryFileExtension = ".css.entry";
+
+        private readonly string sourcePath;
+
+        public FileDependenciesProvider(string sourcePath) {
+            this.sourcePath = sourcePath;
+
+            DependencyJsSourcesCache = new Lazy<string[]>(() => GetDependenciesFromEntriesFile(JsEntryFileExtension));
+            CssSourcesCache = new Lazy<string[]>(() => GetDependenciesFromEntriesFile(CssEntryFileExtension));
+        }
+
+        public string[] GetCssDependencies() => CssSourcesCache.Value;
+
+        public string[] GetJsDependencies() => DependencyJsSourcesCache.Value;
+
+        private Lazy<string[]> DependencyJsSourcesCache { get; }
+        private Lazy<string[]> CssSourcesCache { get; }
+
+        private string[] GetDependenciesFromEntriesFile(string extension) {
+            var entriesFilePath = Path.Combine(Path.GetDirectoryName(sourcePath), Path.GetFileNameWithoutExtension(sourcePath) + extension);
+            var resource = entriesFilePath.Split(new[] { Path.DirectorySeparatorChar }, StringSplitOptions.RemoveEmptyEntries);
+
+            using (var stream = GetResourceStream(resource)) {
+                if (stream != null) {
+                    using (var reader = new StreamReader(stream)) {
+                        var allEntries = reader.ReadToEnd();
+                        if (!string.IsNullOrEmpty(allEntries)) {
+                            return allEntries.Split(new[] { Environment.NewLine }, StringSplitOptions.RemoveEmptyEntries);
+                        }
+                    }
+                }
+            }
+            return Array.Empty<string>();
+        }
+
+        private Stream GetResourceStream(string[] resource) => ResourcesManager.TryGetResourceWithFullPath(resource.First(), resource);
+    }
+}

ReactViewControl/IChildViewHost.cs

@@ -8,7 +8,5 @@ public interface IChildViewHost {
         bool AddChildView(IViewModule childView, string frameName);
 
         ReactView Host { get; }
-
-        bool IsHotReloadEnabled { get; }
     }
 }

ReactViewControl/IModuleDependenciesProvider.cs

@@ -0,0 +1,7 @@
+namespace ReactViewControl {
+    public interface IModuleDependenciesProvider {
+        string[] GetCssDependencies();
+
+        string[] GetJsDependencies();
+    }
+}

ReactViewControl/IModuleDependenciesProviderFactory.cs

@@ -0,0 +1,6 @@
+namespace ReactViewControl; 
+
+public interface IModuleDependenciesProviderFactory {
+
+    IModuleDependenciesProvider CreateModuleDependenciesProvider(string sourcePath);
+}

ReactViewControl/IViewModule.cs

@@ -1,5 +1,4 @@
-using System;
-using System.Collections.Generic;
+using System.Collections.Generic;
 
 namespace ReactViewControl {
 
@@ -37,4 +36,4 @@ public interface IViewModule {
 
         ReactView Host { get; }
     }
-}
+}

ReactViewControl/ModuleDependenciesProviderFactory.cs

@@ -0,0 +1,14 @@
+namespace ReactViewControl; 
+
+public class ModuleDependenciesProviderFactory : IModuleDependenciesProviderFactory {
+
+    public static IModuleDependenciesProviderFactory Instance { get; private set; } = new ModuleDependenciesProviderFactory();
+
+    public static void SetInstance(IModuleDependenciesProviderFactory factory) {
+        Instance = factory;
+    }
+
+    public virtual IModuleDependenciesProvider CreateModuleDependenciesProvider(string sourcePath) {
+        return new FileDependenciesProvider(sourcePath);
+    }
+}

ReactViewControl/ReactView.cs

@@ -19,7 +19,7 @@ public abstract partial class ReactView : IDisposable {
 
         private static ReactViewRender CreateReactViewInstance(ReactViewFactory factory) {
             ReactViewRender InnerCreateView() {
-                var view = new ReactViewRender(factory.DefaultStyleSheet, () => factory.InitializePlugins(), factory.EnableViewPreload, factory.EnableDebugMode, factory.DevServerURI);
+                var view = new ReactViewRender(factory.DefaultStyleSheet, () => factory.InitializePlugins(), factory.EnableViewPreload, factory.EnableDebugMode);
                 if (factory.ShowDeveloperTools) {
                     view.ShowDeveloperTools();
                 }
@@ -118,8 +118,8 @@ public T WithPlugin<T>() {
         }
 
         /// <summary>
-        /// Enables or disables debug mode. 
-        /// In debug mode the webview developer tools becomes available pressing F12 and the webview shows an error message at the top with the error details 
+        /// Enables or disables debug mode.
+        /// In debug mode the webview developer tools becomes available pressing F12 and the webview shows an error message at the top with the error details
         /// when a resource fails to load.
         /// </summary>
         public bool EnableDebugMode { get => View.EnableDebugMode; set => View.EnableDebugMode = value; }
@@ -176,7 +176,7 @@ public event CustomResourceRequestedEventHandler CustomResourceRequested {
         }
 
         /// <summary>
-        /// Handle external resource requests. 
+        /// Handle external resource requests.
         /// Call <see cref="ResourceHandler.BeginAsyncResponse"/> to handle the request in an async way.
         /// </summary>
         public event ResourceRequestedEventHandler ExternalResourceRequested {
@@ -222,7 +222,7 @@ public void CloseDeveloperTools() {
         /// <summary>
         /// Number of preloaded views that are mantained in cache for each view.
         /// Components with different property values are stored in different cache entries.
-        /// Defaults to 6. 
+        /// Defaults to 6.
         /// </summary>
         public static int PreloadedCacheEntriesSize { get; set; } = 6;
 

ReactViewControl/ReactViewFactory.cs

@@ -30,10 +30,5 @@ public class ReactViewFactory {
         /// The view is cached and preloaded. First render occurs earlier.
         /// </summary>
         public virtual bool EnableViewPreload => true;
-
-        /// <summary>
-        /// Webpack dev server url. Setting this value will enable hot reload. eg: new Uri("http://localhost:8080")
-        /// </summary>
-        public virtual Uri DevServerURI => null;
     }
-}
+}

ReactViewControl/ReactViewRender.cs

@@ -7,7 +7,7 @@
 using System.Runtime.CompilerServices;
 using System.Threading.Tasks;
 using WebViewControl;
-using Xilium.CefGlue;
+using Xilium.CefGlue;
 
 namespace ReactViewControl {
 
@@ -36,7 +36,7 @@ internal partial class ReactViewRender : IChildViewHost, IDisposable {
         private ResourceUrl defaultStyleSheet;
         private bool isInputDisabled; // used primarly to control the intention to disable input (before the browser is ready)
 
-        public ReactViewRender(ResourceUrl defaultStyleSheet, Func<IViewModule[]> initializePlugins, bool preloadWebView, bool enableDebugMode, Uri devServerUri = null) {
+        public ReactViewRender(ResourceUrl defaultStyleSheet, Func<IViewModule[]> initializePlugins, bool preloadWebView, bool enableDebugMode) {
             UserCallingAssembly = GetUserCallingMethod().ReflectedType.Assembly;
 
             // must useSharedDomain for the local storage to be shared
@@ -53,7 +53,6 @@ public ReactViewRender(ResourceUrl defaultStyleSheet, Func<IViewModule[]> initia
             DefaultStyleSheet = defaultStyleSheet;
             PluginsFactory = initializePlugins;
             EnableDebugMode = enableDebugMode;
-            DevServerUri = devServerUri;
 
             GetOrCreateFrame(FrameInfo.MainViewFrameName); // creates the main frame
 
@@ -90,11 +89,6 @@ public ReactViewRender(ResourceUrl defaultStyleSheet, Func<IViewModule[]> initia
 
         public ReactView Host { get; set; }
 
-        /// <summary>
-        /// True when hot reload is enabled.
-        /// </summary>
-        public bool IsHotReloadEnabled => DevServerUri != null;
-
         public bool IsDisposing => WebView.IsDisposing;
 
         /// <summary>
@@ -108,8 +102,8 @@ public ReactViewRender(ResourceUrl defaultStyleSheet, Func<IViewModule[]> initia
         public bool IsMainComponentLoaded => Frames.TryGetValue(FrameInfo.MainViewFrameName, out var frame) && frame.LoadStatus >= LoadStatus.ComponentLoading;
 
         /// <summary>
-        /// Enables or disables debug mode. 
-        /// In debug mode the webview developer tools becomes available pressing F12 and the webview shows an error message at the top with the error details 
+        /// Enables or disables debug mode.
+        /// In debug mode the webview developer tools becomes available pressing F12 and the webview shows an error message at the top with the error details
         /// when a resource fails to load.
         /// </summary>
         public bool EnableDebugMode {
@@ -125,11 +119,6 @@ public bool EnableDebugMode {
             }
         }
 
-        /// <summary>
-        /// Gets webpack dev server url.
-        /// </summary>
-        public Uri DevServerUri { get; }
-
         /// <summary>
         /// Gets or sets the webview zoom percentage (1 = 100%)
         /// </summary>
@@ -165,7 +154,7 @@ public event ResourceLoadFailedEventHandler ResourceLoadFailed {
         public event ResourceRequestedEventHandler EmbeddedResourceRequested;
 
         /// <summary>
-        /// Handle external resource requests. 
+        /// Handle external resource requests.
         /// Call <see cref="ResourceHandler.BeginAsyncResponse"/> to handle the request in an async way.
         /// </summary>
         public event ResourceRequestedEventHandler ExternalResourceRequested;
@@ -370,7 +359,7 @@ public void RemoveCustomResourceRequestedHandler(string frameName, CustomResourc
         }
 
         /// <summary>
-        /// Gets the view loaded on the specified frame. If none it will create a view of the specified 
+        /// Gets the view loaded on the specified frame. If none it will create a view of the specified
         /// instance and bind it to the frame.
         /// </summary>
         /// <param name="frameName"></param>
@@ -407,7 +396,7 @@ public bool AddChildView(IViewModule childView, string frameName) {
         }
 
         /// <summary>
-        /// Binds the coponent to the specified frame.
+        /// Binds the component to the specified frame.
         /// </summary>
         /// <param name="component"></param>
         /// <param name="frame"></param>
@@ -550,18 +539,16 @@ private void UnregisterNativeObject(IViewModule module, FrameInfo frame) {
         /// </summary>
         /// <param name="url"></param>
         /// <returns></returns>
-        private string ToFullUrl(string url) {
+        private string ToFullUrl(string url) {
             if (url.OrdinalContains(Uri.SchemeDelimiter)) {
                 return url;
-            } else if (url.OrdinalStartsWith(ResourceUrl.PathSeparator)) {
-                if (IsHotReloadEnabled) {
-                    return new Uri(DevServerUri, url).ToString();
-                } else {
-                    return new ResourceUrl(ResourceUrl.EmbeddedScheme, url).ToString();
-                }
-            } else {
-                return new ResourceUrl(UserCallingAssembly, url).ToString();
             }
+
+            if (url.OrdinalStartsWith(ResourceUrl.PathSeparator)) {
+                return new ResourceUrl(ResourceUrl.EmbeddedScheme, url).ToString();
+            }
+
+            return new ResourceUrl(UserCallingAssembly, url).ToString();
         }
 
         /// <summary>