Hot reload: handle template files located in subdirectories

Author: Tarmil

src/Bolero.Server/Templating.fs

@@ -69,9 +69,11 @@ module Impl =
             match config.dir with
             | Some dir -> Path.Combine(env.ContentRootPath, dir)
             | None -> env.ContentRootPath
+            |> Path.Canonicalize
 
         let fullPathOf filename =
             Path.Combine(dir, filename)
+            |> Path.Canonicalize
 
         let getFileContent fullPath =
             asyncRetry 3 <| async {
@@ -83,7 +85,7 @@ module Impl =
 
         let onchange (fullPath: string) =
             async {
-                let filename = Path.GetFileName(fullPath) // TODO: what if it's in a subdirectory?
+                let filename = Path.GetRelativePath dir fullPath
                 match! getFileContent fullPath with
                 | None ->
                     log.LogWarning("Bolero HotReload: failed to reload {0}", fullPath)
@@ -106,7 +108,10 @@ module Impl =
             getFileContent fullPath
 
         member this.Start() =
-            let fsw = new FileSystemWatcher(dir, "*.html", EnableRaisingEvents = true)
+            let fsw =
+                new FileSystemWatcher(dir, "*.html",
+                    IncludeSubdirectories = true,
+                    EnableRaisingEvents = true)
             fsw.Created.Add(callback)
             fsw.Changed.Add(callback)
             fsw.Renamed.Add(callback)

src/Bolero.Templating.Provider/Bolero.Templating.Provider.fsproj

@@ -17,6 +17,8 @@
     <Compile Include="..\Bolero\TemplatingInternals.fs"
              Link="TemplatingInternals.fs" />
     <Compile Include="Utilities.fs" />
+    <Compile Include="..\Bolero.Templating\Path.fs"
+             Link="Path.fs" />
     <Compile Include="..\Bolero.Templating\Parsing.fs"
              Link="Parsing.fs" />
     <Compile Include="ConvertExpr.fs" />

src/Bolero.Templating/Bolero.Templating.fsproj

@@ -8,6 +8,7 @@
   </PropertyGroup>
   <ItemGroup>
     <Compile Include="..\..\build\AssemblyInfo.fs" />
+    <Compile Include="Path.fs" />
     <Compile Include="Parsing.fs" />
     <Compile Include="Settings.fs" />
     <Compile Include="ConvertNode.fs" />

src/Bolero.Templating/Client.fs

@@ -142,6 +142,8 @@ module Program =
         { program with
             init = fun comp ->
                 let client =
+                    // In server mode, the IClient service is set by services.AddHotReload().
+                    // In client mode, it is not set, so we create it here.
                     match comp.Services.GetService<IClient>() with
                     | null -> registerClient comp
                     | client -> client

src/Bolero.Templating/Parsing.fs

@@ -370,8 +370,10 @@ let GetDoc (fileOrContent: string) (rootFolder: string) : option<string> * HtmlD
         doc.LoadHtml(fileOrContent)
         None, doc
     else
-        doc.Load(Path.Combine(rootFolder, fileOrContent))
-        Some fileOrContent, doc
+        let rootFolder = Path.Canonicalize rootFolder
+        let fullPath = Path.Combine(rootFolder, fileOrContent) |> Path.Canonicalize
+        doc.Load(fullPath)
+        Some (Path.GetRelativePath rootFolder fullPath), doc
 
 /// Parse a type provider argument into a set of templates.
 let ParseFileOrContent (fileOrContent: string) (rootFolder: string) : ParsedTemplates =

src/Bolero.Templating/Path.fs

@@ -0,0 +1,41 @@
+// $begin{copyright}
+//
+// This file is part of Bolero
+//
+// Copyright (c) 2018 IntelliFactory and contributors
+//
+// Licensed under the Apache License, Version 2.0 (the "License"); you
+// may not use this file except in compliance with the License.  You may
+// obtain a copy of the License at
+//
+//     http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+// implied.  See the License for the specific language governing
+// permissions and limitations under the License.
+//
+// $end{copyright}
+
+module Bolero.Templating.Path
+
+open System.IO
+
+/// Canonicalize a path: remove . and .. components, unify slashes.
+let Canonicalize (path: string) =
+    FileInfo(path).FullName
+
+/// Given a base directory and a full path, return the corresponding relative path.
+/// eg: if baseDir = "c:/foo" and fullPath = "c:/foo/bar/baz.html", then return "bar/baz.html".
+/// Assumes that both fullPath and baseDir are canonical (see Canonicalize above).
+/// Fails if fullPath is not a subdirectory of baseDir.
+let GetRelativePath (baseDir: string) (fullPath: string) =
+    let rec go (thisDir: string) =
+        if thisDir = baseDir then
+            fullPath.[thisDir.Length + 1..]
+        elif thisDir.Length <= baseDir.Length then
+            invalidArg "fullPath" (sprintf "'%s' is not a subdirectory of '%s'" fullPath baseDir)
+        else
+            go (Path.GetDirectoryName thisDir)
+    go fullPath

tests/Remoting.Client/Main.fs

@@ -86,6 +86,7 @@ let Update (myApi: MyApi) msg model =
         { model with lastError = Some exn }, []
 
 type Tpl = Template<"main.html">
+type Form = Template<"subdir/form.html">
 
 type Item() =
     inherit ElmishComponent<KeyValuePair<int, string>, Message>()
@@ -96,12 +97,16 @@ type Item() =
             .Elt()
 
 let Display model dispatch =
+    let form =
+        Form()
+            .key(string model.currentKey)
+            .setKey(fun e -> dispatch (SetCurrentKey (int (e.Value :?> string))))
+            .value(string model.currentValue)
+            .setValue(fun e -> dispatch (SetCurrentValue (e.Value :?> string)))
+            .add(fun _ -> dispatch AddItem)
+            .Elt()
     Tpl()
-        .key(string model.currentKey)
-        .setKey(fun e -> dispatch (SetCurrentKey (int (e.Value :?> string))))
-        .value(string model.currentValue)
-        .setValue(fun e -> dispatch (SetCurrentValue (e.Value :?> string)))
-        .add(fun _ -> dispatch AddItem)
+        .form(form)
         .refresh(fun _ -> dispatch RefreshItems)
         .items(concat [for item in model.items -> ecomp<Item, _, _> item dispatch])
         .error(

tests/Remoting.Client/main.html

@@ -1,11 +1,5 @@
-<div>
-  <input type="number" placeholder="Key" value="${key}" onchange="${setKey}">
-  <input placeholder="Value" value="${value}" onchange="${setValue}">
-  <button onclick="${add}">Add</button>
-</div>
-<div>
-  <button onclick="${refresh}">Refresh</button>
-</div>
+<div>${form}</div>
+<div><button onclick="${refresh}">Refresh</button></div>
 <ul>
   ${items}
   <template id="item">

tests/Remoting.Client/subdir/form.html

@@ -0,0 +1,3 @@
+<input type="number" placeholder="Key" value="${key}" onchange="${setKey}">
+<input placeholder="Value" value="${value}" onchange="${setValue}">
+<button onclick="${add}">Add it</button>