Skip to content

Add resizable option to side dialog. #2331

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 5 commits into
base: master
Choose a base branch
from
Open

Add resizable option to side dialog. #2331

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
e53f90d
Add resizable option to side dialog.
artnim Oct 29, 2025
218ed65
Fix resize bar CSS class typo and make sideDialogResizeHandleJsModule…
Copilot Nov 5, 2025
8d24b49
Add tests for resizable side dialog.
artnim Nov 5, 2025
454ea9f
Rename element references.
artnim Nov 5, 2025
3b20fc0
Enable nullable refernce types for RadzenDialg.razor.cs
artnim Nov 5, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
78 changes: 75 additions & 3 deletions Radzen.Blazor.Tests/DialogServiceTests.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,11 +1,15 @@
using System;
using Bunit;
using Microsoft.AspNetCore.Components;
using Microsoft.Extensions.DependencyInjection;
using System;
using System.Collections.Generic;
using System.Threading;
using System.Threading.Tasks;
using Xunit;

namespace Radzen.Blazor.Tests
{
public class DialogServiceTests
public class DialogServiceTests : ComponentBase
{
public class OpenDialogTests
{
Expand Down Expand Up @@ -124,13 +128,81 @@ public async Task OpenAsync_DynamicComponentType_Reflective_Calls_Resolve()
var openTask = dialogService.OpenAsync("Dynamic Open", typeof(RadzenButton), []);
dialogService.Close();
await openTask;

// Assert
Assert.Equal("Dynamic Open", resultingTitle);
Assert.Equal(typeof(RadzenButton), resultingType);
}
}

public class OpenSideDialogTests
{
[Fact(DisplayName = "SideDialogOptions resizable option is retained after OpenSideDialog call")]
public void SideDialogOptions_Resizable_AreRetained_AfterOpenSideDialogCall()
{
// Arrange
var options = new SideDialogOptions { Resizable = true };
SideDialogOptions resultingOptions = null;
var dialogService = new DialogService(null, null);
dialogService.OnSideOpen += (_, _, sideOptions) => resultingOptions = sideOptions;

// Act
dialogService.OpenSide<DialogServiceTests>("Test", [], options);

// Assert
Assert.NotNull(resultingOptions);
Assert.Same(options, resultingOptions);
Assert.True(resultingOptions.Resizable);
}

[Fact(DisplayName = "Side dialog shows resize bar when Resizable is true")]
public void SideDialog_Resizable_ShowsResizeBar()
{
using var ctx = new TestContext();
ctx.JSInterop.Mode = JSRuntimeMode.Loose;
ctx.Services.AddScoped<DialogService>();

// Render the dialog host
var cut = ctx.RenderComponent<RadzenDialog>();

// Open a side dialog with Resizable=true
var dialogService = ctx.Services.GetRequiredService<DialogService>();
cut.InvokeAsync(() => dialogService.OpenSide("Test", typeof(RadzenButton),
new Dictionary<string, object>(), new SideDialogOptions { Resizable = true }));

// Assert: the resize bar element is present
cut.WaitForAssertion(() =>
{
var markup = cut.Markup;
Assert.Contains("rz-dialog-resize-bar", markup);
// Optionally ensure the inner handle exists too
Assert.Contains("rz-resize", markup);
});
}

[Fact(DisplayName = "Side dialog hides resize bar when Resizable is false")]
public void SideDialog_NonResizable_HidesResizeBar()
{
using var ctx = new TestContext();
ctx.JSInterop.Mode = JSRuntimeMode.Loose;
ctx.Services.AddScoped<DialogService>();

// Render the dialog host
var cut = ctx.RenderComponent<RadzenDialog>();

// Open a side dialog with Resizable=false
var dialogService = ctx.Services.GetRequiredService<DialogService>();
cut.InvokeAsync(() => dialogService.OpenSide("Test", typeof(RadzenButton),
new Dictionary<string, object>(), new SideDialogOptions()));

// Assert: the resize bar element is not present
cut.WaitForAssertion(() =>
{
var markup = cut.Markup;
Assert.DoesNotContain("rz-dialog-resize-bar", markup);
});
}
}
public class ConfirmTests
{
[Fact(DisplayName = "ConfirmOptions is null and default values are set correctly")]
Expand Down
55 changes: 27 additions & 28 deletions Radzen.Blazor/DialogService.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
namespace Radzen
{
/// <summary>
/// Class DialogService. Contains various methods with options to open and close dialogs.
/// Class DialogService. Contains various methods with options to open and close dialogs.
/// Should be added as scoped service in the application services and RadzenDialog should be added in application main layout.
/// </summary>
/// <example>
Expand Down Expand Up @@ -54,7 +54,7 @@ internal DotNetObjectReference<DialogService> Reference
return reference;
}
}

/// <summary>
/// Gets or sets the URI helper.
/// </summary>
Expand Down Expand Up @@ -384,7 +384,7 @@ public virtual Task<dynamic> OpenAsync(RenderFragment<DialogService> titleConten
// register the cancellation token
if (cancellationToken.HasValue)
cancellationToken.Value.Register(() => task.TrySetCanceled());

tasks.Add(task);

options ??= new DialogOptions();
Expand Down Expand Up @@ -484,8 +484,8 @@ public void Dispose()
options.Width = !String.IsNullOrEmpty(options.Width) ? options.Width : ""; // Width is set to 600px by default by OpenAsync
options.Style = !String.IsNullOrEmpty(options.Style) ? options.Style : "";
options.CssClass = !String.IsNullOrEmpty(options.CssClass) ? $"rz-dialog-confirm {options.CssClass}" : "rz-dialog-confirm";
options.WrapperCssClass = !String.IsNullOrEmpty(options.WrapperCssClass) ? $"rz-dialog-wrapper {options.WrapperCssClass}" : "rz-dialog-wrapper";
options.WrapperCssClass = !String.IsNullOrEmpty(options.WrapperCssClass) ? $"rz-dialog-wrapper {options.WrapperCssClass}" : "rz-dialog-wrapper";

return await OpenAsync(title, ds =>
{
RenderFragment content = b =>
Expand Down Expand Up @@ -578,7 +578,7 @@ public void Dispose()
// Validate and set default values for the dialog options
options ??= new();
options.OkButtonText = !String.IsNullOrEmpty(options.OkButtonText) ? options.OkButtonText : "Ok";
options.Width = !String.IsNullOrEmpty(options.Width) ? options.Width : "";
options.Width = !String.IsNullOrEmpty(options.Width) ? options.Width : "";
options.Style = !String.IsNullOrEmpty(options.Style) ? options.Style : "";
options.CssClass = !String.IsNullOrEmpty(options.CssClass) ? $"rz-dialog-alert {options.CssClass}" : "rz-dialog-alert";
options.WrapperCssClass = !String.IsNullOrEmpty(options.WrapperCssClass) ? $"rz-dialog-wrapper {options.WrapperCssClass}" : "rz-dialog-wrapper";
Expand Down Expand Up @@ -848,6 +848,7 @@ public int CloseTabIndex
}

private RenderFragment<DialogService> titleContent;
private bool resizable;

/// <summary>
/// Gets or sets the title content.
Expand All @@ -865,6 +866,23 @@ public RenderFragment<DialogService> TitleContent
}
}
}

/// <summary>
/// Gets or sets a value indicating whether the dialog is resizable. Set to <c>false</c> by default.
/// </summary>
/// <value><c>true</c> if resizable; otherwise, <c>false</c>.</value>
public bool Resizable
{
get => resizable;
set
{
if (resizable != value)
{
resizable = value;
OnPropertyChanged(nameof(Resizable));
}
}
}
}

/// <summary>
Expand Down Expand Up @@ -992,25 +1010,6 @@ public class DialogOptions : DialogOptionsBase
/// </summary>
public string IconStyle { get; set; } = "margin-right: 0.75rem";


private bool resizable;
/// <summary>
/// Gets or sets a value indicating whether the dialog is resizable. Set to <c>false</c> by default.
/// </summary>
/// <value><c>true</c> if resizable; otherwise, <c>false</c>.</value>
public bool Resizable
{
get => resizable;
set
{
if (resizable != value)
{
resizable = value;
OnPropertyChanged(nameof(Resizable));
}
}
}

private Action<Size> resize;

/// <summary>
Expand Down Expand Up @@ -1147,7 +1146,7 @@ public RenderFragment<DialogService> ChildContent
private bool autoFocusFirstElement = true;

/// <summary>
/// Gets or sets a value indicating whether to focus the first focusable HTML element.
/// Gets or sets a value indicating whether to focus the first focusable HTML element.
/// </summary>
/// <value><c>true</c> if the first focusable element is focused; otherwise, <c>false</c>. Default is <c>true</c>.</value>
public bool AutoFocusFirstElement
Expand Down Expand Up @@ -1237,7 +1236,7 @@ public string CancelButtonText
public class Dialog : INotifyPropertyChanged
{
private string title;

/// <summary>
/// Gets or sets the title.
/// </summary>
Expand Down Expand Up @@ -1326,4 +1325,4 @@ protected virtual void OnPropertyChanged(string propertyName)
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
}
}
}
Loading