Link: automatically add rel tag (#5576)

* Add a rel tag when target is set to _blank * release notes
Megabit · Jun 19, 2024 · 27c829e · 27c829e
1 parent 8dfc561
commit 27c829e
Show file tree

Hide file tree

Showing 9 changed files with 37 additions and 5 deletions.
diff --git a/Documentation/Blazorise.Docs/Pages/News/2024-07-15-release-notes-160.razor b/Documentation/Blazorise.Docs/Pages/News/2024-07-15-release-notes-160.razor
@@ -107,6 +107,14 @@
     Added a new <Code>SetLoading</Code> so you're able to control the loading state of the DataGrid.
 </Paragraph>
 
+<Heading Size="HeadingSize.Is4">
+    Automatic <Code>rel</Code> Attribute for Blazorise Link Component
+</Heading>
+
+<Paragraph>
+    Links with <Code>Target="Target.Blank"</Code> now automatically include <Code>rel="noopener noreferrer"</Code> for enhanced security and privacy. This update prevents new pages from accessing the original page, reducing phishing risks, and ensures referrer information is not sent to the target site, thereby enhancing the security and privacy of external links by default.
+</Paragraph>
+
 <Heading>
     Wrap Up
 </Heading>

diff --git a/Source/Blazorise.AntDesign/Components/CardLink.razor b/Source/Blazorise.AntDesign/Components/CardLink.razor
@@ -1,4 +1,4 @@
 @inherits Blazorise.CardLink
-<a @ref="@ElementRef" id="@ElementId" class="@ClassNames" href="@To" title="@Title" target="@TargetName" style="@StyleNames" @attributes="@Attributes">
+<a @ref="@ElementRef" id="@ElementId" class="@ClassNames" href="@To" rel="@GetRel()" title="@Title" target="@TargetName" style="@StyleNames" @attributes="@Attributes">
     @ChildContent
 </a>
diff --git a/Source/Blazorise.Tailwind/Components/_BarOnlyLink.razor b/Source/Blazorise.Tailwind/Components/_BarOnlyLink.razor
@@ -1,6 +1,6 @@
 @using Blazorise.Utilities;
 @inherits Blazorise.BaseLinkComponent
-<a id="@ElementId" href="@To" class="@ClassNames" style="@StyleNames" title="@Title" target="@TargetName" @onclick="@OnClickHandler" @onclick:preventDefault="@PreventDefault" @attributes="@Attributes">
+<a id="@ElementId" href="@To" rel="@GetRel()" class="@ClassNames" style="@StyleNames" title="@Title" target="@TargetName" @onclick="@OnClickHandler" @onclick:preventDefault="@PreventDefault" @attributes="@Attributes">
     @ChildContent
 </a>
 @code {

diff --git a/Source/Blazorise/Base/BaseLinkComponent.cs b/Source/Blazorise/Base/BaseLinkComponent.cs
@@ -215,6 +215,14 @@ private static bool IsStrictlyPrefixWithSeparator( string value, string prefix )
     /// <returns>Href value.</returns>
     protected string GetTo() => Disabled ? null : To;
 
+    /// <summary>
+    /// Gets the rel attribute value.
+    /// </summary>
+    /// <returns>
+    /// Returns "noopener noreferrer" if the <see cref="Target"/> is set to <see cref="Target.Blank"/>.
+    /// </returns>
+    protected string GetRel() => Target == Target.Blank ? "noopener noreferrer" : null;
+
     #endregion
 
     #region Properties

diff --git a/Source/Blazorise/Components/Bar/BarLink.razor.cs b/Source/Blazorise/Components/Bar/BarLink.razor.cs
@@ -40,6 +40,14 @@ protected Task ClickHandler( MouseEventArgs eventArgs )
         return Clicked.InvokeAsync( eventArgs );
     }
 
+    /// <summary>
+    /// Gets the rel attribute value.
+    /// </summary>
+    /// <returns>
+    /// Returns "noopener noreferrer" if the <see cref="Target"/> is set to <see cref="Target.Blank"/>.
+    /// </returns>
+    protected string GetRel() => Target == Target.Blank ? "noopener noreferrer" : null;
+
     #endregion
 
     #region Properties

diff --git a/Source/Blazorise/Components/Breadcrumb/BreadcrumbLink.razor.cs b/Source/Blazorise/Components/Breadcrumb/BreadcrumbLink.razor.cs
@@ -49,6 +49,14 @@ protected Task ClickHandler( MouseEventArgs eventArgs )
         return Clicked.InvokeAsync( eventArgs );
     }
 
+    /// <summary>
+    /// Gets the rel attribute value.
+    /// </summary>
+    /// <returns>
+    /// Returns "noopener noreferrer" if the <see cref="Target"/> is set to <see cref="Target.Blank"/>.
+    /// </returns>
+    protected string GetRel() => Target == Target.Blank ? "noopener noreferrer" : null;
+
     #endregion
 
     #region Properties

diff --git a/Source/Blazorise/Components/Card/CardLink.razor b/Source/Blazorise/Components/Card/CardLink.razor
@@ -1,5 +1,5 @@
 @namespace Blazorise
 @inherits BaseLinkComponent
-<a @ref="@ElementRef" id="@ElementId" href="@To" class="@ClassNames" style="@StyleNames" title="@Title" target="@TargetName" @onclick="@OnClickHandler" @onclick:preventDefault="@PreventDefault" @attributes="@Attributes">
+<a @ref="@ElementRef" id="@ElementId" href="@To" rel="@GetRel()" class="@ClassNames" style="@StyleNames" title="@Title" target="@TargetName" @onclick="@OnClickHandler" @onclick:preventDefault="@PreventDefault" @attributes="@Attributes">
     @ChildContent
 </a>
diff --git a/Source/Blazorise/Components/Link/Anchor.razor b/Source/Blazorise/Components/Link/Anchor.razor
@@ -1,5 +1,5 @@
 @namespace Blazorise
 @inherits Blazorise.Link
-<a @ref="@ElementRef" id="@ElementId" href="@GetTo()" class="@ClassNames" style="@StyleNames" title="@Title" target="@TargetName" aria-disabled="@AriaDisabledString" @onclick="@OnClickHandler" @onclick:preventDefault="@PreventDefault" @attributes="@Attributes">
+<a @ref="@ElementRef" id="@ElementId" href="@GetTo()" rel="@GetRel()" class="@ClassNames" style="@StyleNames" title="@Title" target="@TargetName" aria-disabled="@AriaDisabledString" @onclick="@OnClickHandler" @onclick:preventDefault="@PreventDefault" @attributes="@Attributes">
     @ChildContent
 </a>
diff --git a/Source/Blazorise/Components/Link/Link.razor b/Source/Blazorise/Components/Link/Link.razor
@@ -1,5 +1,5 @@
 @namespace Blazorise
 @inherits BaseLinkComponent
-<a @ref="@ElementRef" id="@ElementId" href="@GetTo()" class="@ClassNames" style="@StyleNames" title="@Title" target="@TargetName" aria-disabled="@AriaDisabledString" @onclick="@OnClickHandler" @onclick:preventDefault="@PreventDefault" @attributes="@Attributes">
+<a @ref="@ElementRef" id="@ElementId" href="@GetTo()" rel="@GetRel()" class="@ClassNames" style="@StyleNames" title="@Title" target="@TargetName" aria-disabled="@AriaDisabledString" @onclick="@OnClickHandler" @onclick:preventDefault="@PreventDefault" @attributes="@Attributes">
     @ChildContent
 </a>