7 Commits

Author SHA1 Message Date
4be5bad8ef Update package READMEs 2022-07-14 09:24:49 -04:00
a169000ce2 Update for version 1.8.0 (#6)
- Bump library version
- Bump htmx script version
- Add hx-replace-url / HX-Replace-Url
- Add hx-select-oob
- Change hx-push-url to accept a string
- Add HX-Push-Url, obsolete HX-Push
- Implement HX-Reswap header
- Rework project structure to add common project
2022-07-14 09:13:52 -04:00
c587a28770 Update for htmx 1.7.0 (#4)
Fixes #3
2022-02-23 21:54:51 -05:00
b5292bffc4 HTMX -> htmx 2022-01-07 16:02:01 -05:00
86defea3c1 Add scripts to README
Also prep for release
2022-01-06 21:31:36 -05:00
9a9f159cab Add script functions
Also bump version to match htmx
2022-01-04 12:54:36 -05:00
9fcba06e75 Add HX-Retarget header (#2) 2021-11-26 12:49:48 -05:00
18 changed files with 1232 additions and 899 deletions

View File

@@ -63,6 +63,8 @@ Some attributes have known values, such as `hx-trigger` and `hx-swap`; for these
] ]
``` ```
If you want to load htmx from unpkg, `Htmx.Script.minified` or `Htmx.Script.unminified` can be used to load the script in your HTML trees.
## Feedback / Help ## Feedback / Help
The author hangs out in the #htmx-general channel of the [htmx Discord server](https://htmx.org/discord) and the #web channel of the [F# Software Foundation's Slack server](https://fsharp.org/guides/slack/). The author hangs out in the #htmx-general channel of the [htmx Discord server](https://htmx.org/discord) and the #web channel of the [F# Software Foundation's Slack server](https://fsharp.org/guides/slack/).

View File

@@ -0,0 +1,30 @@
<Project Sdk="Microsoft.NET.Sdk">
<PropertyGroup>
<IsPackable>false</IsPackable>
<GenerateProgramFile>false</GenerateProgramFile>
</PropertyGroup>
<ItemGroup>
<Compile Include="Tests.fs" />
<Compile Include="Program.fs" />
</ItemGroup>
<ItemGroup>
<PackageReference Include="Microsoft.NET.Test.Sdk" Version="16.11.0" />
<PackageReference Include="xunit" Version="2.4.1" />
<PackageReference Include="xunit.runner.visualstudio" Version="2.4.3">
<IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
<PrivateAssets>all</PrivateAssets>
</PackageReference>
<PackageReference Include="coverlet.collector" Version="3.1.0">
<IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
<PrivateAssets>all</PrivateAssets>
</PackageReference>
</ItemGroup>
<ItemGroup>
<ProjectReference Include="..\Common\Giraffe.Htmx.Common.fsproj" />
</ItemGroup>
</Project>

View File

@@ -0,0 +1 @@
module Program = let [<EntryPoint>] main _ = 0

35
src/Common.Tests/Tests.fs Normal file
View File

@@ -0,0 +1,35 @@
module Tests
open Giraffe.Htmx
open Xunit
/// Tests for the HxSwap module
module Swap =
[<Fact>]
let ``InnerHtml is correct`` () =
Assert.Equal ("innerHTML", HxSwap.InnerHtml)
[<Fact>]
let ``OuterHtml is correct`` () =
Assert.Equal ("outerHTML", HxSwap.OuterHtml)
[<Fact>]
let ``BeforeBegin is correct`` () =
Assert.Equal ("beforebegin", HxSwap.BeforeBegin)
[<Fact>]
let ``BeforeEnd is correct`` () =
Assert.Equal ("beforeend", HxSwap.BeforeEnd)
[<Fact>]
let ``AfterBegin is correct`` () =
Assert.Equal ("afterbegin", HxSwap.AfterBegin)
[<Fact>]
let ``AfterEnd is correct`` () =
Assert.Equal ("afterend", HxSwap.AfterEnd)
[<Fact>]
let ``None is correct`` () =
Assert.Equal ("none", HxSwap.None)

28
src/Common/Common.fs Normal file
View File

@@ -0,0 +1,28 @@
/// Common definitions shared between attribute values and response headers
[<AutoOpen>]
module Giraffe.Htmx.Common
/// Valid values for the `hx-swap` attribute / `HX-Reswap` header (may be combined with swap/settle/scroll/show config)
[<RequireQualifiedAccess>]
module HxSwap =
/// The default, replace the inner html of the target element
let InnerHtml = "innerHTML"
/// Replace the entire target element with the response
let OuterHtml = "outerHTML"
/// Insert the response before the target element
let BeforeBegin = "beforebegin"
/// Insert the response before the first child of the target element
let AfterBegin = "afterbegin"
/// Insert the response after the last child of the target element
let BeforeEnd = "beforeend"
/// Insert the response after the target element
let AfterEnd = "afterend"
/// Does not append content from response (out of band items will still be processed).
let None = "none"

View File

@@ -0,0 +1,11 @@
<Project Sdk="Microsoft.NET.Sdk">
<PropertyGroup>
<GenerateDocumentationFile>true</GenerateDocumentationFile>
</PropertyGroup>
<ItemGroup>
<Compile Include="Common.fs" />
</ItemGroup>
</Project>

View File

@@ -1,8 +1,9 @@
<?xml version="1.0" encoding="utf-8" standalone="no"?> <?xml version="1.0" encoding="utf-8" standalone="no"?>
<Project ToolsVersion="15.0" xmlns="http://schemas.microsoft.com/developer/msbuild/2003"> <Project ToolsVersion="15.0" xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
<PropertyGroup> <PropertyGroup>
<VersionPrefix>0.9.2</VersionPrefix> <TargetFramework>net6.0</TargetFramework>
<PackageReleaseNotes>Complete view engine modules; add READMEs</PackageReleaseNotes> <VersionPrefix>1.8.0</VersionPrefix>
<PackageReleaseNotes>Support new attributes/headers in htmx 1.8.0</PackageReleaseNotes>
<Authors>danieljsummers</Authors> <Authors>danieljsummers</Authors>
<Company>Bit Badger Solutions</Company> <Company>Bit Badger Solutions</Company>
<PackageProjectUrl>https://github.com/bit-badger/Giraffe.Htmx</PackageProjectUrl> <PackageProjectUrl>https://github.com/bit-badger/Giraffe.Htmx</PackageProjectUrl>

52
src/Giraffe.Htmx.sln Normal file
View File

@@ -0,0 +1,52 @@

Microsoft Visual Studio Solution File, Format Version 12.00
# Visual Studio Version 16
VisualStudioVersion = 16.0.30114.105
MinimumVisualStudioVersion = 10.0.40219.1
Project("{F2A71F9B-5D33-465A-A702-920D77279786}") = "Giraffe.Htmx", "Htmx\Giraffe.Htmx.fsproj", "{8AB3085C-5236-485A-8565-A09106E72E1E}"
EndProject
Project("{F2A71F9B-5D33-465A-A702-920D77279786}") = "Giraffe.Htmx.Tests", "Htmx.Tests\Giraffe.Htmx.Tests.fsproj", "{D7CDD578-7A6F-4EF6-846A-80A55037E049}"
EndProject
Project("{F2A71F9B-5D33-465A-A702-920D77279786}") = "Giraffe.ViewEngine.Htmx", "ViewEngine.Htmx\Giraffe.ViewEngine.Htmx.fsproj", "{F718B3C1-EE01-4F04-ABCE-BF2AE700FDA9}"
EndProject
Project("{F2A71F9B-5D33-465A-A702-920D77279786}") = "Giraffe.ViewEngine.Htmx.Tests", "ViewEngine.Htmx.Tests\Giraffe.ViewEngine.Htmx.Tests.fsproj", "{F21C28CE-1F18-4CB0-B2F7-10DABE84FB78}"
EndProject
Project("{F2A71F9B-5D33-465A-A702-920D77279786}") = "Giraffe.Htmx.Common", "Common\Giraffe.Htmx.Common.fsproj", "{75D66845-F93A-4463-AD29-A8B16E4D4BA9}"
EndProject
Project("{F2A71F9B-5D33-465A-A702-920D77279786}") = "Giraffe.Htmx.Common.Tests", "Common.Tests\Giraffe.Htmx.Common.Tests.fsproj", "{E261A653-68D5-4D7B-99A4-F09282B50F8A}"
EndProject
Global
GlobalSection(SolutionConfigurationPlatforms) = preSolution
Debug|Any CPU = Debug|Any CPU
Release|Any CPU = Release|Any CPU
EndGlobalSection
GlobalSection(SolutionProperties) = preSolution
HideSolutionNode = FALSE
EndGlobalSection
GlobalSection(ProjectConfigurationPlatforms) = postSolution
{8AB3085C-5236-485A-8565-A09106E72E1E}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
{8AB3085C-5236-485A-8565-A09106E72E1E}.Debug|Any CPU.Build.0 = Debug|Any CPU
{8AB3085C-5236-485A-8565-A09106E72E1E}.Release|Any CPU.ActiveCfg = Release|Any CPU
{8AB3085C-5236-485A-8565-A09106E72E1E}.Release|Any CPU.Build.0 = Release|Any CPU
{D7CDD578-7A6F-4EF6-846A-80A55037E049}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
{D7CDD578-7A6F-4EF6-846A-80A55037E049}.Debug|Any CPU.Build.0 = Debug|Any CPU
{D7CDD578-7A6F-4EF6-846A-80A55037E049}.Release|Any CPU.ActiveCfg = Release|Any CPU
{D7CDD578-7A6F-4EF6-846A-80A55037E049}.Release|Any CPU.Build.0 = Release|Any CPU
{F718B3C1-EE01-4F04-ABCE-BF2AE700FDA9}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
{F718B3C1-EE01-4F04-ABCE-BF2AE700FDA9}.Debug|Any CPU.Build.0 = Debug|Any CPU
{F718B3C1-EE01-4F04-ABCE-BF2AE700FDA9}.Release|Any CPU.ActiveCfg = Release|Any CPU
{F718B3C1-EE01-4F04-ABCE-BF2AE700FDA9}.Release|Any CPU.Build.0 = Release|Any CPU
{F21C28CE-1F18-4CB0-B2F7-10DABE84FB78}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
{F21C28CE-1F18-4CB0-B2F7-10DABE84FB78}.Debug|Any CPU.Build.0 = Debug|Any CPU
{F21C28CE-1F18-4CB0-B2F7-10DABE84FB78}.Release|Any CPU.ActiveCfg = Release|Any CPU
{F21C28CE-1F18-4CB0-B2F7-10DABE84FB78}.Release|Any CPU.Build.0 = Release|Any CPU
{75D66845-F93A-4463-AD29-A8B16E4D4BA9}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
{75D66845-F93A-4463-AD29-A8B16E4D4BA9}.Debug|Any CPU.Build.0 = Debug|Any CPU
{75D66845-F93A-4463-AD29-A8B16E4D4BA9}.Release|Any CPU.ActiveCfg = Release|Any CPU
{75D66845-F93A-4463-AD29-A8B16E4D4BA9}.Release|Any CPU.Build.0 = Release|Any CPU
{E261A653-68D5-4D7B-99A4-F09282B50F8A}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
{E261A653-68D5-4D7B-99A4-F09282B50F8A}.Debug|Any CPU.Build.0 = Debug|Any CPU
{E261A653-68D5-4D7B-99A4-F09282B50F8A}.Release|Any CPU.ActiveCfg = Release|Any CPU
{E261A653-68D5-4D7B-99A4-F09282B50F8A}.Release|Any CPU.Build.0 = Release|Any CPU
EndGlobalSection
EndGlobal

View File

@@ -1,8 +1,6 @@
<Project Sdk="Microsoft.NET.Sdk"> <Project Sdk="Microsoft.NET.Sdk">
<PropertyGroup> <PropertyGroup>
<TargetFramework>net6.0</TargetFramework>
<IsPackable>false</IsPackable> <IsPackable>false</IsPackable>
<GenerateProgramFile>false</GenerateProgramFile> <GenerateProgramFile>false</GenerateProgramFile>
</PropertyGroup> </PropertyGroup>

View File

@@ -9,310 +9,364 @@ open Xunit
/// Tests for the IHeaderDictionary extension properties /// Tests for the IHeaderDictionary extension properties
module IHeaderDictionaryExtensions = module IHeaderDictionaryExtensions =
[<Fact>] [<Fact>]
let ``HxBoosted succeeds when the header is not present`` () = let ``HxBoosted succeeds when the header is not present`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
ctx.Request.Headers.ReturnsForAnyArgs (HeaderDictionary ()) |> ignore ctx.Request.Headers.ReturnsForAnyArgs (HeaderDictionary ()) |> ignore
Option.isNone ctx.Request.Headers.HxBoosted |> Assert.True Option.isNone ctx.Request.Headers.HxBoosted |> Assert.True
[<Fact>] [<Fact>]
let ``HxBoosted succeeds when the header is present and true`` () = let ``HxBoosted succeeds when the header is present and true`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary () let dic = HeaderDictionary ()
dic.Add ("HX-Boosted", "true") dic.Add ("HX-Boosted", "true")
ctx.Request.Headers.ReturnsForAnyArgs dic |> ignore ctx.Request.Headers.ReturnsForAnyArgs dic |> ignore
Option.isSome ctx.Request.Headers.HxBoosted |> Assert.True Option.isSome ctx.Request.Headers.HxBoosted |> Assert.True
Option.get ctx.Request.Headers.HxBoosted |> Assert.True Option.get ctx.Request.Headers.HxBoosted |> Assert.True
[<Fact>] [<Fact>]
let ``HxBoosted succeeds when the header is present and false`` () = let ``HxBoosted succeeds when the header is present and false`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary () let dic = HeaderDictionary ()
dic.Add ("HX-Boosted", "false") dic.Add ("HX-Boosted", "false")
ctx.Request.Headers.ReturnsForAnyArgs dic |> ignore ctx.Request.Headers.ReturnsForAnyArgs dic |> ignore
Option.isSome ctx.Request.Headers.HxBoosted |> Assert.True Option.isSome ctx.Request.Headers.HxBoosted |> Assert.True
Option.get ctx.Request.Headers.HxBoosted |> Assert.False Option.get ctx.Request.Headers.HxBoosted |> Assert.False
[<Fact>] [<Fact>]
let ``HxCurrentUrl succeeds when the header is not present`` () = let ``HxCurrentUrl succeeds when the header is not present`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
ctx.Request.Headers.ReturnsForAnyArgs (HeaderDictionary ()) |> ignore ctx.Request.Headers.ReturnsForAnyArgs (HeaderDictionary ()) |> ignore
Option.isNone ctx.Request.Headers.HxCurrentUrl |> Assert.True Option.isNone ctx.Request.Headers.HxCurrentUrl |> Assert.True
[<Fact>] [<Fact>]
let ``HxCurrentUrl succeeds when the header is present`` () = let ``HxCurrentUrl succeeds when the header is present`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary () let dic = HeaderDictionary ()
dic.Add ("HX-Current-URL", "http://localhost/test.htm") dic.Add ("HX-Current-URL", "http://localhost/test.htm")
ctx.Request.Headers.ReturnsForAnyArgs dic |> ignore ctx.Request.Headers.ReturnsForAnyArgs dic |> ignore
Option.isSome ctx.Request.Headers.HxCurrentUrl |> Assert.True Option.isSome ctx.Request.Headers.HxCurrentUrl |> Assert.True
Assert.Equal (Uri "http://localhost/test.htm", Option.get ctx.Request.Headers.HxCurrentUrl) Assert.Equal (Uri "http://localhost/test.htm", Option.get ctx.Request.Headers.HxCurrentUrl)
[<Fact>] [<Fact>]
let ``HxHistoryRestoreRequest succeeds when the header is not present`` () = let ``HxHistoryRestoreRequest succeeds when the header is not present`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
ctx.Request.Headers.ReturnsForAnyArgs (HeaderDictionary ()) |> ignore ctx.Request.Headers.ReturnsForAnyArgs (HeaderDictionary ()) |> ignore
Option.isNone ctx.Request.Headers.HxHistoryRestoreRequest |> Assert.True Option.isNone ctx.Request.Headers.HxHistoryRestoreRequest |> Assert.True
[<Fact>] [<Fact>]
let ``HxHistoryRestoreRequest succeeds when the header is present and true`` () = let ``HxHistoryRestoreRequest succeeds when the header is present and true`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary () let dic = HeaderDictionary ()
dic.Add ("HX-History-Restore-Request", "true") dic.Add ("HX-History-Restore-Request", "true")
ctx.Request.Headers.ReturnsForAnyArgs dic |> ignore ctx.Request.Headers.ReturnsForAnyArgs dic |> ignore
Option.isSome ctx.Request.Headers.HxHistoryRestoreRequest |> Assert.True Option.isSome ctx.Request.Headers.HxHistoryRestoreRequest |> Assert.True
Option.get ctx.Request.Headers.HxHistoryRestoreRequest |> Assert.True Option.get ctx.Request.Headers.HxHistoryRestoreRequest |> Assert.True
[<Fact>] [<Fact>]
let ``HxHistoryRestoreRequest succeeds when the header is present and false`` () = let ``HxHistoryRestoreRequest succeeds when the header is present and false`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary () let dic = HeaderDictionary ()
dic.Add ("HX-History-Restore-Request", "false") dic.Add ("HX-History-Restore-Request", "false")
ctx.Request.Headers.ReturnsForAnyArgs dic |> ignore ctx.Request.Headers.ReturnsForAnyArgs dic |> ignore
Option.isSome ctx.Request.Headers.HxHistoryRestoreRequest |> Assert.True Option.isSome ctx.Request.Headers.HxHistoryRestoreRequest |> Assert.True
Option.get ctx.Request.Headers.HxHistoryRestoreRequest |> Assert.False Option.get ctx.Request.Headers.HxHistoryRestoreRequest |> Assert.False
[<Fact>] [<Fact>]
let ``HxPrompt succeeds when the header is not present`` () = let ``HxPrompt succeeds when the header is not present`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
ctx.Request.Headers.ReturnsForAnyArgs (HeaderDictionary ()) |> ignore ctx.Request.Headers.ReturnsForAnyArgs (HeaderDictionary ()) |> ignore
Option.isNone ctx.Request.Headers.HxPrompt |> Assert.True Option.isNone ctx.Request.Headers.HxPrompt |> Assert.True
[<Fact>] [<Fact>]
let ``HxPrompt succeeds when the header is present`` () = let ``HxPrompt succeeds when the header is present`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary () let dic = HeaderDictionary ()
dic.Add ("HX-Prompt", "of course") dic.Add ("HX-Prompt", "of course")
ctx.Request.Headers.ReturnsForAnyArgs dic |> ignore ctx.Request.Headers.ReturnsForAnyArgs dic |> ignore
Option.isSome ctx.Request.Headers.HxPrompt |> Assert.True Option.isSome ctx.Request.Headers.HxPrompt |> Assert.True
Assert.Equal("of course", Option.get ctx.Request.Headers.HxPrompt) Assert.Equal("of course", Option.get ctx.Request.Headers.HxPrompt)
[<Fact>] [<Fact>]
let ``HxRequest succeeds when the header is not present`` () = let ``HxRequest succeeds when the header is not present`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
ctx.Request.Headers.ReturnsForAnyArgs (HeaderDictionary ()) |> ignore ctx.Request.Headers.ReturnsForAnyArgs (HeaderDictionary ()) |> ignore
Option.isNone ctx.Request.Headers.HxRequest |> Assert.True Option.isNone ctx.Request.Headers.HxRequest |> Assert.True
[<Fact>] [<Fact>]
let ``HxRequest succeeds when the header is present and true`` () = let ``HxRequest succeeds when the header is present and true`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary () let dic = HeaderDictionary ()
dic.Add ("HX-Request", "true") dic.Add ("HX-Request", "true")
ctx.Request.Headers.ReturnsForAnyArgs dic |> ignore ctx.Request.Headers.ReturnsForAnyArgs dic |> ignore
Option.isSome ctx.Request.Headers.HxRequest |> Assert.True Option.isSome ctx.Request.Headers.HxRequest |> Assert.True
Option.get ctx.Request.Headers.HxRequest |> Assert.True Option.get ctx.Request.Headers.HxRequest |> Assert.True
[<Fact>] [<Fact>]
let ``HxRequest succeeds when the header is present and false`` () = let ``HxRequest succeeds when the header is present and false`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary () let dic = HeaderDictionary ()
dic.Add ("HX-Request", "false") dic.Add ("HX-Request", "false")
ctx.Request.Headers.ReturnsForAnyArgs dic |> ignore ctx.Request.Headers.ReturnsForAnyArgs dic |> ignore
Option.isSome ctx.Request.Headers.HxRequest |> Assert.True Option.isSome ctx.Request.Headers.HxRequest |> Assert.True
Option.get ctx.Request.Headers.HxRequest |> Assert.False Option.get ctx.Request.Headers.HxRequest |> Assert.False
[<Fact>] [<Fact>]
let ``HxTarget succeeds when the header is not present`` () = let ``HxTarget succeeds when the header is not present`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
ctx.Request.Headers.ReturnsForAnyArgs (HeaderDictionary ()) |> ignore ctx.Request.Headers.ReturnsForAnyArgs (HeaderDictionary ()) |> ignore
Option.isNone ctx.Request.Headers.HxTarget |> Assert.True Option.isNone ctx.Request.Headers.HxTarget |> Assert.True
[<Fact>] [<Fact>]
let ``HxTarget succeeds when the header is present`` () = let ``HxTarget succeeds when the header is present`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary () let dic = HeaderDictionary ()
dic.Add ("HX-Target", "#leItem") dic.Add ("HX-Target", "#leItem")
ctx.Request.Headers.ReturnsForAnyArgs dic |> ignore ctx.Request.Headers.ReturnsForAnyArgs dic |> ignore
Option.isSome ctx.Request.Headers.HxTarget |> Assert.True Option.isSome ctx.Request.Headers.HxTarget |> Assert.True
Assert.Equal("#leItem", Option.get ctx.Request.Headers.HxTarget) Assert.Equal("#leItem", Option.get ctx.Request.Headers.HxTarget)
[<Fact>] [<Fact>]
let ``HxTrigger succeeds when the header is not present`` () = let ``HxTrigger succeeds when the header is not present`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
ctx.Request.Headers.ReturnsForAnyArgs (HeaderDictionary ()) |> ignore ctx.Request.Headers.ReturnsForAnyArgs (HeaderDictionary ()) |> ignore
Option.isNone ctx.Request.Headers.HxTrigger |> Assert.True Option.isNone ctx.Request.Headers.HxTrigger |> Assert.True
[<Fact>] [<Fact>]
let ``HxTrigger succeeds when the header is present`` () = let ``HxTrigger succeeds when the header is present`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary () let dic = HeaderDictionary ()
dic.Add ("HX-Trigger", "#trig") dic.Add ("HX-Trigger", "#trig")
ctx.Request.Headers.ReturnsForAnyArgs dic |> ignore ctx.Request.Headers.ReturnsForAnyArgs dic |> ignore
Option.isSome ctx.Request.Headers.HxTrigger |> Assert.True Option.isSome ctx.Request.Headers.HxTrigger |> Assert.True
Assert.Equal("#trig", Option.get ctx.Request.Headers.HxTrigger) Assert.Equal("#trig", Option.get ctx.Request.Headers.HxTrigger)
[<Fact>] [<Fact>]
let ``HxTriggerName succeeds when the header is not present`` () = let ``HxTriggerName succeeds when the header is not present`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
ctx.Request.Headers.ReturnsForAnyArgs (HeaderDictionary ()) |> ignore ctx.Request.Headers.ReturnsForAnyArgs (HeaderDictionary ()) |> ignore
Option.isNone ctx.Request.Headers.HxTriggerName |> Assert.True Option.isNone ctx.Request.Headers.HxTriggerName |> Assert.True
[<Fact>] [<Fact>]
let ``HxTriggerName succeeds when the header is present`` () = let ``HxTriggerName succeeds when the header is present`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary () let dic = HeaderDictionary ()
dic.Add ("HX-Trigger-Name", "click") dic.Add ("HX-Trigger-Name", "click")
ctx.Request.Headers.ReturnsForAnyArgs dic |> ignore ctx.Request.Headers.ReturnsForAnyArgs dic |> ignore
Option.isSome ctx.Request.Headers.HxTriggerName |> Assert.True Option.isSome ctx.Request.Headers.HxTriggerName |> Assert.True
Assert.Equal("click", Option.get ctx.Request.Headers.HxTriggerName) Assert.Equal("click", Option.get ctx.Request.Headers.HxTriggerName)
/// Tests for the HttpRequest extension properties /// Tests for the HttpRequest extension properties
module HttpRequestExtensions = module HttpRequestExtensions =
[<Fact>] [<Fact>]
let ``IsHtmx succeeds when request is not from htmx`` () = let ``IsHtmx succeeds when request is not from htmx`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
ctx.Request.Headers.ReturnsForAnyArgs (HeaderDictionary ()) |> ignore ctx.Request.Headers.ReturnsForAnyArgs (HeaderDictionary ()) |> ignore
Assert.False ctx.Request.IsHtmx Assert.False ctx.Request.IsHtmx
[<Fact>] [<Fact>]
let ``IsHtmx succeeds when request is from htmx`` () = let ``IsHtmx succeeds when request is from htmx`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary () let dic = HeaderDictionary ()
dic.Add ("HX-Request", "true") dic.Add ("HX-Request", "true")
ctx.Request.Headers.ReturnsForAnyArgs dic |> ignore ctx.Request.Headers.ReturnsForAnyArgs dic |> ignore
Assert.True ctx.Request.IsHtmx Assert.True ctx.Request.IsHtmx
[<Fact>] [<Fact>]
let ``IsHtmxRefresh succeeds when request is not from htmx`` () = let ``IsHtmxRefresh succeeds when request is not from htmx`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
ctx.Request.Headers.ReturnsForAnyArgs (HeaderDictionary ()) |> ignore ctx.Request.Headers.ReturnsForAnyArgs (HeaderDictionary ()) |> ignore
Assert.False ctx.Request.IsHtmxRefresh Assert.False ctx.Request.IsHtmxRefresh
[<Fact>] [<Fact>]
let ``IsHtmxRefresh succeeds when request is from htmx, but not a refresh`` () = let ``IsHtmxRefresh succeeds when request is from htmx, but not a refresh`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary () let dic = HeaderDictionary ()
dic.Add ("HX-Request", "true") dic.Add ("HX-Request", "true")
ctx.Request.Headers.ReturnsForAnyArgs dic |> ignore ctx.Request.Headers.ReturnsForAnyArgs dic |> ignore
Assert.False ctx.Request.IsHtmxRefresh Assert.False ctx.Request.IsHtmxRefresh
[<Fact>] [<Fact>]
let ``IsHtmxRefresh succeeds when request is from htmx and is a refresh`` () = let ``IsHtmxRefresh succeeds when request is from htmx and is a refresh`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary () let dic = HeaderDictionary ()
dic.Add ("HX-Request", "true") dic.Add ("HX-Request", "true")
dic.Add ("HX-History-Restore-Request", "true") dic.Add ("HX-History-Restore-Request", "true")
ctx.Request.Headers.ReturnsForAnyArgs dic |> ignore ctx.Request.Headers.ReturnsForAnyArgs dic |> ignore
Assert.True ctx.Request.IsHtmxRefresh Assert.True ctx.Request.IsHtmxRefresh
/// Tests for the HttpHandler functions provided in the Handlers module /// Tests for the HttpHandler functions provided in the Handlers module
module HandlerTests = module HandlerTests =
open System.Threading.Tasks open System.Threading.Tasks
/// Dummy "next" parameter to get the pipeline to execute/terminate /// Dummy "next" parameter to get the pipeline to execute/terminate
let next (ctx : HttpContext) = Task.FromResult (Some ctx) let next (ctx : HttpContext) = Task.FromResult (Some ctx)
[<Fact>] [<Fact>]
let ``withHxPush succeeds`` () = let ``withHxPushUrl succeeds`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary () let dic = HeaderDictionary ()
ctx.Response.Headers.ReturnsForAnyArgs dic |> ignore ctx.Response.Headers.ReturnsForAnyArgs dic |> ignore
task { task {
let! _ = withHxPush "/a-new-url" next ctx let! _ = withHxPushUrl "/a-new-url" next ctx
Assert.True (dic.ContainsKey "HX-Push") Assert.True (dic.ContainsKey "HX-Push-Url")
Assert.Equal ("/a-new-url", dic.["HX-Push"].[0]) Assert.Equal ("/a-new-url", dic["HX-Push-Url"][0])
} }
[<Fact>] [<Fact>]
let ``withHxRedirect succeeds`` () = let ``withHxNoPushUrl succeeds`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary () let dic = HeaderDictionary ()
ctx.Response.Headers.ReturnsForAnyArgs dic |> ignore ctx.Response.Headers.ReturnsForAnyArgs dic |> ignore
task { task {
let! _ = withHxRedirect "/somewhere-else" next ctx let! _ = withHxNoPushUrl next ctx
Assert.True (dic.ContainsKey "HX-Redirect") Assert.True (dic.ContainsKey "HX-Push-Url")
Assert.Equal ("/somewhere-else", dic.["HX-Redirect"].[0]) Assert.Equal ("false", dic["HX-Push-Url"][0])
} }
[<Fact>] [<Fact>]
let ``withHxRefresh succeeds when set to true`` () = let ``withHxRedirect succeeds`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary () let dic = HeaderDictionary ()
ctx.Response.Headers.ReturnsForAnyArgs dic |> ignore ctx.Response.Headers.ReturnsForAnyArgs dic |> ignore
task { task {
let! _ = withHxRefresh true next ctx let! _ = withHxRedirect "/somewhere-else" next ctx
Assert.True (dic.ContainsKey "HX-Refresh") Assert.True (dic.ContainsKey "HX-Redirect")
Assert.Equal ("true", dic.["HX-Refresh"].[0]) Assert.Equal ("/somewhere-else", dic["HX-Redirect"][0])
} }
[<Fact>] [<Fact>]
let ``withHxRefresh succeeds when set to false`` () = let ``withHxRefresh succeeds when set to true`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary () let dic = HeaderDictionary ()
ctx.Response.Headers.ReturnsForAnyArgs dic |> ignore ctx.Response.Headers.ReturnsForAnyArgs dic |> ignore
task { task {
let! _ = withHxRefresh false next ctx let! _ = withHxRefresh true next ctx
Assert.True (dic.ContainsKey "HX-Refresh") Assert.True (dic.ContainsKey "HX-Refresh")
Assert.Equal ("false", dic.["HX-Refresh"].[0]) Assert.Equal ("true", dic["HX-Refresh"][0])
} }
[<Fact>] [<Fact>]
let ``withHxTrigger succeeds`` () = let ``withHxRefresh succeeds when set to false`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary () let dic = HeaderDictionary ()
ctx.Response.Headers.ReturnsForAnyArgs dic |> ignore ctx.Response.Headers.ReturnsForAnyArgs dic |> ignore
task { task {
let! _ = withHxTrigger "doSomething" next ctx let! _ = withHxRefresh false next ctx
Assert.True (dic.ContainsKey "HX-Trigger") Assert.True (dic.ContainsKey "HX-Refresh")
Assert.Equal ("doSomething", dic.["HX-Trigger"].[0]) Assert.Equal ("false", dic["HX-Refresh"][0])
} }
[<Fact>] [<Fact>]
let ``withHxTriggerMany succeeds`` () = let ``withHxReplaceUrl succeeds`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary () let dic = HeaderDictionary ()
ctx.Response.Headers.ReturnsForAnyArgs dic |> ignore ctx.Response.Headers.ReturnsForAnyArgs dic |> ignore
task { task {
let! _ = withHxTriggerMany [ "blah", "foo"; "bleh", "bar" ] next ctx let! _ = withHxReplaceUrl "/a-substitute-url" next ctx
Assert.True (dic.ContainsKey "HX-Trigger") Assert.True (dic.ContainsKey "HX-Replace-Url")
Assert.Equal ("""{ "blah": "foo", "bleh": "bar" }""", dic.["HX-Trigger"].[0]) Assert.Equal ("/a-substitute-url", dic["HX-Replace-Url"][0])
} }
[<Fact>] [<Fact>]
let ``withHxTriggerAfterSettle succeeds`` () = let ``withHxNoReplaceUrl succeeds`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary () let dic = HeaderDictionary ()
ctx.Response.Headers.ReturnsForAnyArgs dic |> ignore ctx.Response.Headers.ReturnsForAnyArgs dic |> ignore
task { task {
let! _ = withHxTriggerAfterSettle "byTheWay" next ctx let! _ = withHxNoReplaceUrl next ctx
Assert.True (dic.ContainsKey "HX-Trigger-After-Settle") Assert.True (dic.ContainsKey "HX-Replace-Url")
Assert.Equal ("byTheWay", dic.["HX-Trigger-After-Settle"].[0]) Assert.Equal ("false", dic["HX-Replace-Url"][0])
} }
[<Fact>] [<Fact>]
let ``withHxTriggerManyAfterSettle succeeds`` () = let ``withHxReswap succeeds`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary () let dic = HeaderDictionary ()
ctx.Response.Headers.ReturnsForAnyArgs dic |> ignore ctx.Response.Headers.ReturnsForAnyArgs dic |> ignore
task { task {
let! _ = withHxTriggerManyAfterSettle [ "oof", "ouch"; "hmm", "uh" ] next ctx let! _ = withHxReswap HxSwap.BeforeEnd next ctx
Assert.True (dic.ContainsKey "HX-Trigger-After-Settle") Assert.True (dic.ContainsKey "HX-Reswap")
Assert.Equal ("""{ "oof": "ouch", "hmm": "uh" }""", dic.["HX-Trigger-After-Settle"].[0]) Assert.Equal (HxSwap.BeforeEnd, dic["HX-Reswap"][0])
} }
[<Fact>] [<Fact>]
let ``withHxTriggerAfterSwap succeeds`` () = let ``withHxRetarget succeeds`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary () let dic = HeaderDictionary ()
ctx.Response.Headers.ReturnsForAnyArgs dic |> ignore ctx.Response.Headers.ReturnsForAnyArgs dic |> ignore
task { task {
let! _ = withHxTriggerAfterSwap "justASec" next ctx let! _ = withHxRetarget "#somewhereElse" next ctx
Assert.True (dic.ContainsKey "HX-Trigger-After-Swap") Assert.True (dic.ContainsKey "HX-Retarget")
Assert.Equal ("justASec", dic.["HX-Trigger-After-Swap"].[0]) Assert.Equal ("#somewhereElse", dic["HX-Retarget"][0])
} }
[<Fact>] [<Fact>]
let ``withHxTriggerManyAfterSwap succeeds`` () = let ``withHxTrigger succeeds`` () =
let ctx = Substitute.For<HttpContext> () let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary () let dic = HeaderDictionary ()
ctx.Response.Headers.ReturnsForAnyArgs dic |> ignore ctx.Response.Headers.ReturnsForAnyArgs dic |> ignore
task { task {
let! _ = withHxTriggerManyAfterSwap [ "this", "1"; "that", "2" ] next ctx let! _ = withHxTrigger "doSomething" next ctx
Assert.True (dic.ContainsKey "HX-Trigger-After-Swap") Assert.True (dic.ContainsKey "HX-Trigger")
Assert.Equal ("""{ "this": "1", "that": "2" }""", dic.["HX-Trigger-After-Swap"].[0]) Assert.Equal ("doSomething", dic["HX-Trigger"][0])
} }
[<Fact>]
let ``withHxTriggerMany succeeds`` () =
let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary ()
ctx.Response.Headers.ReturnsForAnyArgs dic |> ignore
task {
let! _ = withHxTriggerMany [ "blah", "foo"; "bleh", "bar" ] next ctx
Assert.True (dic.ContainsKey "HX-Trigger")
Assert.Equal ("""{ "blah": "foo", "bleh": "bar" }""", dic["HX-Trigger"][0])
}
[<Fact>]
let ``withHxTriggerAfterSettle succeeds`` () =
let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary ()
ctx.Response.Headers.ReturnsForAnyArgs dic |> ignore
task {
let! _ = withHxTriggerAfterSettle "byTheWay" next ctx
Assert.True (dic.ContainsKey "HX-Trigger-After-Settle")
Assert.Equal ("byTheWay", dic["HX-Trigger-After-Settle"][0])
}
[<Fact>]
let ``withHxTriggerManyAfterSettle succeeds`` () =
let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary ()
ctx.Response.Headers.ReturnsForAnyArgs dic |> ignore
task {
let! _ = withHxTriggerManyAfterSettle [ "oof", "ouch"; "hmm", "uh" ] next ctx
Assert.True (dic.ContainsKey "HX-Trigger-After-Settle")
Assert.Equal ("""{ "oof": "ouch", "hmm": "uh" }""", dic["HX-Trigger-After-Settle"][0])
}
[<Fact>]
let ``withHxTriggerAfterSwap succeeds`` () =
let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary ()
ctx.Response.Headers.ReturnsForAnyArgs dic |> ignore
task {
let! _ = withHxTriggerAfterSwap "justASec" next ctx
Assert.True (dic.ContainsKey "HX-Trigger-After-Swap")
Assert.Equal ("justASec", dic["HX-Trigger-After-Swap"][0])
}
[<Fact>]
let ``withHxTriggerManyAfterSwap succeeds`` () =
let ctx = Substitute.For<HttpContext> ()
let dic = HeaderDictionary ()
ctx.Response.Headers.ReturnsForAnyArgs dic |> ignore
task {
let! _ = withHxTriggerManyAfterSwap [ "this", "1"; "that", "2" ] next ctx
Assert.True (dic.ContainsKey "HX-Trigger-After-Swap")
Assert.Equal ("""{ "this": "1", "that": "2" }""", dic["HX-Trigger-After-Swap"][0])
}

View File

@@ -1,7 +1,6 @@
<Project Sdk="Microsoft.NET.Sdk"> <Project Sdk="Microsoft.NET.Sdk">
<PropertyGroup> <PropertyGroup>
<TargetFramework>net6.0</TargetFramework>
<GenerateDocumentationFile>true</GenerateDocumentationFile> <GenerateDocumentationFile>true</GenerateDocumentationFile>
<Description>htmx header extensions and helpers for Giraffe</Description> <Description>htmx header extensions and helpers for Giraffe</Description>
<PackageReadmeFile>README.md</PackageReadmeFile> <PackageReadmeFile>README.md</PackageReadmeFile>
@@ -16,4 +15,8 @@
<PackageReference Include="Giraffe" Version="5.0.0" /> <PackageReference Include="Giraffe" Version="5.0.0" />
</ItemGroup> </ItemGroup>
<ItemGroup>
<ProjectReference Include="..\Common\Giraffe.Htmx.Common.fsproj" />
</ItemGroup>
</Project> </Project>

View File

@@ -6,94 +6,122 @@ open System
/// Determine if the given header is present /// Determine if the given header is present
let private hdr (headers : IHeaderDictionary) hdr = let private hdr (headers : IHeaderDictionary) hdr =
match headers.[hdr] with it when it = StringValues.Empty -> None | it -> Some it.[0] match headers[hdr] with it when it = StringValues.Empty -> None | it -> Some it[0]
/// Extensions to the header dictionary /// Extensions to the header dictionary
type IHeaderDictionary with type IHeaderDictionary with
/// Indicates that the request is via an element using `hx-boost` /// Indicates that the request is via an element using `hx-boost`
member this.HxBoosted with get () = hdr this "HX-Boosted" |> Option.map bool.Parse member this.HxBoosted with get () = hdr this "HX-Boosted" |> Option.map bool.Parse
/// The current URL of the browser _(note that this does not update until after settle)_ /// The current URL of the browser _(note that this does not update until after settle)_
member this.HxCurrentUrl with get () = hdr this "HX-Current-URL" |> Option.map Uri member this.HxCurrentUrl with get () = hdr this "HX-Current-URL" |> Option.map Uri
/// `true` if the request is for history restoration after a miss in the local history cache /// `true` if the request is for history restoration after a miss in the local history cache
member this.HxHistoryRestoreRequest with get () = hdr this "HX-History-Restore-Request" |> Option.map bool.Parse member this.HxHistoryRestoreRequest with get () = hdr this "HX-History-Restore-Request" |> Option.map bool.Parse
/// The user response to an `hx-prompt` /// The user response to an `hx-prompt`
member this.HxPrompt with get () = hdr this "HX-Prompt" member this.HxPrompt with get () = hdr this "HX-Prompt"
/// `true` if the request came from HTMX /// `true` if the request came from HTMX
member this.HxRequest with get () = hdr this "HX-Request" |> Option.map bool.Parse member this.HxRequest with get () = hdr this "HX-Request" |> Option.map bool.Parse
/// The `id` of the target element if it exists /// The `id` of the target element if it exists
member this.HxTarget with get () = hdr this "HX-Target" member this.HxTarget with get () = hdr this "HX-Target"
/// The `id` of the triggered element if it exists /// The `id` of the triggered element if it exists
member this.HxTrigger with get () = hdr this "HX-Trigger" member this.HxTrigger with get () = hdr this "HX-Trigger"
/// The `name` of the triggered element if it exists /// The `name` of the triggered element if it exists
member this.HxTriggerName with get () = hdr this "HX-Trigger-Name" member this.HxTriggerName with get () = hdr this "HX-Trigger-Name"
/// Extensions for the request object /// Extensions for the request object
type HttpRequest with type HttpRequest with
/// Whether this request was initiated from HTMX /// Whether this request was initiated from htmx
member this.IsHtmx with get () = this.Headers.HxRequest |> Option.defaultValue false member this.IsHtmx with get () = this.Headers.HxRequest |> Option.defaultValue false
/// Whether this request is an HTMX history-miss refresh request /// Whether this request is an htmx history-miss refresh request
member this.IsHtmxRefresh with get () = member this.IsHtmxRefresh with get () =
this.IsHtmx && (this.Headers.HxHistoryRestoreRequest |> Option.defaultValue false) this.IsHtmx && (this.Headers.HxHistoryRestoreRequest |> Option.defaultValue false)
/// HTTP handlers for setting output headers /// HTTP handlers for setting output headers
[<AutoOpen>] [<AutoOpen>]
module Handlers = module Handlers =
/// Convert a boolean to lowercase `true` or `false` /// Convert a boolean to lowercase `true` or `false`
let private toLowerBool (trueOrFalse : bool) = let private toLowerBool (trueOrFalse : bool) =
(string trueOrFalse).ToLowerInvariant () (string trueOrFalse).ToLowerInvariant ()
/// Serialize a list of key/value pairs to JSON (very rudimentary) /// Serialize a list of key/value pairs to JSON (very rudimentary)
let private toJson (evts : (string * string) list) = let private toJson (evts : (string * string) list) =
evts evts
|> List.map (fun evt -> sprintf "\"%s\": \"%s\"" (fst evt) ((snd evt).Replace ("\"", "\\\""))) |> List.map (fun evt -> sprintf "\"%s\": \"%s\"" (fst evt) ((snd evt).Replace ("\"", "\\\"")))
|> String.concat ", " |> String.concat ", "
|> sprintf "{ %s }" |> sprintf "{ %s }"
// Pushes a new url into the history stack /// Pushes a new url into the history stack
let withHxPush : string -> HttpHandler = let withHxPushUrl : string -> HttpHandler =
setHttpHeader "HX-Push" setHttpHeader "HX-Push-Url"
/// Can be used to do a client-side redirect to a new location /// Explicitly do not push a new URL into the history stack
let withHxRedirect : string -> HttpHandler = let withHxNoPushUrl : HttpHandler =
setHttpHeader "HX-Redirect" toLowerBool false |> withHxPushUrl
/// If set to `true` the client side will do a a full refresh of the page /// Pushes a new url into the history stack
let withHxRefresh : bool -> HttpHandler = [<Obsolete "Use withHxPushUrl; HX-Push was replaced by HX-Push-Url in v1.8.0">]
toLowerBool >> setHttpHeader "HX-Refresh" let withHxPush = withHxPushUrl
/// Allows you to trigger a single client side event /// Explicitly do not push a new URL into the history stack
let withHxTrigger : string -> HttpHandler = [<Obsolete "Use withHxNoPushUrl; HX-Push was replaced by HX-Push-Url in v1.8.0">]
setHttpHeader "HX-Trigger" let withHxNoPush = withHxNoPushUrl
/// Allows you to trigger multiple client side events /// Can be used to do a client-side redirect to a new location
let withHxTriggerMany evts : HttpHandler = let withHxRedirect : string -> HttpHandler =
toJson evts |> setHttpHeader "HX-Trigger" setHttpHeader "HX-Redirect"
/// Allows you to trigger a single client side event after changes have settled /// If set to `true` the client side will do a a full refresh of the page
let withHxTriggerAfterSettle : string -> HttpHandler = let withHxRefresh : bool -> HttpHandler =
setHttpHeader "HX-Trigger-After-Settle" toLowerBool >> setHttpHeader "HX-Refresh"
/// Allows you to trigger multiple client side events after changes have settled /// Replaces the current URL in the history stack
let withHxTriggerManyAfterSettle evts : HttpHandler = let withHxReplaceUrl : string -> HttpHandler =
toJson evts |> setHttpHeader "HX-Trigger-After-Settle" setHttpHeader "HX-Replace-Url"
/// Allows you to trigger a single client side event after DOM swapping occurs /// Explicitly do not replace the current URL in the history stack
let withHxTriggerAfterSwap : string -> HttpHandler = let withHxNoReplaceUrl : HttpHandler =
setHttpHeader "HX-Trigger-After-Swap" toLowerBool false |> withHxReplaceUrl
/// Allows you to trigger multiple client side events after DOM swapping occurs /// Override the `hx-swap` attribute from the initiating element
let withHxTriggerManyAfterSwap evts : HttpHandler = let withHxReswap : string -> HttpHandler =
toJson evts |> setHttpHeader "HX-Trigger-After-Swap" setHttpHeader "HX-Reswap"
/// Allows you to override the `hx-target` attribute
let withHxRetarget : string -> HttpHandler =
setHttpHeader "HX-Retarget"
/// Allows you to trigger a single client side event
let withHxTrigger : string -> HttpHandler =
setHttpHeader "HX-Trigger"
/// Allows you to trigger multiple client side events
let withHxTriggerMany evts : HttpHandler =
toJson evts |> setHttpHeader "HX-Trigger"
/// Allows you to trigger a single client side event after changes have settled
let withHxTriggerAfterSettle : string -> HttpHandler =
setHttpHeader "HX-Trigger-After-Settle"
/// Allows you to trigger multiple client side events after changes have settled
let withHxTriggerManyAfterSettle evts : HttpHandler =
toJson evts |> setHttpHeader "HX-Trigger-After-Settle"
/// Allows you to trigger a single client side event after DOM swapping occurs
let withHxTriggerAfterSwap : string -> HttpHandler =
setHttpHeader "HX-Trigger-After-Swap"
/// Allows you to trigger multiple client side events after DOM swapping occurs
let withHxTriggerManyAfterSwap evts : HttpHandler =
toJson evts |> setHttpHeader "HX-Trigger-After-Swap"

View File

@@ -2,6 +2,8 @@
This package enables server-side support for [htmx](https://htmx.org) within [Giraffe](https://giraffe.wiki) and ASP.NET's `HttpContext`. This package enables server-side support for [htmx](https://htmx.org) within [Giraffe](https://giraffe.wiki) and ASP.NET's `HttpContext`.
**htmx version: 1.8.0**
### Setup ### Setup
1. Install the package. 1. Install the package.
@@ -25,9 +27,11 @@ To set a response header:
let myHandler : HttpHander = let myHandler : HttpHander =
fun next ctx -> fun next ctx ->
// some meaningful work // some meaningful work
withHxPush "/some/new/url" >=> [other handlers] withHxPushUrl "/some/new/url" >=> [other handlers]
``` ```
The `HxSwap` module has constants to use for the `HX-Reswap` header. These may be extended with settle, show, and other qualifiers; see the htmx documentation for the `hx-swap` attribute for more information.
### Learn ### Learn
The naming conventions of this library were selected to mirror those provided by htmx. The header properties become `Hx*` on the `ctx.Request.Headers` object, and the response handlers are `withHx*` based on the header being set. The only part that does not line up is `withHxTrigger*` and `withHxTriggerMany`; the former set work with a single string (to trigger a single event with no arguments), while the latter set supports both arguments and multiple events. The naming conventions of this library were selected to mirror those provided by htmx. The header properties become `Hx*` on the `ctx.Request.Headers` object, and the response handlers are `withHx*` based on the header being set. The only part that does not line up is `withHxTrigger*` and `withHxTriggerMany`; the former set work with a single string (to trigger a single event with no arguments), while the latter set supports both arguments and multiple events.

View File

@@ -1,8 +1,6 @@
<Project Sdk="Microsoft.NET.Sdk"> <Project Sdk="Microsoft.NET.Sdk">
<PropertyGroup> <PropertyGroup>
<TargetFramework>net6.0</TargetFramework>
<IsPackable>false</IsPackable> <IsPackable>false</IsPackable>
<GenerateProgramFile>false</GenerateProgramFile> <GenerateProgramFile>false</GenerateProgramFile>
</PropertyGroup> </PropertyGroup>

View File

@@ -6,439 +6,440 @@ open Xunit
/// Tests for the HxEncoding module /// Tests for the HxEncoding module
module Encoding = module Encoding =
[<Fact>] [<Fact>]
let ``Form is correct`` () = let ``Form is correct`` () =
Assert.Equal ("application/x-www-form-urlencoded", HxEncoding.Form) Assert.Equal ("application/x-www-form-urlencoded", HxEncoding.Form)
[<Fact>] [<Fact>]
let ``MultipartForm is correct`` () = let ``MultipartForm is correct`` () =
Assert.Equal ("multipart/form-data", HxEncoding.MultipartForm) Assert.Equal ("multipart/form-data", HxEncoding.MultipartForm)
/// Tests for the HxHeaders module /// Tests for the HxHeaders module
module Headers = module Headers =
[<Fact>] [<Fact>]
let ``From succeeds with an empty list`` () = let ``From succeeds with an empty list`` () =
Assert.Equal ("{ }", HxHeaders.From []) Assert.Equal ("{ }", HxHeaders.From [])
[<Fact>] [<Fact>]
let ``From succeeds and escapes quotes`` () = let ``From succeeds and escapes quotes`` () =
Assert.Equal ("{ \"test\": \"one two three\", \"again\": \"four \\\"five\\\" six\" }", Assert.Equal ("{ \"test\": \"one two three\", \"again\": \"four \\\"five\\\" six\" }",
HxHeaders.From [ "test", "one two three"; "again", "four \"five\" six" ]) HxHeaders.From [ "test", "one two three"; "again", "four \"five\" six" ])
/// Tests for the HxParams module /// Tests for the HxParams module
module Params = module Params =
[<Fact>] [<Fact>]
let ``All is correct`` () = let ``All is correct`` () =
Assert.Equal ("*", HxParams.All) Assert.Equal ("*", HxParams.All)
[<Fact>] [<Fact>]
let ``None is correct`` () = let ``None is correct`` () =
Assert.Equal ("none", HxParams.None) Assert.Equal ("none", HxParams.None)
[<Fact>] [<Fact>]
let ``With succeeds with empty list`` () = let ``With succeeds with empty list`` () =
Assert.Equal ("", HxParams.With []) Assert.Equal ("", HxParams.With [])
[<Fact>] [<Fact>]
let ``With succeeds with one list item`` () = let ``With succeeds with one list item`` () =
Assert.Equal ("boo", HxParams.With [ "boo" ]) Assert.Equal ("boo", HxParams.With [ "boo" ])
[<Fact>] [<Fact>]
let ``With succeeds with multiple list items`` () = let ``With succeeds with multiple list items`` () =
Assert.Equal ("foo,bar,baz", HxParams.With [ "foo"; "bar"; "baz" ]) Assert.Equal ("foo,bar,baz", HxParams.With [ "foo"; "bar"; "baz" ])
[<Fact>] [<Fact>]
let ``Except succeeds with empty list`` () = let ``Except succeeds with empty list`` () =
Assert.Equal ("not ", HxParams.Except []) Assert.Equal ("not ", HxParams.Except [])
[<Fact>] [<Fact>]
let ``Except succeeds with one list item`` () = let ``Except succeeds with one list item`` () =
Assert.Equal ("not that", HxParams.Except [ "that" ]) Assert.Equal ("not that", HxParams.Except [ "that" ])
[<Fact>] [<Fact>]
let ``Except succeeds with multiple list items`` () = let ``Except succeeds with multiple list items`` () =
Assert.Equal ("not blue,green", HxParams.Except [ "blue"; "green" ]) Assert.Equal ("not blue,green", HxParams.Except [ "blue"; "green" ])
/// Tests for the HxRequest module /// Tests for the HxRequest module
module Request = module Request =
[<Fact>] [<Fact>]
let ``Configure succeeds with an empty list`` () = let ``Configure succeeds with an empty list`` () =
Assert.Equal ("{ }", HxRequest.Configure []) Assert.Equal ("{ }", HxRequest.Configure [])
[<Fact>] [<Fact>]
let ``Configure succeeds with a non-empty list`` () = let ``Configure succeeds with a non-empty list`` () =
Assert.Equal ("{ \"a\": \"b\", \"c\": \"d\" }", HxRequest.Configure [ "\"a\": \"b\""; "\"c\": \"d\"" ]) Assert.Equal ("{ \"a\": \"b\", \"c\": \"d\" }", HxRequest.Configure [ "\"a\": \"b\""; "\"c\": \"d\"" ])
[<Fact>] [<Fact>]
let ``Configure succeeds with all known params configured`` () = let ``Configure succeeds with all known params configured`` () =
Assert.Equal ("{ \"timeout\": 1000, \"credentials\": false, \"noHeaders\": true }", Assert.Equal ("{ \"timeout\": 1000, \"credentials\": false, \"noHeaders\": true }",
HxRequest.Configure [ HxRequest.Timeout 1000; HxRequest.Credentials false; HxRequest.NoHeaders true ]) HxRequest.Configure [ HxRequest.Timeout 1000; HxRequest.Credentials false; HxRequest.NoHeaders true ])
[<Fact>] [<Fact>]
let ``Timeout succeeds`` () = let ``Timeout succeeds`` () =
Assert.Equal ("\"timeout\": 50", HxRequest.Timeout 50) Assert.Equal ("\"timeout\": 50", HxRequest.Timeout 50)
[<Fact>] [<Fact>]
let ``Credentials succeeds when set to true`` () = let ``Credentials succeeds when set to true`` () =
Assert.Equal ("\"credentials\": true", HxRequest.Credentials true) Assert.Equal ("\"credentials\": true", HxRequest.Credentials true)
[<Fact>] [<Fact>]
let ``Credentials succeeds when set to false`` () = let ``Credentials succeeds when set to false`` () =
Assert.Equal ("\"credentials\": false", HxRequest.Credentials false) Assert.Equal ("\"credentials\": false", HxRequest.Credentials false)
[<Fact>] [<Fact>]
let ``NoHeaders succeeds when set to true`` () = let ``NoHeaders succeeds when set to true`` () =
Assert.Equal ("\"noHeaders\": true", HxRequest.NoHeaders true) Assert.Equal ("\"noHeaders\": true", HxRequest.NoHeaders true)
[<Fact>] [<Fact>]
let ``NoHeaders succeeds when set to false`` () = let ``NoHeaders succeeds when set to false`` () =
Assert.Equal ("\"noHeaders\": false", HxRequest.NoHeaders false) Assert.Equal ("\"noHeaders\": false", HxRequest.NoHeaders false)
/// Tests for the HxSwap module
module Swap =
[<Fact>]
let ``InnerHtml is correct`` () =
Assert.Equal ("innerHTML", HxSwap.InnerHtml)
[<Fact>]
let ``OuterHtml is correct`` () =
Assert.Equal ("outerHTML", HxSwap.OuterHtml)
[<Fact>]
let ``BeforeBegin is correct`` () =
Assert.Equal ("beforebegin", HxSwap.BeforeBegin)
[<Fact>]
let ``BeforeEnd is correct`` () =
Assert.Equal ("beforeend", HxSwap.BeforeEnd)
[<Fact>]
let ``AfterBegin is correct`` () =
Assert.Equal ("afterbegin", HxSwap.AfterBegin)
[<Fact>]
let ``AfterEnd is correct`` () =
Assert.Equal ("afterend", HxSwap.AfterEnd)
[<Fact>]
let ``None is correct`` () =
Assert.Equal ("none", HxSwap.None)
/// Tests for the HxTrigger module /// Tests for the HxTrigger module
module Trigger = module Trigger =
[<Fact>] [<Fact>]
let ``Click is correct`` () = let ``Click is correct`` () =
Assert.Equal ("click", HxTrigger.Click) Assert.Equal ("click", HxTrigger.Click)
[<Fact>] [<Fact>]
let ``Load is correct`` () = let ``Load is correct`` () =
Assert.Equal ("load", HxTrigger.Load) Assert.Equal ("load", HxTrigger.Load)
[<Fact>] [<Fact>]
let ``Revealed is correct`` () = let ``Revealed is correct`` () =
Assert.Equal ("revealed", HxTrigger.Revealed) Assert.Equal ("revealed", HxTrigger.Revealed)
[<Fact>] [<Fact>]
let ``Every succeeds`` () = let ``Every succeeds`` () =
Assert.Equal ("every 3s", HxTrigger.Every "3s") Assert.Equal ("every 3s", HxTrigger.Every "3s")
[<Fact>] [<Fact>]
let ``Filter.Alt succeeds`` () = let ``Filter.Alt succeeds`` () =
Assert.Equal ("click[altKey]", HxTrigger.Filter.Alt HxTrigger.Click) Assert.Equal ("click[altKey]", HxTrigger.Filter.Alt HxTrigger.Click)
[<Fact>] [<Fact>]
let ``Filter.Ctrl succeeds`` () = let ``Filter.Ctrl succeeds`` () =
Assert.Equal ("click[ctrlKey]", HxTrigger.Filter.Ctrl HxTrigger.Click) Assert.Equal ("click[ctrlKey]", HxTrigger.Filter.Ctrl HxTrigger.Click)
[<Fact>] [<Fact>]
let ``Filter.Shift succeeds`` () = let ``Filter.Shift succeeds`` () =
Assert.Equal ("click[shiftKey]", HxTrigger.Filter.Shift HxTrigger.Click) Assert.Equal ("click[shiftKey]", HxTrigger.Filter.Shift HxTrigger.Click)
[<Fact>] [<Fact>]
let ``Filter.CtrlAlt succeeds`` () = let ``Filter.CtrlAlt succeeds`` () =
Assert.Equal ("click[ctrlKey&&altKey]", HxTrigger.Filter.CtrlAlt HxTrigger.Click) Assert.Equal ("click[ctrlKey&&altKey]", HxTrigger.Filter.CtrlAlt HxTrigger.Click)
[<Fact>] [<Fact>]
let ``Filter.CtrlShift succeeds`` () = let ``Filter.CtrlShift succeeds`` () =
Assert.Equal ("click[ctrlKey&&shiftKey]", HxTrigger.Filter.CtrlShift HxTrigger.Click) Assert.Equal ("click[ctrlKey&&shiftKey]", HxTrigger.Filter.CtrlShift HxTrigger.Click)
[<Fact>] [<Fact>]
let ``Filter.CtrlAltShift succeeds`` () = let ``Filter.CtrlAltShift succeeds`` () =
Assert.Equal ("click[ctrlKey&&altKey&&shiftKey]", HxTrigger.Filter.CtrlAltShift HxTrigger.Click) Assert.Equal ("click[ctrlKey&&altKey&&shiftKey]", HxTrigger.Filter.CtrlAltShift HxTrigger.Click)
[<Fact>] [<Fact>]
let ``Filter.AltShift succeeds`` () = let ``Filter.AltShift succeeds`` () =
Assert.Equal ("click[altKey&&shiftKey]", HxTrigger.Filter.AltShift HxTrigger.Click) Assert.Equal ("click[altKey&&shiftKey]", HxTrigger.Filter.AltShift HxTrigger.Click)
[<Fact>] [<Fact>]
let ``Once succeeds when it is the first modifier`` () = let ``Once succeeds when it is the first modifier`` () =
Assert.Equal ("once", HxTrigger.Once "") Assert.Equal ("once", HxTrigger.Once "")
[<Fact>] [<Fact>]
let ``Once succeeds when it is not the first modifier`` () = let ``Once succeeds when it is not the first modifier`` () =
Assert.Equal ("click once", HxTrigger.Once "click") Assert.Equal ("click once", HxTrigger.Once "click")
[<Fact>] [<Fact>]
let ``Changed succeeds when it is the first modifier`` () = let ``Changed succeeds when it is the first modifier`` () =
Assert.Equal ("changed", HxTrigger.Changed "") Assert.Equal ("changed", HxTrigger.Changed "")
[<Fact>] [<Fact>]
let ``Changed succeeds when it is not the first modifier`` () = let ``Changed succeeds when it is not the first modifier`` () =
Assert.Equal ("click changed", HxTrigger.Changed "click") Assert.Equal ("click changed", HxTrigger.Changed "click")
[<Fact>] [<Fact>]
let ``Delay succeeds when it is the first modifier`` () = let ``Delay succeeds when it is the first modifier`` () =
Assert.Equal ("delay:1s", HxTrigger.Delay "1s" "") Assert.Equal ("delay:1s", HxTrigger.Delay "1s" "")
[<Fact>] [<Fact>]
let ``Delay succeeds when it is not the first modifier`` () = let ``Delay succeeds when it is not the first modifier`` () =
Assert.Equal ("click delay:2s", HxTrigger.Delay "2s" "click") Assert.Equal ("click delay:2s", HxTrigger.Delay "2s" "click")
[<Fact>] [<Fact>]
let ``Throttle succeeds when it is the first modifier`` () = let ``Throttle succeeds when it is the first modifier`` () =
Assert.Equal ("throttle:4s", HxTrigger.Throttle "4s" "") Assert.Equal ("throttle:4s", HxTrigger.Throttle "4s" "")
[<Fact>] [<Fact>]
let ``Throttle succeeds when it is not the first modifier`` () = let ``Throttle succeeds when it is not the first modifier`` () =
Assert.Equal ("click throttle:7s", HxTrigger.Throttle "7s" "click") Assert.Equal ("click throttle:7s", HxTrigger.Throttle "7s" "click")
[<Fact>] [<Fact>]
let ``From succeeds when it is the first modifier`` () = let ``From succeeds when it is the first modifier`` () =
Assert.Equal ("from:.nav", HxTrigger.From ".nav" "") Assert.Equal ("from:.nav", HxTrigger.From ".nav" "")
[<Fact>] [<Fact>]
let ``From succeeds when it is not the first modifier`` () = let ``From succeeds when it is not the first modifier`` () =
Assert.Equal ("click from:#somewhere", HxTrigger.From "#somewhere" "click") Assert.Equal ("click from:#somewhere", HxTrigger.From "#somewhere" "click")
[<Fact>] [<Fact>]
let ``FromDocument succeeds when it is the first modifier`` () = let ``FromDocument succeeds when it is the first modifier`` () =
Assert.Equal ("from:document", HxTrigger.FromDocument "") Assert.Equal ("from:document", HxTrigger.FromDocument "")
[<Fact>] [<Fact>]
let ``FromDocument succeeds when it is not the first modifier`` () = let ``FromDocument succeeds when it is not the first modifier`` () =
Assert.Equal ("click from:document", HxTrigger.FromDocument "click") Assert.Equal ("click from:document", HxTrigger.FromDocument "click")
[<Fact>] [<Fact>]
let ``FromWindow succeeds when it is the first modifier`` () = let ``FromWindow succeeds when it is the first modifier`` () =
Assert.Equal ("from:window", HxTrigger.FromWindow "") Assert.Equal ("from:window", HxTrigger.FromWindow "")
[<Fact>] [<Fact>]
let ``FromWindow succeeds when it is not the first modifier`` () = let ``FromWindow succeeds when it is not the first modifier`` () =
Assert.Equal ("click from:window", HxTrigger.FromWindow "click") Assert.Equal ("click from:window", HxTrigger.FromWindow "click")
[<Fact>] [<Fact>]
let ``FromClosest succeeds when it is the first modifier`` () = let ``FromClosest succeeds when it is the first modifier`` () =
Assert.Equal ("from:closest div", HxTrigger.FromClosest "div" "") Assert.Equal ("from:closest div", HxTrigger.FromClosest "div" "")
[<Fact>] [<Fact>]
let ``FromClosest succeeds when it is not the first modifier`` () = let ``FromClosest succeeds when it is not the first modifier`` () =
Assert.Equal ("click from:closest p", HxTrigger.FromClosest "p" "click") Assert.Equal ("click from:closest p", HxTrigger.FromClosest "p" "click")
[<Fact>] [<Fact>]
let ``FromFind succeeds when it is the first modifier`` () = let ``FromFind succeeds when it is the first modifier`` () =
Assert.Equal ("from:find li", HxTrigger.FromFind "li" "") Assert.Equal ("from:find li", HxTrigger.FromFind "li" "")
[<Fact>] [<Fact>]
let ``FromFind succeeds when it is not the first modifier`` () = let ``FromFind succeeds when it is not the first modifier`` () =
Assert.Equal ("click from:find .spot", HxTrigger.FromFind ".spot" "click") Assert.Equal ("click from:find .spot", HxTrigger.FromFind ".spot" "click")
[<Fact>] [<Fact>]
let ``Target succeeds when it is the first modifier`` () = let ``Target succeeds when it is the first modifier`` () =
Assert.Equal ("target:main", HxTrigger.Target "main" "") Assert.Equal ("target:main", HxTrigger.Target "main" "")
[<Fact>] [<Fact>]
let ``Target succeeds when it is not the first modifier`` () = let ``Target succeeds when it is not the first modifier`` () =
Assert.Equal ("click target:footer", HxTrigger.Target "footer" "click") Assert.Equal ("click target:footer", HxTrigger.Target "footer" "click")
[<Fact>] [<Fact>]
let ``Consume succeeds when it is the first modifier`` () = let ``Consume succeeds when it is the first modifier`` () =
Assert.Equal ("consume", HxTrigger.Consume "") Assert.Equal ("consume", HxTrigger.Consume "")
[<Fact>] [<Fact>]
let ``Consume succeeds when it is not the first modifier`` () = let ``Consume succeeds when it is not the first modifier`` () =
Assert.Equal ("click consume", HxTrigger.Consume "click") Assert.Equal ("click consume", HxTrigger.Consume "click")
[<Fact>] [<Fact>]
let ``Queue succeeds when it is the first modifier`` () = let ``Queue succeeds when it is the first modifier`` () =
Assert.Equal ("queue:abc", HxTrigger.Queue "abc" "") Assert.Equal ("queue:abc", HxTrigger.Queue "abc" "")
[<Fact>] [<Fact>]
let ``Queue succeeds when it is not the first modifier`` () = let ``Queue succeeds when it is not the first modifier`` () =
Assert.Equal ("click queue:def", HxTrigger.Queue "def" "click") Assert.Equal ("click queue:def", HxTrigger.Queue "def" "click")
[<Fact>] [<Fact>]
let ``QueueFirst succeeds when it is the first modifier`` () = let ``QueueFirst succeeds when it is the first modifier`` () =
Assert.Equal ("queue:first", HxTrigger.QueueFirst "") Assert.Equal ("queue:first", HxTrigger.QueueFirst "")
[<Fact>] [<Fact>]
let ``QueueFirst succeeds when it is not the first modifier`` () = let ``QueueFirst succeeds when it is not the first modifier`` () =
Assert.Equal ("click queue:first", HxTrigger.QueueFirst "click") Assert.Equal ("click queue:first", HxTrigger.QueueFirst "click")
[<Fact>] [<Fact>]
let ``QueueLast succeeds when it is the first modifier`` () = let ``QueueLast succeeds when it is the first modifier`` () =
Assert.Equal ("queue:last", HxTrigger.QueueLast "") Assert.Equal ("queue:last", HxTrigger.QueueLast "")
[<Fact>] [<Fact>]
let ``QueueLast succeeds when it is not the first modifier`` () = let ``QueueLast succeeds when it is not the first modifier`` () =
Assert.Equal ("click queue:last", HxTrigger.QueueLast "click") Assert.Equal ("click queue:last", HxTrigger.QueueLast "click")
[<Fact>] [<Fact>]
let ``QueueAll succeeds when it is the first modifier`` () = let ``QueueAll succeeds when it is the first modifier`` () =
Assert.Equal ("queue:all", HxTrigger.QueueAll "") Assert.Equal ("queue:all", HxTrigger.QueueAll "")
[<Fact>] [<Fact>]
let ``QueueAll succeeds when it is not the first modifier`` () = let ``QueueAll succeeds when it is not the first modifier`` () =
Assert.Equal ("click queue:all", HxTrigger.QueueAll "click") Assert.Equal ("click queue:all", HxTrigger.QueueAll "click")
[<Fact>] [<Fact>]
let ``QueueNone succeeds when it is the first modifier`` () = let ``QueueNone succeeds when it is the first modifier`` () =
Assert.Equal ("queue:none", HxTrigger.QueueNone "") Assert.Equal ("queue:none", HxTrigger.QueueNone "")
[<Fact>] [<Fact>]
let ``QueueNone succeeds when it is not the first modifier`` () = let ``QueueNone succeeds when it is not the first modifier`` () =
Assert.Equal ("click queue:none", HxTrigger.QueueNone "click") Assert.Equal ("click queue:none", HxTrigger.QueueNone "click")
/// Tests for the HxVals module /// Tests for the HxVals module
module Vals = module Vals =
[<Fact>] [<Fact>]
let ``From succeeds with an empty list`` () = let ``From succeeds with an empty list`` () =
Assert.Equal ("{ }", HxVals.From []) Assert.Equal ("{ }", HxVals.From [])
[<Fact>] [<Fact>]
let ``From succeeds and escapes quotes`` () = let ``From succeeds and escapes quotes`` () =
Assert.Equal ("{ \"test\": \"a \\\"b\\\" c\", \"2\": \"d e f\" }", Assert.Equal ("{ \"test\": \"a \\\"b\\\" c\", \"2\": \"d e f\" }",
HxVals.From [ "test", "a \"b\" c"; "2", "d e f" ]) HxVals.From [ "test", "a \"b\" c"; "2", "d e f" ])
/// Tests for the HtmxAttrs module /// Tests for the HtmxAttrs module
module Attributes = module Attributes =
/// Pipe-able assertion for a rendered node /// Pipe-able assertion for a rendered node
let shouldRender expected node = Assert.Equal (expected, RenderView.AsString.htmlNode node) let shouldRender expected node = Assert.Equal (expected, RenderView.AsString.htmlNode node)
[<Fact>] [<Fact>]
let ``_hxBoost succeeds`` () = let ``_hxBoost succeeds`` () =
div [ _hxBoost ] [] |> shouldRender """<div hx-boost="true"></div>""" div [ _hxBoost ] [] |> shouldRender """<div hx-boost="true"></div>"""
[<Fact>] [<Fact>]
let ``_hxConfirm succeeds`` () = let ``_hxConfirm succeeds`` () =
button [ _hxConfirm "REALLY?!?" ] [] |> shouldRender """<button hx-confirm="REALLY?!?"></button>""" button [ _hxConfirm "REALLY?!?" ] [] |> shouldRender """<button hx-confirm="REALLY?!?"></button>"""
[<Fact>] [<Fact>]
let ``_hxDelete succeeds`` () = let ``_hxDelete succeeds`` () =
span [ _hxDelete "/this-endpoint" ] [] |> shouldRender """<span hx-delete="/this-endpoint"></span>""" span [ _hxDelete "/this-endpoint" ] [] |> shouldRender """<span hx-delete="/this-endpoint"></span>"""
[<Fact>] [<Fact>]
let ``_hxDisable succeeds`` () = let ``_hxDisable succeeds`` () =
p [ _hxDisable ] [] |> shouldRender """<p hx-disable></p>""" p [ _hxDisable ] [] |> shouldRender """<p hx-disable></p>"""
[<Fact>] [<Fact>]
let ``_hxEncoding succeeds`` () = let ``_hxDisinherit succeeds`` () =
form [ _hxEncoding "utf-7" ] [] |> shouldRender """<form hx-encoding="utf-7"></form>""" strong [ _hxDisinherit "*" ] [] |> shouldRender """<strong hx-disinherit="*"></strong>"""
[<Fact>] [<Fact>]
let ``_hxExt succeeds`` () = let ``_hxEncoding succeeds`` () =
section [ _hxExt "extendme" ] [] |> shouldRender """<section hx-ext="extendme"></section>""" form [ _hxEncoding "utf-7" ] [] |> shouldRender """<form hx-encoding="utf-7"></form>"""
[<Fact>] [<Fact>]
let ``_hxGet succeeds`` () = let ``_hxExt succeeds`` () =
article [ _hxGet "/the-text" ] [] |> shouldRender """<article hx-get="/the-text"></article>""" section [ _hxExt "extendme" ] [] |> shouldRender """<section hx-ext="extendme"></section>"""
[<Fact>] [<Fact>]
let ``_hxHeaders succeeds`` () = let ``_hxGet succeeds`` () =
figure [ _hxHeaders """{ "X-Special-Header": "some-header" }""" ] [] article [ _hxGet "/the-text" ] [] |> shouldRender """<article hx-get="/the-text"></article>"""
|> shouldRender """<figure hx-headers="{ &quot;X-Special-Header&quot;: &quot;some-header&quot; }"></figure>"""
[<Fact>] [<Fact>]
let ``_hxHistoryElt succeeds`` () = let ``_hxHeaders succeeds`` () =
table [ _hxHistoryElt ] [] |> shouldRender """<table hx-history-elt></table>""" figure [ _hxHeaders """{ "X-Special-Header": "some-header" }""" ] []
|> shouldRender """<figure hx-headers="{ &quot;X-Special-Header&quot;: &quot;some-header&quot; }"></figure>"""
[<Fact>] [<Fact>]
let ``_hxInclude succeeds`` () = let ``_hxHistoryElt succeeds`` () =
a [ _hxInclude ".extra-stuff" ] [] |> shouldRender """<a hx-include=".extra-stuff"></a>""" table [ _hxHistoryElt ] [] |> shouldRender """<table hx-history-elt></table>"""
[<Fact>] [<Fact>]
let ``_hxIndicator succeeds`` () = let ``_hxInclude succeeds`` () =
aside [ _hxIndicator "#spinner" ] [] |> shouldRender """<aside hx-indicator="#spinner"></aside>""" a [ _hxInclude ".extra-stuff" ] [] |> shouldRender """<a hx-include=".extra-stuff"></a>"""
[<Fact>] [<Fact>]
let ``_hxNoBoost succeeds`` () = let ``_hxIndicator succeeds`` () =
td [ _hxNoBoost ] [] |> shouldRender """<td hx-boost="false"></td>""" aside [ _hxIndicator "#spinner" ] [] |> shouldRender """<aside hx-indicator="#spinner"></aside>"""
[<Fact>] [<Fact>]
let ``_hxParams succeeds`` () = let ``_hxNoBoost succeeds`` () =
br [ _hxParams "[p1,p2]" ] |> shouldRender """<br hx-params="[p1,p2]">""" td [ _hxNoBoost ] [] |> shouldRender """<td hx-boost="false"></td>"""
[<Fact>] [<Fact>]
let ``_hxPatch succeeds`` () = let ``_hxParams succeeds`` () =
div [ _hxPatch "/arrrgh" ] [] |> shouldRender """<div hx-patch="/arrrgh"></div>""" br [ _hxParams "[p1,p2]" ] |> shouldRender """<br hx-params="[p1,p2]">"""
[<Fact>] [<Fact>]
let ``_hxPost succeeds`` () = let ``_hxPatch succeeds`` () =
hr [ _hxPost "/hear-ye-hear-ye" ] |> shouldRender """<hr hx-post="/hear-ye-hear-ye">""" div [ _hxPatch "/arrrgh" ] [] |> shouldRender """<div hx-patch="/arrrgh"></div>"""
[<Fact>] [<Fact>]
let ``_hxPreserve succeeds`` () = let ``_hxPost succeeds`` () =
img [ _hxPreserve ] |> shouldRender """<img hx-preserve="true">""" hr [ _hxPost "/hear-ye-hear-ye" ] |> shouldRender """<hr hx-post="/hear-ye-hear-ye">"""
[<Fact>] [<Fact>]
let ``_hxPrompt succeeds`` () = let ``_hxPreserve succeeds`` () =
strong [ _hxPrompt "Who goes there?" ] [] |> shouldRender """<strong hx-prompt="Who goes there?"></strong>""" img [ _hxPreserve ] |> shouldRender """<img hx-preserve="true">"""
[<Fact>] [<Fact>]
let ``_hxPushUrl succeeds`` () = let ``_hxPrompt succeeds`` () =
dl [ _hxPushUrl ] [] |> shouldRender """<dl hx-push-url></dl>""" strong [ _hxPrompt "Who goes there?" ] [] |> shouldRender """<strong hx-prompt="Who goes there?"></strong>"""
[<Fact>] [<Fact>]
let ``_hxPut succeeds`` () = let ``_hxPushUrl succeeds`` () =
s [ _hxPut "/take-this" ] [] |> shouldRender """<s hx-put="/take-this"></s>""" dl [ _hxPushUrl "/a-b-c" ] [] |> shouldRender """<dl hx-push-url="/a-b-c"></dl>"""
[<Fact>] [<Fact>]
let ``_hxRequest succeeds`` () = let ``_hxPut succeeds`` () =
u [ _hxRequest "noHeaders" ] [] |> shouldRender """<u hx-request="noHeaders"></u>""" s [ _hxPut "/take-this" ] [] |> shouldRender """<s hx-put="/take-this"></s>"""
[<Fact>] [<Fact>]
let ``_hxSelect succeeds`` () = let ``_hxReplaceUrl succeeds`` () =
nav [ _hxSelect "#navbar" ] [] |> shouldRender """<nav hx-select="#navbar"></nav>""" p [ _hxReplaceUrl "/something-else" ] [] |> shouldRender """<p hx-replace-url="/something-else"></p>"""
[<Fact>] [<Fact>]
let ``_hxSse succeeds`` () = let ``_hxRequest succeeds`` () =
footer [ _hxSse "connect:/my-events" ] [] |> shouldRender """<footer hx-sse="connect:/my-events"></footer>""" u [ _hxRequest "noHeaders" ] [] |> shouldRender """<u hx-request="noHeaders"></u>"""
[<Fact>] [<Fact>]
let ``_hxSwap succeeds`` () = let ``_hxSelect succeeds`` () =
del [ _hxSwap "innerHTML" ] [] |> shouldRender """<del hx-swap="innerHTML"></del>""" nav [ _hxSelect "#navbar" ] [] |> shouldRender """<nav hx-select="#navbar"></nav>"""
[<Fact>] [<Fact>]
let ``_hxSwapOob succeeds`` () = let ``_hxSelectOob succeeds`` () =
li [ _hxSwapOob "true" ] [] |> shouldRender """<li hx-swap-oob="true"></li>""" section [ _hxSelectOob "#oob" ] [] |> shouldRender """<section hx-select-oob="#oob"></section>"""
[<Fact>] [<Fact>]
let ``_hxTarget succeeds`` () = let ``_hxSse succeeds`` () =
header [ _hxTarget "#somewhereElse" ] [] |> shouldRender """<header hx-target="#somewhereElse"></header>""" footer [ _hxSse "connect:/my-events" ] [] |> shouldRender """<footer hx-sse="connect:/my-events"></footer>"""
[<Fact>] [<Fact>]
let ``_hxTrigger succeeds`` () = let ``_hxSwap succeeds`` () =
figcaption [ _hxTrigger "load" ] [] |> shouldRender """<figcaption hx-trigger="load"></figcaption>""" del [ _hxSwap "innerHTML" ] [] |> shouldRender """<del hx-swap="innerHTML"></del>"""
[<Fact>] [<Fact>]
let ``_hxVals succeeds`` () = let ``_hxSwapOob succeeds`` () =
dt [ _hxVals """{ "extra": "values" }""" ] [] li [ _hxSwapOob "true" ] [] |> shouldRender """<li hx-swap-oob="true"></li>"""
|> shouldRender """<dt hx-vals="{ &quot;extra&quot;: &quot;values&quot; }"></dt>"""
[<Fact>] [<Fact>]
let ``_hxWs succeeds`` () = let ``_hxSync succeeds`` () =
ul [ _hxWs "connect:/web-socket" ] [] |> shouldRender """<ul hx-ws="connect:/web-socket"></ul>""" nav [ _hxSync "closest form:abort" ] [] |> shouldRender """<nav hx-sync="closest form:abort"></nav>"""
[<Fact>]
let ``_hxTarget succeeds`` () =
header [ _hxTarget "#somewhereElse" ] [] |> shouldRender """<header hx-target="#somewhereElse"></header>"""
[<Fact>]
let ``_hxTrigger succeeds`` () =
figcaption [ _hxTrigger "load" ] [] |> shouldRender """<figcaption hx-trigger="load"></figcaption>"""
[<Fact>]
let ``_hxVals succeeds`` () =
dt [ _hxVals """{ "extra": "values" }""" ] []
|> shouldRender """<dt hx-vals="{ &quot;extra&quot;: &quot;values&quot; }"></dt>"""
[<Fact>]
let ``_hxWs succeeds`` () =
ul [ _hxWs "connect:/web-socket" ] [] |> shouldRender """<ul hx-ws="connect:/web-socket"></ul>"""
/// Tests for the Script module
module Script =
[<Fact>]
let ``Script.minified succeeds`` () =
let html = RenderView.AsString.htmlNode Script.minified
Assert.Equal
("""<script src="https://unpkg.com/htmx.org@1.8.0" integrity="sha384-cZuAZ+ZbwkNRnrKi05G/fjBX+azI9DNOkNYysZ0I/X5ZFgsmMiBXgDZof30F5ofc" crossorigin="anonymous"></script>""",
html)
[<Fact>]
let ``Script.unminified succeeds`` () =
let html = RenderView.AsString.htmlNode Script.unminified
Assert.Equal
("""<script src="https://unpkg.com/htmx.org@1.8.0/dist/htmx.js" integrity="sha384-mrsv860ohrJ5KkqRxwXXj6OIT6sONUxOd+1kvbqW351hQd7JlfFnM0tLetA76GU0" crossorigin="anonymous"></script>""",
html)

View File

@@ -1,7 +1,6 @@
<Project Sdk="Microsoft.NET.Sdk"> <Project Sdk="Microsoft.NET.Sdk">
<PropertyGroup> <PropertyGroup>
<TargetFramework>net6.0</TargetFramework>
<GenerateDocumentationFile>true</GenerateDocumentationFile> <GenerateDocumentationFile>true</GenerateDocumentationFile>
<Description>Extensions to Giraffe View Engine to support htmx attributes and their values</Description> <Description>Extensions to Giraffe View Engine to support htmx attributes and their values</Description>
<PackageReadmeFile>README.md</PackageReadmeFile> <PackageReadmeFile>README.md</PackageReadmeFile>
@@ -16,4 +15,8 @@
<PackageReference Include="Giraffe.ViewEngine" Version="1.4.0" /> <PackageReference Include="Giraffe.ViewEngine" Version="1.4.0" />
</ItemGroup> </ItemGroup>
<ItemGroup>
<ProjectReference Include="..\Common\Giraffe.Htmx.Common.fsproj" />
</ItemGroup>
</Project> </Project>

View File

@@ -2,213 +2,293 @@
/// Serialize a list of key/value pairs to JSON (very rudimentary) /// Serialize a list of key/value pairs to JSON (very rudimentary)
let private toJson (kvps : (string * string) list) = let private toJson (kvps : (string * string) list) =
kvps kvps
|> List.map (fun kvp -> sprintf "\"%s\": \"%s\"" (fst kvp) ((snd kvp).Replace ("\"", "\\\""))) |> List.map (fun kvp -> sprintf "\"%s\": \"%s\"" (fst kvp) ((snd kvp).Replace ("\"", "\\\"")))
|> String.concat ", " |> String.concat ", "
|> sprintf "{ %s }" |> sprintf "{ %s }"
/// Valid values for the `hx-encoding` attribute /// Valid values for the `hx-encoding` attribute
[<RequireQualifiedAccess>] [<RequireQualifiedAccess>]
module HxEncoding = module HxEncoding =
/// A standard HTTP form
let Form = "application/x-www-form-urlencoded" /// A standard HTTP form
/// A multipart form (used for file uploads) let Form = "application/x-www-form-urlencoded"
let MultipartForm = "multipart/form-data"
/// A multipart form (used for file uploads)
let MultipartForm = "multipart/form-data"
/// Helper to create the `hx-headers` attribute /// Helper to create the `hx-headers` attribute
[<RequireQualifiedAccess>] [<RequireQualifiedAccess>]
module HxHeaders = module HxHeaders =
/// Create headers from a list of key/value pairs
let From = toJson /// Create headers from a list of key/value pairs
let From = toJson
/// Values / helpers for the `hx-params` attribute /// Values / helpers for the `hx-params` attribute
[<RequireQualifiedAccess>] [<RequireQualifiedAccess>]
module HxParams = module HxParams =
/// Include all parameters
let All = "*" /// Include all parameters
/// Include no parameters let All = "*"
let None = "none"
/// Include the specified parameters /// Include no parameters
let With fields = match fields with [] -> "" | _ -> fields |> List.reduce (fun acc it -> $"{acc},{it}") let None = "none"
/// Exclude the specified parameters
let Except fields = With fields |> sprintf "not %s" /// Include the specified parameters
let With fields = match fields with [] -> "" | _ -> fields |> List.reduce (fun acc it -> $"{acc},{it}")
/// Exclude the specified parameters
let Except fields = With fields |> sprintf "not %s"
/// Helpers to define `hx-request` attribute values /// Helpers to define `hx-request` attribute values
[<RequireQualifiedAccess>] [<RequireQualifiedAccess>]
module HxRequest = module HxRequest =
/// Convert a boolean to its lowercase string equivalent
let private toLowerBool (it : bool) =
(string it).ToLowerInvariant ()
/// Configure the request with various options
let Configure (opts : string list) =
opts
|> String.concat ", "
|> sprintf "{ %s }"
/// Set a timeout (in milliseconds)
let Timeout (ms : int) = $"\"timeout\": {ms}"
/// Include or exclude credentials from the request
let Credentials = toLowerBool >> sprintf "\"credentials\": %s"
/// Exclude or include headers from the request
let NoHeaders = toLowerBool >> sprintf "\"noHeaders\": %s"
/// Convert a boolean to its lowercase string equivalent
let private toLowerBool (it : bool) =
(string it).ToLowerInvariant ()
/// Valid values for the `hx-swap` attribute (may be combined with swap/settle/scroll/show config) /// Configure the request with various options
[<RequireQualifiedAccess>] let Configure (opts : string list) =
module HxSwap = opts
/// The default, replace the inner html of the target element |> String.concat ", "
let InnerHtml = "innerHTML" |> sprintf "{ %s }"
/// Replace the entire target element with the response
let OuterHtml = "outerHTML" /// Set a timeout (in milliseconds)
/// Insert the response before the target element let Timeout (ms : int) = $"\"timeout\": {ms}"
let BeforeBegin = "beforebegin"
/// Insert the response before the first child of the target element /// Include or exclude credentials from the request
let AfterBegin = "afterbegin" let Credentials = toLowerBool >> sprintf "\"credentials\": %s"
/// Insert the response after the last child of the target element
let BeforeEnd = "beforeend" /// Exclude or include headers from the request
/// Insert the response after the target element let NoHeaders = toLowerBool >> sprintf "\"noHeaders\": %s"
let AfterEnd = "afterend"
/// Does not append content from response (out of band items will still be processed).
let None = "none"
/// Helpers for the `hx-trigger` attribute /// Helpers for the `hx-trigger` attribute
[<RequireQualifiedAccess>] [<RequireQualifiedAccess>]
module HxTrigger = module HxTrigger =
/// Append a filter to a trigger
let private appendFilter filter (trigger : string) = /// Append a filter to a trigger
match trigger.Contains "[" with let private appendFilter filter (trigger : string) =
| true -> match trigger.Contains "[" with
let parts = trigger.Split ('[', ']') | true ->
$"{parts.[0]}[{parts.[1]}&&{filter}]" let parts = trigger.Split ('[', ']')
| false -> $"{trigger}[{filter}]" $"{parts[0]}[{parts[1]}&&{filter}]"
/// Trigger the event on a click | false -> $"{trigger}[{filter}]"
let Click = "click"
/// Trigger the event on page load /// Trigger the event on a click
let Load = "load" let Click = "click"
/// Trigger the event when the item is visible
let Revealed = "revealed" /// Trigger the event on page load
/// Trigger this event every [timing declaration] let Load = "load"
let Every (duration : string) = $"every {duration}"
/// Helpers for defining filters /// Trigger the event when the item is visible
module Filter = let Revealed = "revealed"
/// Only trigger the event if the `ALT` key is pressed
let Alt = appendFilter "altKey" /// Trigger this event every [timing declaration]
/// Only trigger the event if the `CTRL` key is pressed let Every (duration : string) = $"every {duration}"
let Ctrl = appendFilter "ctrlKey"
/// Only trigger the event if the `SHIFT` key is pressed /// Helpers for defining filters
let Shift = appendFilter "shiftKey" module Filter =
/// Only trigger the event if `CTRL+ALT` are pressed
let CtrlAlt = Ctrl >> Alt /// Only trigger the event if the `ALT` key is pressed
/// Only trigger the event if `CTRL+SHIFT` are pressed let Alt = appendFilter "altKey"
let CtrlShift = Ctrl >> Shift
/// Only trigger the event if `CTRL+ALT+SHIFT` are pressed /// Only trigger the event if the `CTRL` key is pressed
let CtrlAltShift = CtrlAlt >> Shift let Ctrl = appendFilter "ctrlKey"
/// Only trigger the event if `ALT+SHIFT` are pressed
let AltShift = Alt >> Shift /// Only trigger the event if the `SHIFT` key is pressed
/// Append a modifier to the current trigger let Shift = appendFilter "shiftKey"
let private appendModifier modifier current =
match current with "" -> modifier | _ -> $"{current} {modifier}" /// Only trigger the event if `CTRL+ALT` are pressed
/// Only trigger once let CtrlAlt = Ctrl >> Alt
let Once = appendModifier "once"
/// Trigger when changed /// Only trigger the event if `CTRL+SHIFT` are pressed
let Changed = appendModifier "changed" let CtrlShift = Ctrl >> Shift
/// Delay execution; resets every time the event is seen
let Delay = sprintf "delay:%s" >> appendModifier /// Only trigger the event if `CTRL+ALT+SHIFT` are pressed
/// Throttle execution; ignore other events, fire when duration passes let CtrlAltShift = CtrlAlt >> Shift
let Throttle = sprintf "throttle:%s" >> appendModifier
/// Trigger this event from a CSS selector /// Only trigger the event if `ALT+SHIFT` are pressed
let From = sprintf "from:%s" >> appendModifier let AltShift = Alt >> Shift
/// Trigger this event from the `document` object
let FromDocument = From "document" /// Append a modifier to the current trigger
/// Trigger this event from the `window` object let private appendModifier modifier current =
let FromWindow = From "window" if current = "" then modifier else $"{current} {modifier}"
/// Trigger this event from the closest parent CSS selector
let FromClosest = sprintf "closest %s" >> From /// Only trigger once
/// Trigger this event from the closest child CSS selector let Once = appendModifier "once"
let FromFind = sprintf "find %s" >> From
/// Target the given CSS selector with the results of this event /// Trigger when changed
let Target = sprintf "target:%s" >> appendModifier let Changed = appendModifier "changed"
/// Prevent any further events from occurring after this one fires
let Consume = appendModifier "consume" /// Delay execution; resets every time the event is seen
/// Configure queueing when events fire when others are in flight; if unspecified, the default is "last" let Delay = sprintf "delay:%s" >> appendModifier
let Queue = sprintf "queue:%s" >> appendModifier
/// Queue the first event, discard all others (i.e., a FIFO queue of 1) /// Throttle execution; ignore other events, fire when duration passes
let QueueFirst = Queue "first" let Throttle = sprintf "throttle:%s" >> appendModifier
/// Queue the last event; discards current when another is received (i.e., a LIFO queue of 1)
let QueueLast = Queue "last" /// Trigger this event from a CSS selector
/// Queue all events; discard none let From = sprintf "from:%s" >> appendModifier
let QueueAll = Queue "all"
/// Queue no events; discard all /// Trigger this event from the `document` object
let QueueNone = Queue "none" let FromDocument = From "document"
/// Trigger this event from the `window` object
let FromWindow = From "window"
/// Trigger this event from the closest parent CSS selector
let FromClosest = sprintf "closest %s" >> From
/// Trigger this event from the closest child CSS selector
let FromFind = sprintf "find %s" >> From
/// Target the given CSS selector with the results of this event
let Target = sprintf "target:%s" >> appendModifier
/// Prevent any further events from occurring after this one fires
let Consume = appendModifier "consume"
/// Configure queueing when events fire when others are in flight; if unspecified, the default is "last"
let Queue = sprintf "queue:%s" >> appendModifier
/// Queue the first event, discard all others (i.e., a FIFO queue of 1)
let QueueFirst = Queue "first"
/// Queue the last event; discards current when another is received (i.e., a LIFO queue of 1)
let QueueLast = Queue "last"
/// Queue all events; discard none
let QueueAll = Queue "all"
/// Queue no events; discard all
let QueueNone = Queue "none"
/// Helper to create the `hx-vals` attribute /// Helper to create the `hx-vals` attribute
[<RequireQualifiedAccess>] [<RequireQualifiedAccess>]
module HxVals = module HxVals =
/// Create values from a list of key/value pairs
let From = toJson /// Create values from a list of key/value pairs
let From = toJson
/// Attributes and flags for HTMX /// Attributes and flags for htmx
[<AutoOpen>] [<AutoOpen>]
module HtmxAttrs = module HtmxAttrs =
/// Progressively enhances anchors and forms to use AJAX requests (use `_hxNoBoost` to set to false)
let _hxBoost = attr "hx-boost" "true" /// Progressively enhances anchors and forms to use AJAX requests (use `_hxNoBoost` to set to false)
/// Shows a confirm() dialog before issuing a request let _hxBoost = attr "hx-boost" "true"
let _hxConfirm = attr "hx-confirm"
/// Issues a DELETE to the specified URL /// Shows a confirm() dialog before issuing a request
let _hxDelete = attr "hx-delete" let _hxConfirm = attr "hx-confirm"
/// Disables htmx processing for the given node and any children nodes
let _hxDisable = flag "hx-disable" /// Issues a DELETE to the specified URL
/// Changes the request encoding type let _hxDelete = attr "hx-delete"
let _hxEncoding = attr "hx-encoding"
/// Extensions to use for this element /// Disables htmx processing for the given node and any children nodes
let _hxExt = attr "hx-ext" let _hxDisable = flag "hx-disable"
/// Issues a GET to the specified URL
let _hxGet = attr "hx-get" /// Disinherit all ("*") or specific htmx attributes
/// Adds to the headers that will be submitted with the request let _hxDisinherit = attr "hx-disinherit"
let _hxHeaders = attr "hx-headers"
/// The element to snapshot and restore during history navigation /// Changes the request encoding type
let _hxHistoryElt = flag "hx-history-elt" let _hxEncoding = attr "hx-encoding"
/// Includes additional data in AJAX requests
let _hxInclude = attr "hx-include" /// Extensions to use for this element
/// The element to put the htmx-request class on during the AJAX request let _hxExt = attr "hx-ext"
let _hxIndicator = attr "hx-indicator"
/// Overrides a previous `hx-boost` /// Issues a GET to the specified URL
let _hxNoBoost = attr "hx-boost" "false" let _hxGet = attr "hx-get"
/// Filters the parameters that will be submitted with a request
let _hxParams = attr "hx-params" /// Adds to the headers that will be submitted with the request
/// Issues a PATCH to the specified URL let _hxHeaders = attr "hx-headers"
let _hxPatch = attr "hx-patch"
/// Issues a POST to the specified URL /// The element to snapshot and restore during history navigation
let _hxPost = attr "hx-post" let _hxHistoryElt = flag "hx-history-elt"
/// Preserves an element between requests
let _hxPreserve = attr "hx-preserve" "true" /// Includes additional data in AJAX requests
/// Shows a prompt before submitting a request let _hxInclude = attr "hx-include"
let _hxPrompt = attr "hx-prompt"
/// Pushes the URL into the location bar, creating a new history entry /// The element to put the htmx-request class on during the AJAX request
let _hxPushUrl = flag "hx-push-url" let _hxIndicator = attr "hx-indicator"
/// Issues a PUT to the specified URL
let _hxPut = attr "hx-put" /// Overrides a previous `hx-boost`
/// Configures various aspects of the request let _hxNoBoost = attr "hx-boost" "false"
let _hxRequest = attr "hx-request"
/// Selects a subset of the server response to process /// Filters the parameters that will be submitted with a request
let _hxSelect = attr "hx-select" let _hxParams = attr "hx-params"
/// Establishes and listens to Server Sent Event (SSE) sources for events
let _hxSse = attr "hx-sse" /// Issues a PATCH to the specified URL
/// Controls how the response content is swapped into the DOM (e.g. 'outerHTML' or 'beforeEnd') let _hxPatch = attr "hx-patch"
let _hxSwap = attr "hx-swap"
/// Marks content in a response as being "Out of Band", i.e. swapped somewhere other than the target /// Issues a POST to the specified URL
let _hxSwapOob = attr "hx-swap-oob" let _hxPost = attr "hx-post"
/// Specifies the target element to be swapped
let _hxTarget = attr "hx-target" /// Preserves an element between requests
/// Specifies the event that triggers the request let _hxPreserve = attr "hx-preserve" "true"
let _hxTrigger = attr "hx-trigger"
/// Adds to the parameters that will be submitted with the request /// Shows a prompt before submitting a request
let _hxVals = attr "hx-vals" let _hxPrompt = attr "hx-prompt"
/// Establishes a WebSocket or sends information to one
let _hxWs = attr "hx-ws" /// Pushes the URL into the location bar, creating a new history entry
let _hxPushUrl = attr "hx-push-url"
/// Issues a PUT to the specified URL
let _hxPut = attr "hx-put"
/// Replaces the current URL in the browser's history stack
let _hxReplaceUrl = attr "hx-replace-url"
/// Configures various aspects of the request
let _hxRequest = attr "hx-request"
/// Selects a subset of the server response to process
let _hxSelect = attr "hx-select"
/// Selects a subset of an out-of-band server response
let _hxSelectOob = attr "hx-select-oob"
/// Establishes and listens to Server Sent Event (SSE) sources for events
let _hxSse = attr "hx-sse"
/// Controls how the response content is swapped into the DOM (e.g. 'outerHTML' or 'beforeEnd')
let _hxSwap = attr "hx-swap"
/// Marks content in a response as being "Out of Band", i.e. swapped somewhere other than the target
let _hxSwapOob = attr "hx-swap-oob"
/// Synchronize events based on another element
let _hxSync = attr "hx-sync"
/// Specifies the target element to be swapped
let _hxTarget = attr "hx-target"
/// Specifies the event that triggers the request
let _hxTrigger = attr "hx-trigger"
/// Adds to the parameters that will be submitted with the request
let _hxVals = attr "hx-vals"
/// Establishes a WebSocket or sends information to one
let _hxWs = attr "hx-ws"
/// Script tags to pull htmx into an web page
module Script =
/// Script tag to load the minified version from unpkg.com
let minified =
script [ _src "https://unpkg.com/htmx.org@1.8.0"
_integrity "sha384-cZuAZ+ZbwkNRnrKi05G/fjBX+azI9DNOkNYysZ0I/X5ZFgsmMiBXgDZof30F5ofc"
_crossorigin "anonymous" ] []
/// Script tag to load the unminified version from unpkg.com
let unminified =
script [ _src "https://unpkg.com/htmx.org@1.8.0/dist/htmx.js"
_integrity "sha384-mrsv860ohrJ5KkqRxwXXj6OIT6sONUxOd+1kvbqW351hQd7JlfFnM0tLetA76GU0"
_crossorigin "anonymous" ] []

View File

@@ -2,6 +2,8 @@
This package enables [htmx](https://htmx.org) support within the [Giraffe](https://giraffe.wiki) view engine. This package enables [htmx](https://htmx.org) support within the [Giraffe](https://giraffe.wiki) view engine.
**htmx version: 1.8.0**
### Setup ### Setup
1. Install the package. 1. Install the package.
@@ -21,10 +23,12 @@ Support modules include:
- `HxHeaders` - `HxHeaders`
- `HxParams` - `HxParams`
- `HxRequest` - `HxRequest`
- `HxSwap` - `HxSwap` (requires `open Giraffe.Htmx`)
- `HxTrigger` - `HxTrigger`
- `HxVals` - `HxVals`
There are two `XmlNode`s that will load the htmx script from unpkg; `Htmx.Script.minified` loads the minified version, and `Htmx.Script.unminified` loads the unminified version (useful for debugging).
### Learn ### Learn
htmx's attributes and these attribute functions map one-to-one. The lone exception is `_hxBoost`, which implies `true`; use `_hxNoBoost` to set it to `false`. The support modules contain named properties for known values (as illustrated with `HxTrigger.Load` above). A few of the modules are more than collections of names, though: htmx's attributes and these attribute functions map one-to-one. The lone exception is `_hxBoost`, which implies `true`; use `_hxNoBoost` to set it to `false`. The support modules contain named properties for known values (as illustrated with `HxTrigger.Load` above). A few of the modules are more than collections of names, though: