Skip to content

Commit

Permalink
[JavaScript Caching] Cache management (#2388)
Browse files Browse the repository at this point in the history 
* First tests

* Update Unit Tests

* Update program.cs

* Fix XML Comments

* Update to CollocatedJavaScriptQueryString

* Inject LibraryConfiguration in all associated components and Unit Tests

* Add FormatCollocatedUrl extension method

* Add URL argument in CollocatedJavaScriptQueryString method

* Update FluentTooltip injected service
  • Loading branch information
@dvoituron
dvoituron authored Jul 17, 2024
1 parent 885a031 commit 5110baa
Show file tree
Hide file tree
Showing 58 changed files with 503 additions and 260 deletions.
126 changes: 120 additions & 6 deletions examples/Demo/Shared/Microsoft.FluentUI.AspNetCore.Components.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -95,6 +95,12 @@
Gets or sets the content to be rendered inside the component.
</summary>
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentAnchoredRegion.LibraryConfiguration">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentAnchoredRegion.JSRuntime">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentAnchoredRegion.Module">
<summary />
</member>
Expand Down Expand Up @@ -224,6 +230,12 @@
</summary>
<returns></returns>
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentAnchor.LibraryConfiguration">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentAnchor.JSRuntime">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentAnchor.Download">
<summary>
Prompts the user to save the linked URL. See <see href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a">a element</see> for more information.
Expand Down Expand Up @@ -290,6 +302,9 @@
<member name="M:Microsoft.FluentUI.AspNetCore.Components.FluentAnchor.DisposeAsync">
<inheritdoc />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentAppBar.LibraryConfiguration">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentAppBar.JSRuntime">
<summary />
</member>
Expand Down Expand Up @@ -796,6 +811,9 @@
Gets or sets the content to be rendered inside the component.
</summary>
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentButton.LibraryConfiguration">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentButton.JSRuntime">
<summary />
</member>
Expand Down Expand Up @@ -956,6 +974,9 @@
Gets or sets the content to be rendered inside the component.
</summary>
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentCheckbox.LibraryConfiguration">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentCheckbox.JSRuntime">
<summary />
</member>
Expand Down Expand Up @@ -1712,6 +1733,9 @@
</summary>
<typeparam name="TGridItem">The type of data represented by each row in the grid.</typeparam>
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentDataGrid`1.LibraryConfiguration">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentDataGrid`1.Items">
<summary>
Gets or sets a queryable source of data for the grid.
Expand Down Expand Up @@ -2946,6 +2970,12 @@
Gets or sets the content to be rendered inside the component.
</summary>
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentDesignTheme.LibraryConfiguration">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentDesignTheme.GlobalDesign">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentDesignTheme.JSRuntime">
<summary />
</member>
Expand Down Expand Up @@ -3829,6 +3859,12 @@
An event that will be invoked when showing a dialog with a custom component
</summary>
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentDivider.LibraryConfiguration">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentDivider.JSRuntime">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentDivider.Role">
<summary>
Gets or sets the role of the element.
Expand Down Expand Up @@ -4194,6 +4230,9 @@
that are used for specific screen sizes.
</summary>
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentGrid.LibraryConfiguration">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentGrid.JSRuntime">
<summary />
</member>
Expand Down Expand Up @@ -4354,6 +4393,12 @@
If true, highlights the text until the next regex boundary.
</summary>
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentHorizontalScroll.LibraryConfiguration">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentHorizontalScroll.JSRuntime">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentHorizontalScroll.Speed">
<summary>
Gets or sets the scroll speed in pixels per second.
Expand Down Expand Up @@ -4583,6 +4628,9 @@
<member name="M:Microsoft.FluentUI.AspNetCore.Components.FluentInputFile.#ctor">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentInputFile.LibraryConfiguration">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentInputFile.JSRuntime">
<summary />
</member>
Expand Down Expand Up @@ -4833,6 +4881,9 @@
Prevent multiple KeyDown events.
</summary>
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentKeyCode.LibraryConfiguration">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentKeyCode.JSRuntime">
<summary />
</member>
Expand Down Expand Up @@ -5108,6 +5159,9 @@
Private KeyCodeListener
</summary>
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentInputLabel.LibraryConfiguration">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentInputLabel.JSRuntime">
<summary />
</member>
Expand Down Expand Up @@ -5216,6 +5270,9 @@
Initializes a new instance of the <see cref="T:Microsoft.FluentUI.AspNetCore.Components.FluentAutocomplete`1"/> class.
</summary>
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentAutocomplete`1.LibraryConfiguration">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentAutocomplete`1.JS">
<summary />
</member>
Expand Down Expand Up @@ -5409,6 +5466,9 @@
<member name="M:Microsoft.FluentUI.AspNetCore.Components.FluentAutocomplete`1.RaiseValueTextChangedAsync(System.String)">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentCombobox`1.LibraryConfiguration">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentCombobox`1.JSRuntime">
<summary />
</member>
Expand Down Expand Up @@ -5597,6 +5657,9 @@
</summary>
<typeparam name="TOption"></typeparam>
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.ListComponentBase`1.LibraryConfiguration">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.ListComponentBase`1.StyleValue">
<summary />
</member>
Expand Down Expand Up @@ -5835,6 +5898,9 @@
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentMenu.StyleValue">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentMenu.LibraryConfiguration">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentMenu.JSRuntime">
<summary />
</member>
Expand Down Expand Up @@ -6876,6 +6942,9 @@
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentOverflow.StyleValue">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentOverflow.LibraryConfiguration">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentOverflow.ChildContent">
<summary>
Gets or sets the content to display.
Expand Down Expand Up @@ -7487,6 +7556,9 @@
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentPullToRefresh.StyleValue">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentPullToRefresh.LibraryConfiguration">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentPullToRefresh.Direction">
<summary>
Gets or sets the direction to pull the <see cref="P:Microsoft.FluentUI.AspNetCore.Components.FluentPullToRefresh.ChildContent"/>.
Expand Down Expand Up @@ -7736,6 +7808,9 @@
<member name="M:Microsoft.FluentUI.AspNetCore.Components.FluentRating.UpdateHoverValueAsync(System.Nullable{System.Int32})">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentSearch.LibraryConfiguration">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentSearch.JSRuntime">
<summary />
</member>
Expand Down Expand Up @@ -7859,6 +7934,9 @@
<param name = "value">The value to format.</param>
<returns>A string representation of the value.</returns>
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentSliderLabel`1.LibraryConfiguration">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentSliderLabel`1.JSRuntime">
<summary />
</member>
Expand Down Expand Up @@ -7888,6 +7966,12 @@
<member name="M:Microsoft.FluentUI.AspNetCore.Components.FluentSliderLabel`1.OnAfterRenderAsync(System.Boolean)">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentSortableList`1.LibraryConfiguration">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentSortableList`1.JSRuntime">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentSortableList`1.ItemTemplate">
<summary>
Gets or sets the template to be used to define each sortable item in the list.
Expand Down Expand Up @@ -7979,6 +8063,15 @@
Gets or sets the width of the spacer (in pixels).
</summary>
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentMultiSplitter.LibraryConfiguration">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentMultiSplitter.JS">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentMultiSplitter.Module">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentMultiSplitter.ChildContent">
<summary>
Gets or sets the child content.
Expand Down Expand Up @@ -8030,12 +8123,6 @@
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentMultiSplitter.StyleValue">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentMultiSplitter.JS">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentMultiSplitter.Module">
<summary />
</member>
<member name="M:Microsoft.FluentUI.AspNetCore.Components.FluentMultiSplitter.AddPane(Microsoft.FluentUI.AspNetCore.Components.FluentMultiSplitterPane)">
<summary>
Adds the pane.
Expand Down Expand Up @@ -8334,6 +8421,9 @@
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentTab.StyleValue">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentTab.LibraryConfiguration">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentTab.JSRuntime">
<summary />
</member>
Expand Down Expand Up @@ -8438,6 +8528,9 @@
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentTabs.StyleMoreValues">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentTabs.LibraryConfiguration">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentTabs.JSRuntime">
<summary />
</member>
Expand Down Expand Up @@ -8587,6 +8680,9 @@
Gets or sets the content to be rendered inside the component.
</summary>
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentTextField.LibraryConfiguration">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentTextField.JSRuntime">
<summary />
</member>
Expand Down Expand Up @@ -9616,6 +9712,9 @@
<member name="P:Microsoft.FluentUI.AspNetCore.Components.FluentWizardStepChangeEventArgs.IsCancelled">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.DesignTokens.DesignToken`1.LibraryConfiguration">
<summary />
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.DesignTokens.DesignToken`1.Name">
<summary>
Gets the name of this design token
Expand Down Expand Up @@ -14498,6 +14597,11 @@
Defines the global Fluent UI Blazor component library services configuration
</summary>
</member>
<member name="F:Microsoft.FluentUI.AspNetCore.Components.LibraryConfiguration.AssemblyVersion">
<summary>
Gets the assembly version formatted as a string.
</summary>
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.LibraryConfiguration.UseTooltipServiceProvider">
<summary>
Gets or sets a value indicating whether the library should use the TooltipServiceProvider.
Expand All @@ -14522,6 +14626,16 @@
Default is true.
</summary>
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.LibraryConfiguration.CollocatedJavaScriptQueryString">
<summary>
Gets or sets the function that formats the URL of the collocated JavaScript file,
adding the return value as a query string parameter.
By default, the function adds a query string parameter with the version of the assembly: `v=[AssemblyVersion]`.
</summary>
</member>
<member name="P:Microsoft.FluentUI.AspNetCore.Components.LibraryConfiguration.ForUnitTests">
<summary />
</member>
<member name="T:Microsoft.FluentUI.AspNetCore.Components.Resources.TimeAgoResource">
<summary>
A strongly-typed resource class, for looking up localized strings, etc.
Expand Down
12 changes: 9 additions & 3 deletions src/Core/Components/Anchor/FluentAnchor.razor.cs
View file
Original file line number Diff line number Diff line change
@@ -1,17 +1,24 @@
using Microsoft.AspNetCore.Components;
using Microsoft.FluentUI.AspNetCore.Components.Extensions;
using Microsoft.JSInterop;

namespace Microsoft.FluentUI.AspNetCore.Components;

public partial class FluentAnchor : FluentComponentBase, IAsyncDisposable
{
private const string JAVASCRIPT_FILE = "./_content/Microsoft.FluentUI.AspNetCore.Components/Components/Anchor/FluentAnchor.razor.js";

private IJSObjectReference _jsModule = default!;
private string? _targetId = null;
private bool _preventDefault = false;

/// <summary />
[Inject]
protected IJSRuntime JSRuntime { get; set; } = default!;
private LibraryConfiguration LibraryConfiguration { get; set; } = default!;

/// <summary />
[Inject]
private IJSRuntime JSRuntime { get; set; } = default!;

/// <summary>
/// Prompts the user to save the linked URL. See <see href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a">a element</see> for more information.
Expand Down Expand Up @@ -123,8 +130,7 @@ protected override async Task OnAfterRenderAsync(bool firstRender)
{
if (firstRender)
{
_jsModule = await JSRuntime.InvokeAsync<IJSObjectReference>("import",
"./_content/Microsoft.FluentUI.AspNetCore.Components/Components/Anchor/FluentAnchor.razor.js");
_jsModule = await JSRuntime.InvokeAsync<IJSObjectReference>("import", JAVASCRIPT_FILE.FormatCollocatedUrl(LibraryConfiguration));
}
}

Expand Down
8 changes: 7 additions & 1 deletion src/Core/Components/AnchoredRegion/FluentAnchoredRegion.razor.cs
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
using Microsoft.AspNetCore.Components;
using Microsoft.FluentUI.AspNetCore.Components.Extensions;
using Microsoft.FluentUI.AspNetCore.Components.Utilities;
using Microsoft.JSInterop;

Expand All @@ -7,6 +8,11 @@ public partial class FluentAnchoredRegion : FluentComponentBase
{
private const string JAVASCRIPT_FILE = "./_content/Microsoft.FluentUI.AspNetCore.Components/Components/AnchoredRegion/FluentAnchoredRegion.razor.js";

/// <summary />
[Inject]
private LibraryConfiguration LibraryConfiguration { get; set; } = default!;

/// <summary />
[Inject]
private IJSRuntime JSRuntime { get; set; } = default!;

Expand Down Expand Up @@ -161,7 +167,7 @@ protected async override Task OnAfterRenderAsync(bool firstRender)
{
if (firstRender)
{
Module ??= await JSRuntime.InvokeAsync<IJSObjectReference>("import", JAVASCRIPT_FILE);
Module ??= await JSRuntime.InvokeAsync<IJSObjectReference>("import", JAVASCRIPT_FILE.FormatCollocatedUrl(LibraryConfiguration));

// Go to the first Focusable element (after a delay of 100ms, to allow the DOM to render the Web Components)
if (AutoFocus)
Expand Down
Loading

0 comments on commit 5110baa

Please sign in to comment.