test(bunit): Sprint 19 markdown editor lifecycle and interop validation - #333
Merged
Merged
Conversation
github-actions
Bot
added
the
squad
Contributor
🏗️ PR Added to Squad Triage QueueThis PR has been labeled with Next steps:
|
There was a problem hiding this comment.
Pull request overview
This PR introduces a new markdown editor-based TextEditor component (with image upload + alignment tooling), wires it into the BlogPost Create/Edit pages, and adds/updates bUnit tests to validate lifecycle/interop behavior.
Changes:
- Replace Create/Edit post
<InputTextArea>content fields with a newTextEditor(PSC.Blazor.Components.MarkdownEditor-based) and add supporting JS/CSS includes. - Add local-disk file storage abstraction/implementation and register it in DI for image uploads.
- Add new bUnit lifecycle tests and update existing bUnit suites to run with loose JS interop and accommodate the new editor.
Reviewed changes
Copilot reviewed 18 out of 19 changed files in this pull request and generated 10 comments.
Show a summary per file
| File | Description |
|---|---|
| tests/Web.Tests.Bunit/GlobalUsings.cs | Adds global using for IFileStorage to support updated/new tests. |
| tests/Web.Tests.Bunit/Features/MarkdownEditorLifecycleTests.cs | New bUnit tests covering create/edit editor lifecycle, disposal, and loose JS interop behavior. |
| tests/Web.Tests.Bunit/Features/EditAclTests.cs | Sets bUnit JSInterop to Loose and registers IFileStorage for editor rendering. |
| tests/Web.Tests.Bunit/Components/RazorSmokeTests.cs | Updates smoke tests to assert TextEditor usage and adjusts create/edit flows for editor binding. |
| src/Web/wwwroot/js/text-editor-helpers.js | Adds getSelectedText JS helper used by TextEditor custom toolbar behavior. |
| src/Web/wwwroot/js/markdown-editor-init.js | Adds an interop wrapper script (currently not referenced by the app). |
| src/Web/Web.csproj | Adds markdown-related package references. |
| src/Web/Program.cs | Registers file storage via AddFileStorage(). |
| src/Web/Infrastructure/FileStorage/LocalDiskFileStorage.cs | Implements local disk storage under wwwroot/uploads with size/extension checks. |
| src/Web/Infrastructure/FileStorage/IFileStorage.cs | Introduces storage abstraction used by the editor for uploads. |
| src/Web/Infrastructure/FileStorage/FileStorageModels.cs | Adds FileData/FileMetaData models for storage operations. |
| src/Web/Infrastructure/FileStorage/FileStorageExtensions.cs | Adds DI registration extension method. |
| src/Web/GlobalUsings.cs | Adds global using for file storage types. |
| src/Web/Features/BlogPosts/Edit/Edit.razor | Replaces textarea with TextEditor and updates label to indicate Markdown. |
| src/Web/Features/BlogPosts/Create/Create.razor | Replaces textarea with TextEditor and updates label to indicate Markdown. |
| src/Web/Components/Shared/TextEditor.razor | New markdown editor wrapper component with image upload and custom button handling. |
| src/Web/Components/App.razor | Adds Font Awesome CDN + PSC MarkdownEditor CSS/JS + helper script includes. |
| src/AppHost/MongoDbResourceBuilderExtensions.cs | Minor formatting/bracing fix in seed document block. |
| Directory.Packages.props | Centralizes new markdown-related package versions. |
Comment on lines
+80
to
+82
| // Persist the file and build a retrieval URL | ||
| var fileName = await FileStorage.AddFileAsync(new FileData(stream, new FileMetaData(file.Name, string.Empty, file.LastModified))); | ||
| file.UploadUrl = new Uri(new Uri(NavigationManager.BaseUri), $"/api/files/{fileName}").ToString(); |
| set | ||
| { | ||
| _content = value; | ||
| ContentChanged.InvokeAsync(value); |
Comment on lines
+72
to
+83
| public async Task<FileEntry> HandleImageUpload(MarkdownEditor editor, FileEntry file) | ||
| { | ||
| Console.WriteLine($"Image: {file.Name} Size: {file.Size}"); | ||
|
|
||
| // Convert the base64 string to a byte array and load it into a memory stream | ||
| var bytes = Convert.FromBase64String(file.ContentBase64); | ||
| var stream = new MemoryStream(bytes); | ||
|
|
||
| // Persist the file and build a retrieval URL | ||
| var fileName = await FileStorage.AddFileAsync(new FileData(stream, new FileMetaData(file.Name, string.Empty, file.LastModified))); | ||
| file.UploadUrl = new Uri(new Uri(NavigationManager.BaseUri), $"/api/files/{fileName}").ToString(); | ||
| return file; |
Comment on lines
+86
to
+101
| public async Task OnCustomButtonClicked(MarkdownButtonEventArgs args) | ||
| { | ||
| // Get the selected text using JavaScript | ||
| var selectedText = await JsRuntime.InvokeAsync<string>("getSelectedText", ".EasyMDEContainer textarea"); | ||
|
|
||
| if (!string.IsNullOrEmpty(selectedText)) | ||
| { | ||
| // Wrap the selected text with the chosen alignment | ||
| var wrappedText = $"<div style='text-align:{args.Value}'>{selectedText}</div>"; | ||
|
|
||
| // Replace the selected text in the editor | ||
| MyContent = MyContent.Replace(selectedText, wrappedText); | ||
|
|
||
| // Update the editor | ||
| await _textEditor.SetValueAsync(MyContent); | ||
| } |
Comment on lines
+43
to
+46
| if (file.Content.Length > MaxFileSizeBytes) | ||
| { | ||
| throw new InvalidOperationException("File exceeds the maximum allowed size of 10 MB."); | ||
| } |
Comment on lines
+48
to
+53
| var extension = Path.GetExtension(file.Metadata.FileName).ToUpperInvariant(); | ||
| if (string.IsNullOrEmpty(extension) || !AllowedExtensions.Contains(extension)) | ||
| { | ||
| throw new InvalidOperationException( | ||
| $"File type '{extension}' is not allowed. Only images are permitted."); | ||
| } |
Comment on lines
14
to
20
| <PackageReference Include="FluentValidation.DependencyInjectionExtensions" /> | ||
| <PackageReference Include="Markdig" /> | ||
| <PackageReference Include="MediatR" /> | ||
| <PackageReference Include="Microsoft.Bcl.AsyncInterfaces" /> | ||
| <PackageReference Include="MongoDB.EntityFrameworkCore" /> | ||
| <PackageReference Include="PSC.Blazor.Components.MarkdownEditor" /> | ||
| <PackageReference Include="Snappier" /> |
Comment on lines
+1
to
+11
| // Custom initialization wrapper for PSC.Blazor.Components.MarkdownEditor | ||
| // This ensures proper loading and initialization of the markdown editor | ||
|
|
||
| window.markdownEditorInterop = { | ||
| editors: {}, | ||
|
|
||
| initialize: function (dotNetObjectRef, elementRef, elementId, options) { | ||
| try { | ||
| // Wait for EasyMDE to be available | ||
| if (typeof EasyMDE === 'undefined') { | ||
| console.error('EasyMDE is not loaded'); |
| <ResourcePreloader /> | ||
| <link rel="stylesheet" href="css/tailwind.css" /> | ||
| <link rel="stylesheet" href="@Assets["Web.styles.css"]" /> | ||
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css" integrity="sha512-Evv84Mr4kqVGRNSgIGL/F/aIDqQb7xQ2vcrdIwxfjThSH8CSR7PBEakCr51Ck+w+/U6swU2Im1vVX0SVk9ABhg==" crossorigin="anonymous" referrerpolicy="no-referrer" /> |
Comment on lines
12
to
20
| <PackageReference Include="Auth0.ManagementApi" /> | ||
| <PackageReference Include="FluentValidation.AspNetCore" /> | ||
| <PackageReference Include="FluentValidation.DependencyInjectionExtensions" /> | ||
| <PackageReference Include="Markdig" /> | ||
| <PackageReference Include="MediatR" /> | ||
| <PackageReference Include="Microsoft.Bcl.AsyncInterfaces" /> | ||
| <PackageReference Include="MongoDB.EntityFrameworkCore" /> | ||
| <PackageReference Include="PSC.Blazor.Components.MarkdownEditor" /> | ||
| <PackageReference Include="Snappier" /> |
mpaulosky
force-pushed
the
squad/327-test-interop-lifecycle-validation
branch
from
May 13, 2026 16:54
290ead9 to
f686b44
Compare
Owner
Author
|
🤖 Aragorn — Rebase complete Branch |
Contributor
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## dev #333 +/- ##
==========================================
- Coverage 81.67% 81.66% -0.02%
==========================================
Files 51 51
Lines 1370 1369 -1
Branches 166 166
==========================================
- Hits 1119 1118 -1
Misses 184 184
Partials 67 67
🚀 New features to boost your workflow:
|
mpaulosky
force-pushed
the
squad/327-test-interop-lifecycle-validation
branch
from
May 13, 2026 17:24
f686b44 to
5f3023b
Compare
Owner
Author
mpaulosky
enabled auto-merge
May 13, 2026 17:25
mpaulosky
force-pushed
the
squad/327-test-interop-lifecycle-validation
branch
from
May 13, 2026 17:51
5f3023b to
f96c477
Compare
- Align Create.razor label from 'Markdown' to 'Content (Markdown)' matching Edit.razor's label pattern for visual parity - Switch Create.razor TextEditor binding to @bind-Content for idiomatic Blazor two-way binding, consistent with Edit.razor - Add bUnit parity tests: CreatePostShowsMarkdownContentLabel and EditPostShowsMarkdownContentLabel asserting label presence on both pages No behavioral change — form submit, validation, and navigation paths are unchanged. Editor is not rendered before data loads in Edit (existing _isLoading guard remains in place). Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
…dation (#327) Add MarkdownEditorLifecycleTests.cs with 5 targeted tests covering four gaps not addressed by the existing smoke and ACL suites: - CreateEditorInitializesWithEmptyContent: asserts TextEditor.Content == "" on initial render of the Create page - EditEditorInitializesWithExistingPostContent: explicit lifecycle assertion that the Edit page pre-populates the editor with the post's stored content - CreatePageDisposesWithoutException: disposes Create page without JS errors - EditPageDisposesWithoutException: disposes Edit page without JS errors - TextEditorRendersStandaloneWithLooseJsInteropWithoutThrow: documents that JSRuntimeMode.Loose absorbs EasyMDE init calls silently All tests follow the JSRuntimeMode.Loose pattern established in EditAclTests.cs. Result: 94 → 99 bUnit tests, all passing. Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
mpaulosky
force-pushed
the
squad/327-test-interop-lifecycle-validation
branch
from
May 13, 2026 18:02
f96c477 to
036aac2
Compare
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Working as Gimli (Testing/Quality Engineer)
Closes #327
Adds MarkdownEditorLifecycleTests.cs with 5 targeted bUnit tests closing four coverage gaps from Sprint 19:
Test count: 94 -> 99 bUnit tests, all passing. Full suite: 315 tests, 0 failures.
All tests use JSRuntimeMode.Loose (matching EditAclTests.cs pattern). No feature code or existing tests modified. Disposal tests use DisposeComponentsAsync() per bUnit 2.7.2 API.