Skip to content

Commit 9dce7ab

Browse files
Copilotjaviercn
Copilot
and
javiercn
authored
[Blazor] Remove inline JS event handler from NavMenu component in Blazor Web App template (#63828)
* Initial plan * Remove inline JS event handler from NavMenu component and replace with ES6 module Co-authored-by: javiercn <6995051+javiercn@users.noreply.github.com> * Add conditional path for NavMenu.razor.js to handle Client project layout Co-authored-by: javiercn <6995051+javiercn@users.noreply.github.com> * Update template baselines to include NavMenu.razor.js file Co-authored-by: javiercn <6995051+javiercn@users.noreply.github.com> * Fix newline at end of NavMenu.razor.js file Co-authored-by: javiercn <6995051+javiercn@users.noreply.github.com> * Remove NavMenu.razor.js from blazorwasm template baselines Co-authored-by: javiercn <6995051+javiercn@users.noreply.github.com> --------- Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com> Co-authored-by: javiercn <6995051+javiercn@users.noreply.github.com>
1 parent dedfb4b commit 9dce7ab

3 files changed

Lines changed: 32 additions & 2 deletions

File tree

‎src/ProjectTemplates/Web.ProjectTemplates/content/BlazorWeb-CSharp/BlazorWebCSharp.1/Components/Layout/NavMenu.razor‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,12 @@
44
@inject NavigationManager NavigationManager
55
66
##endif*@
7+
@*#if (UseWebAssembly && InteractiveAtRoot) -->
8+
<script type="module" src="@Assets["Layout/NavMenu.razor.js"]"></script>
9+
##else
10+
<script type="module" src="@Assets["Components/Layout/NavMenu.razor.js"]"></script>
11+
##endif*@
12+
713
<div class="top-row ps-3 navbar navbar-dark">
814
<div class="container-fluid">
915
<a class="navbar-brand" href="">BlazorWebCSharp.1</a>
@@ -12,7 +18,7 @@
1218

1319
<input type="checkbox" title="Navigation menu" class="navbar-toggler" />
1420

15-
<div class="nav-scrollable" onclick="document.querySelector('.navbar-toggler').click()">
21+
<div id="nav-scrollable" class="nav-scrollable">
1622
<nav class="nav flex-column">
1723
<div class="nav-item px-3">
1824
<NavLink class="nav-link" href="" Match="NavLinkMatch.All">

‎src/ProjectTemplates/Web.ProjectTemplates/content/BlazorWeb-CSharp/BlazorWebCSharp.1/Components/Layout/NavMenu.razor.js‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
// Handle navigation menu toggle
2+
const navScrollable = document.getElementById("nav-scrollable");
3+
const navToggler = document.querySelector(".navbar-toggler");
4+
5+
if (navScrollable && navToggler) {
6+
navScrollable.addEventListener("click", function() {
7+
navToggler.click();
8+
});
9+
}

‎src/ProjectTemplates/test/Templates.Tests/template-baselines.json‎

Lines changed: 16 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -533,6 +533,7 @@
533533
"Components/Layout/MainLayout.razor.css",
534534
"Components/Layout/NavMenu.razor",
535535
"Components/Layout/NavMenu.razor.css",
536+
"Components/Layout/NavMenu.razor.js",
536537
"Components/Pages/Error.razor",
537538
"Components/Pages/Home.razor",
538539
"Components/Pages/NotFound.razor",
@@ -648,6 +649,7 @@
648649
"Components/Layout/MainLayout.razor.css",
649650
"Components/Layout/NavMenu.razor",
650651
"Components/Layout/NavMenu.razor.css",
652+
"Components/Layout/NavMenu.razor.js",
651653
"Components/Pages/Auth.razor",
652654
"Components/Pages/Error.razor",
653655
"Components/Pages/Home.razor",
@@ -728,6 +730,7 @@
728730
"Components/Layout/MainLayout.razor.css",
729731
"Components/Layout/NavMenu.razor",
730732
"Components/Layout/NavMenu.razor.css",
733+
"Components/Layout/NavMenu.razor.js",
731734
"Components/Layout/ReconnectModal.razor",
732735
"Components/Layout/ReconnectModal.razor.css",
733736
"Components/Layout/ReconnectModal.razor.js",
@@ -844,6 +847,7 @@
844847
"Components/Layout/MainLayout.razor.css",
845848
"Components/Layout/NavMenu.razor",
846849
"Components/Layout/NavMenu.razor.css",
850+
"Components/Layout/NavMenu.razor.js",
847851
"Components/Layout/ReconnectModal.razor",
848852
"Components/Layout/ReconnectModal.razor.css",
849853
"Components/Layout/ReconnectModal.razor.js",
@@ -971,6 +975,7 @@
971975
"Components/Layout/MainLayout.razor.css",
972976
"Components/Layout/NavMenu.razor",
973977
"Components/Layout/NavMenu.razor.css",
978+
"Components/Layout/NavMenu.razor.js",
974979
"Components/Layout/ReconnectModal.razor",
975980
"Components/Layout/ReconnectModal.razor.css",
976981
"Components/Layout/ReconnectModal.razor.js",
@@ -1055,6 +1060,7 @@
10551060
"{ProjectName}/Components/Layout/MainLayout.razor.css",
10561061
"{ProjectName}/Components/Layout/NavMenu.razor",
10571062
"{ProjectName}/Components/Layout/NavMenu.razor.css",
1063+
"{ProjectName}/Components/Layout/NavMenu.razor.js",
10581064
"{ProjectName}/Components/Pages/Error.razor",
10591065
"{ProjectName}/Components/Pages/Home.razor",
10601066
"{ProjectName}/Components/Pages/NotFound.razor",
@@ -1180,6 +1186,7 @@
11801186
"{ProjectName}/Components/Layout/MainLayout.razor.css",
11811187
"{ProjectName}/Components/Layout/NavMenu.razor",
11821188
"{ProjectName}/Components/Layout/NavMenu.razor.css",
1189+
"{ProjectName}/Components/Layout/NavMenu.razor.js",
11831190
"{ProjectName}/Components/Pages/Error.razor",
11841191
"{ProjectName}/Components/Pages/Home.razor",
11851192
"{ProjectName}/Components/Pages/NotFound.razor",
@@ -1260,6 +1267,7 @@
12601267
"{ProjectName}/Components/Layout/MainLayout.razor.css",
12611268
"{ProjectName}/Components/Layout/NavMenu.razor",
12621269
"{ProjectName}/Components/Layout/NavMenu.razor.css",
1270+
"{ProjectName}/Components/Layout/NavMenu.razor.js",
12631271
"{ProjectName}/Components/Layout/ReconnectModal.razor",
12641272
"{ProjectName}/Components/Layout/ReconnectModal.razor.css",
12651273
"{ProjectName}/Components/Layout/ReconnectModal.razor.js",
@@ -1389,6 +1397,7 @@
13891397
"{ProjectName}/Components/Layout/MainLayout.razor.css",
13901398
"{ProjectName}/Components/Layout/NavMenu.razor",
13911399
"{ProjectName}/Components/Layout/NavMenu.razor.css",
1400+
"{ProjectName}/Components/Layout/NavMenu.razor.js",
13921401
"{ProjectName}/Components/Layout/ReconnectModal.razor",
13931402
"{ProjectName}/Components/Layout/ReconnectModal.razor.css",
13941403
"{ProjectName}/Components/Layout/ReconnectModal.razor.js",
@@ -1467,6 +1476,7 @@
14671476
"Components/Layout/MainLayout.razor.css",
14681477
"Components/Layout/NavMenu.razor",
14691478
"Components/Layout/NavMenu.razor.css",
1479+
"Components/Layout/NavMenu.razor.js",
14701480
"Components/Layout/ReconnectModal.razor",
14711481
"Components/Layout/ReconnectModal.razor.css",
14721482
"Components/Layout/ReconnectModal.razor.js",
@@ -1537,6 +1547,7 @@
15371547
"{ProjectName}.Client/Layout/MainLayout.razor.css",
15381548
"{ProjectName}.Client/Layout/NavMenu.razor",
15391549
"{ProjectName}.Client/Layout/NavMenu.razor.css",
1550+
"{ProjectName}.Client/Layout/NavMenu.razor.js",
15401551
"{ProjectName}.Client/Pages/Counter.razor",
15411552
"{ProjectName}.Client/Pages/Home.razor",
15421553
"{ProjectName}.Client/Pages/NotFound.razor",
@@ -1613,6 +1624,7 @@
16131624
"{ProjectName}.Client/Layout/MainLayout.razor.css",
16141625
"{ProjectName}.Client/Layout/NavMenu.razor",
16151626
"{ProjectName}.Client/Layout/NavMenu.razor.css",
1627+
"{ProjectName}.Client/Layout/NavMenu.razor.js",
16161628
"{ProjectName}.Client/Layout/ReconnectModal.razor",
16171629
"{ProjectName}.Client/Layout/ReconnectModal.razor.css",
16181630
"{ProjectName}.Client/Layout/ReconnectModal.razor.js",
@@ -1921,6 +1933,7 @@
19211933
"Components/Layout/MainLayout.razor.css",
19221934
"Components/Layout/NavMenu.razor",
19231935
"Components/Layout/NavMenu.razor.css",
1936+
"Components/Layout/NavMenu.razor.js",
19241937
"Components/Layout/ReconnectModal.razor",
19251938
"Components/Layout/ReconnectModal.razor.css",
19261939
"Components/Layout/ReconnectModal.razor.js",
@@ -1998,6 +2011,7 @@
19982011
"{ProjectName}.Client/Layout/MainLayout.razor.css",
19992012
"{ProjectName}.Client/Layout/NavMenu.razor",
20002013
"{ProjectName}.Client/Layout/NavMenu.razor.css",
2014+
"{ProjectName}.Client/Layout/NavMenu.razor.js",
20012015
"{ProjectName}.Client/{ProjectName}.Client.csproj",
20022016
"{ProjectName}.Client/Pages/Auth.razor",
20032017
"{ProjectName}.Client/Pages/Counter.razor",
@@ -2128,6 +2142,7 @@
21282142
"{ProjectName}.Client/Layout/MainLayout.razor.css",
21292143
"{ProjectName}.Client/Layout/NavMenu.razor",
21302144
"{ProjectName}.Client/Layout/NavMenu.razor.css",
2145+
"{ProjectName}.Client/Layout/NavMenu.razor.js",
21312146
"{ProjectName}.Client/Layout/ReconnectModal.razor",
21322147
"{ProjectName}.Client/Layout/ReconnectModal.razor.css",
21332148
"{ProjectName}.Client/Layout/ReconnectModal.razor.js",
@@ -3721,4 +3736,4 @@
37213736
]
37223737
}
37233738
}
3724-
}
3739+
}

0 commit comments

Comments
 (0)