Add tests for attribute rendering
This commit is contained in:
parent
f3fb675b1f
commit
f0aa1a41d7
2
.gitignore
vendored
2
.gitignore
vendored
|
@ -3,3 +3,5 @@
|
||||||
|
|
||||||
.fake
|
.fake
|
||||||
.ionide
|
.ionide
|
||||||
|
.idea
|
||||||
|
*.user
|
||||||
|
|
|
@ -13,6 +13,7 @@
|
||||||
</ItemGroup>
|
</ItemGroup>
|
||||||
|
|
||||||
<ItemGroup>
|
<ItemGroup>
|
||||||
|
<PackageReference Include="Giraffe.ViewEngine" Version="1.4.0" />
|
||||||
<PackageReference Include="Microsoft.NET.Test.Sdk" Version="16.11.0" />
|
<PackageReference Include="Microsoft.NET.Test.Sdk" Version="16.11.0" />
|
||||||
<PackageReference Include="xunit" Version="2.4.1" />
|
<PackageReference Include="xunit" Version="2.4.1" />
|
||||||
<PackageReference Include="xunit.runner.visualstudio" Version="2.4.3">
|
<PackageReference Include="xunit.runner.visualstudio" Version="2.4.3">
|
||||||
|
@ -25,4 +26,8 @@
|
||||||
</PackageReference>
|
</PackageReference>
|
||||||
</ItemGroup>
|
</ItemGroup>
|
||||||
|
|
||||||
|
<ItemGroup>
|
||||||
|
<ProjectReference Include="..\ViewEngine.Htmx\Giraffe.ViewEngine.Htmx.fsproj" />
|
||||||
|
</ItemGroup>
|
||||||
|
|
||||||
</Project>
|
</Project>
|
||||||
|
|
|
@ -1,8 +1,125 @@
|
||||||
module Tests
|
module Giraffe.ViewEngine.Htmx.Tests
|
||||||
|
|
||||||
open System
|
open Giraffe.ViewEngine
|
||||||
open Xunit
|
open Xunit
|
||||||
|
|
||||||
|
/// Tests for the HtmxAttrs module
|
||||||
|
module Attributes =
|
||||||
|
|
||||||
|
/// Pipe-able assertion for a rendered node
|
||||||
|
let shouldRender expected node = Assert.Equal (expected, RenderView.AsString.htmlNode node)
|
||||||
|
|
||||||
[<Fact>]
|
[<Fact>]
|
||||||
let ``My test`` () =
|
let ``_hxBoost succeeds`` () =
|
||||||
Assert.True(true)
|
div [ _hxBoost ] [] |> shouldRender """<div hx-boost="true"></div>"""
|
||||||
|
|
||||||
|
[<Fact>]
|
||||||
|
let ``_hxConfirm succeeds`` () =
|
||||||
|
button [ _hxConfirm "REALLY?!?" ] [] |> shouldRender """<button hx-confirm="REALLY?!?"></button>"""
|
||||||
|
|
||||||
|
[<Fact>]
|
||||||
|
let ``_hxDelete succeeds`` () =
|
||||||
|
span [ _hxDelete "/this-endpoint" ] [] |> shouldRender """<span hx-delete="/this-endpoint"></span>"""
|
||||||
|
|
||||||
|
[<Fact>]
|
||||||
|
let ``_hxDisable succeeds`` () =
|
||||||
|
p [ _hxDisable ] [] |> shouldRender """<p hx-disable></p>"""
|
||||||
|
|
||||||
|
[<Fact>]
|
||||||
|
let ``_hxEncoding succeeds`` () =
|
||||||
|
form [ _hxEncoding "utf-7" ] [] |> shouldRender """<form hx-encoding="utf-7"></form>"""
|
||||||
|
|
||||||
|
[<Fact>]
|
||||||
|
let ``_hxExt succeeds`` () =
|
||||||
|
section [ _hxExt "extendme" ] [] |> shouldRender """<section hx-ext="extendme"></section>"""
|
||||||
|
|
||||||
|
[<Fact>]
|
||||||
|
let ``_hxGet succeeds`` () =
|
||||||
|
article [ _hxGet "/the-text" ] [] |> shouldRender """<article hx-get="/the-text"></article>"""
|
||||||
|
|
||||||
|
[<Fact>]
|
||||||
|
let ``_hxHeaders succeeds`` () =
|
||||||
|
figure [ _hxHeaders """{ "X-Special-Header": "some-header" }""" ] []
|
||||||
|
|> shouldRender """<figure hx-headers="{ "X-Special-Header": "some-header" }"></figure>"""
|
||||||
|
|
||||||
|
[<Fact>]
|
||||||
|
let ``_hxHistoryElt succeeds`` () =
|
||||||
|
table [ _hxHistoryElt ] [] |> shouldRender """<table hx-history-elt></table>"""
|
||||||
|
|
||||||
|
[<Fact>]
|
||||||
|
let ``_hxInclude succeeds`` () =
|
||||||
|
a [ _hxInclude ".extra-stuff" ] [] |> shouldRender """<a hx-include=".extra-stuff"></a>"""
|
||||||
|
|
||||||
|
[<Fact>]
|
||||||
|
let ``_hxIndicator succeeds`` () =
|
||||||
|
aside [ _hxIndicator "#spinner" ] [] |> shouldRender """<aside hx-indicator="#spinner"></aside>"""
|
||||||
|
|
||||||
|
[<Fact>]
|
||||||
|
let ``_hxNoBoost succeeds`` () =
|
||||||
|
td [ _hxNoBoost ] [] |> shouldRender """<td hx-boost="false"></td>"""
|
||||||
|
|
||||||
|
[<Fact>]
|
||||||
|
let ``_hxParams succeeds`` () =
|
||||||
|
br [ _hxParams "[p1,p2]" ] |> shouldRender """<br hx-params="[p1,p2]">"""
|
||||||
|
|
||||||
|
[<Fact>]
|
||||||
|
let ``_hxPatch succeeds`` () =
|
||||||
|
div [ _hxPatch "/arrrgh" ] [] |> shouldRender """<div hx-patch="/arrrgh"></div>"""
|
||||||
|
|
||||||
|
[<Fact>]
|
||||||
|
let ``_hxPost succeeds`` () =
|
||||||
|
hr [ _hxPost "/hear-ye-hear-ye" ] |> shouldRender """<hr hx-post="/hear-ye-hear-ye">"""
|
||||||
|
|
||||||
|
[<Fact>]
|
||||||
|
let ``_hxPreserve succeeds`` () =
|
||||||
|
img [ _hxPreserve ] |> shouldRender """<img hx-preserve="true">"""
|
||||||
|
|
||||||
|
[<Fact>]
|
||||||
|
let ``_hxPrompt succeeds`` () =
|
||||||
|
strong [ _hxPrompt "Who goes there?" ] [] |> shouldRender """<strong hx-prompt="Who goes there?"></strong>"""
|
||||||
|
|
||||||
|
[<Fact>]
|
||||||
|
let ``_hxPushUrl succeeds`` () =
|
||||||
|
dl [ _hxPushUrl ] [] |> shouldRender """<dl hx-push-url></dl>"""
|
||||||
|
|
||||||
|
[<Fact>]
|
||||||
|
let ``_hxPut succeeds`` () =
|
||||||
|
s [ _hxPut "/take-this" ] [] |> shouldRender """<s hx-put="/take-this"></s>"""
|
||||||
|
|
||||||
|
[<Fact>]
|
||||||
|
let ``_hxRequest succeeds`` () =
|
||||||
|
u [ _hxRequest "noHeaders" ] [] |> shouldRender """<u hx-request="noHeaders"></u>"""
|
||||||
|
|
||||||
|
[<Fact>]
|
||||||
|
let ``_hxSelect succeeds`` () =
|
||||||
|
nav [ _hxSelect "#navbar" ] [] |> shouldRender """<nav hx-select="#navbar"></nav>"""
|
||||||
|
|
||||||
|
[<Fact>]
|
||||||
|
let ``_hxSse succeeds`` () =
|
||||||
|
footer [ _hxSse "connect:/my-events" ] [] |> shouldRender """<footer hx-sse="connect:/my-events"></footer>"""
|
||||||
|
|
||||||
|
[<Fact>]
|
||||||
|
let ``_hxSwap succeeds`` () =
|
||||||
|
del [ _hxSwap "innerHTML" ] [] |> shouldRender """<del hx-swap="innerHTML"></del>"""
|
||||||
|
|
||||||
|
[<Fact>]
|
||||||
|
let ``_hxSwapOob succeeds`` () =
|
||||||
|
li [ _hxSwapOob "true" ] [] |> shouldRender """<li hx-swap-oob="true"></li>"""
|
||||||
|
|
||||||
|
[<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="{ "extra": "values" }"></dt>"""
|
||||||
|
|
||||||
|
[<Fact>]
|
||||||
|
let ``_hxWs succeeds`` () =
|
||||||
|
ul [ _hxWs "connect:/web-socket" ] [] |> shouldRender """<ul hx-ws="connect:/web-socket"></ul>"""
|
||||||
|
|
|
@ -50,8 +50,8 @@ module HxTrigger =
|
||||||
match trigger.Contains "[" with
|
match trigger.Contains "[" with
|
||||||
| true ->
|
| true ->
|
||||||
let parts = trigger.Split ('[', ']')
|
let parts = trigger.Split ('[', ']')
|
||||||
sprintf "%s[%s&&%s]" parts.[0] parts.[1] filter
|
$"{parts.[0]}[{parts.[1]}&&{filter}]"
|
||||||
| false -> sprintf "%s[%s]" trigger filter
|
| false -> $"{trigger}[{filter}]"
|
||||||
/// Trigger the event on a click
|
/// Trigger the event on a click
|
||||||
let Click = "click"
|
let Click = "click"
|
||||||
/// Trigger the event on page load
|
/// Trigger the event on page load
|
||||||
|
@ -81,9 +81,9 @@ module HxTrigger =
|
||||||
/// 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
|
/// Progressively enhances anchors and forms to use AJAX requests (use `_hxNoBoost` to set to false)
|
||||||
let _hxBoost = attr "hx-boost" "true"
|
let _hxBoost = attr "hx-boost" "true"
|
||||||
/// Shows a confim() dialog before issuing a request
|
/// Shows a confirm() dialog before issuing a request
|
||||||
let _hxConfirm = attr "hx-confirm"
|
let _hxConfirm = attr "hx-confirm"
|
||||||
/// Issues a DELETE to the specified URL
|
/// Issues a DELETE to the specified URL
|
||||||
let _hxDelete = attr "hx-delete"
|
let _hxDelete = attr "hx-delete"
|
||||||
|
@ -103,6 +103,8 @@ module HtmxAttrs =
|
||||||
let _hxInclude = attr "hx-include"
|
let _hxInclude = attr "hx-include"
|
||||||
/// The element to put the htmx-request class on during the AJAX request
|
/// The element to put the htmx-request class on during the AJAX request
|
||||||
let _hxIndicator = attr "hx-indicator"
|
let _hxIndicator = attr "hx-indicator"
|
||||||
|
/// Overrides a previous `hx-boost`
|
||||||
|
let _hxNoBoost = attr "hx-boost" "false"
|
||||||
/// Filters the parameters that will be submitted with a request
|
/// Filters the parameters that will be submitted with a request
|
||||||
let _hxParams = attr "hx-params"
|
let _hxParams = attr "hx-params"
|
||||||
/// Issues a PATCH to the specified URL
|
/// Issues a PATCH to the specified URL
|
||||||
|
@ -123,10 +125,10 @@ module HtmxAttrs =
|
||||||
let _hxSelect = attr "hx-select"
|
let _hxSelect = attr "hx-select"
|
||||||
/// Establishes and listens to Server Sent Event (SSE) sources for events
|
/// Establishes and listens to Server Sent Event (SSE) sources for events
|
||||||
let _hxSse = attr "hx-sse"
|
let _hxSse = attr "hx-sse"
|
||||||
/// Marks content in a response as being "Out of Band", i.e. swapped somewhere other than the target
|
|
||||||
let _hxSwapOob = attr "hx-swap-oob"
|
|
||||||
/// Controls how the response content is swapped into the DOM (e.g. 'outerHTML' or 'beforeEnd')
|
/// Controls how the response content is swapped into the DOM (e.g. 'outerHTML' or 'beforeEnd')
|
||||||
let _hxSwap = attr "hx-swap"
|
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"
|
||||||
/// Specifies the target element to be swapped
|
/// Specifies the target element to be swapped
|
||||||
let _hxTarget = attr "hx-target"
|
let _hxTarget = attr "hx-target"
|
||||||
/// Specifies the event that triggers the request
|
/// Specifies the event that triggers the request
|
||||||
|
|
Loading…
Reference in New Issue
Block a user