Anchor element has no href when no link provided

Author: linkdotnet

src/LinkDotNet.Blog.Web/Features/Home/Components/Anchor.razor

@@ -0,0 +1,18 @@
+@if (string.IsNullOrEmpty(Href))
+{
+    <a class="@CssClass">@ChildContent</a>
+}
+else
+{
+    <a class="@CssClass" href="@Href">@ChildContent</a>
+}
+@code {
+    [Parameter]
+    public string CssClass { get; set; }
+    
+    [Parameter]
+    public string Href { get; set; }
+    
+    [Parameter]
+    public RenderFragment ChildContent { get; set; } 
+}

src/LinkDotNet.Blog.Web/Features/Home/Components/BlogPostNavigation.razor

@@ -3,18 +3,18 @@
     <nav aria-label="Page navigation">
         <ul class="pagination justify-content-center">
             <li class="page-item @(!PageList.IsFirstPage && PageList.Count > 0 ? string.Empty : "disabled")">
-                <a class="page-link" href="@PreviousPageLink" tabindex="-1">Previous</a>
+                <Anchor CssClass="page-link" Href="@PreviousPageLink">Previous</Anchor>
             </li>
             <li class="page-item @(!PageList.IsLastPage && PageList.Count > 0 ? string.Empty : "disabled")">
-                <a class="page-link" href="@NextPageLink">Next</a>
+                <Anchor CssClass="page-link" Href="@NextPageLink">Next</Anchor>
             </li>
         </ul>
     </nav>
 
-    @code {
-        [Parameter]
-        public IPagedList<BlogPost> PageList { get; set; }
+@code {
+    [Parameter]
+    public IPagedList<BlogPost> PageList { get; set; }
 
-        private string PreviousPageLink => PageList.IsFirstPage ? string.Empty : $"/{PageList.PageNumber - 1}";
-        private string NextPageLink => PageList.IsLastPage ? string.Empty : $"/{PageList.PageNumber + 1}";
-    }
+    private string PreviousPageLink => PageList.IsFirstPage ? string.Empty : $"/{PageList.PageNumber - 1}";
+    private string NextPageLink => PageList.IsLastPage ? string.Empty : $"/{PageList.PageNumber + 1}";
+}

tests/LinkDotNet.Blog.UnitTests/Web/Features/Home/Components/AnchorTests.cs

@@ -0,0 +1,35 @@
+using System.Linq;
+using AngleSharp.Html.Dom;
+using AngleSharpWrappers;
+using Bunit;
+using LinkDotNet.Blog.Web.Features.Home.Components;
+
+namespace LinkDotNet.Blog.UnitTests.Web.Features.Home.Components;
+
+public class AnchorTests : TestContext
+{
+    [Fact]
+    public void ShouldShowHrefWhenNotEmpty()
+    {
+        var cut = RenderComponent<Anchor>(ps => ps
+            .Add(p => p.Href, "http://url/")
+            .Add(p => p.CssClass, "page"));
+
+        var anchor = cut.Find("a").Unwrap() as IHtmlAnchorElement;
+        anchor.Should().NotBeNull();
+        anchor.Href.Should().Be("http://url/");
+        anchor.GetAttribute("class").Should().Be("page");
+    }
+
+    [Fact]
+    public void ShouldNotShowHrefWhenEmpty()
+    {
+        var cut = RenderComponent<Anchor>(ps => ps
+            .Add(p => p.Href, string.Empty)
+            .Add(p => p.CssClass, "page"));
+
+        var anchor = cut.Find("a").Unwrap() as IHtmlAnchorElement;
+        anchor.Should().NotBeNull();
+        anchor.Attributes.Count(a => a.Name == "href").Should().Be(0);
+    }
+}