fix: improve test assertion precision and add null guard in renderFilterBar

- Fixed imprecise pill count assertion in test_app.mjs by changing /filter-pill/g regex to /<button/g to accurately count button elements without double-counting when active pill has both classes
- Removed redundant OR fallback in active pill test, now relying only on specific regex for Laptop pill
- Added defensive null guard 'allSessions = allSessions || []' at entry of renderFilterBar in app.js to prevent TypeError

🤖 Generated with Amplifier

Co-Authored-By: Amplifier <240397093+microsoft-amplifier@users.noreply.github.com>
This commit is contained in:
Brian Krabach
2026-03-31 00:26:12 -07:00
parent 5738c39f7f
commit 393891173f
2 changed files with 5 additions and 5 deletions
+1
View File
@@ -721,6 +721,7 @@ function renderGroupedGrid(sessions, mobile) {
* @param {Array} allSessions - Full (unfiltered) session list used to derive device names. * @param {Array} allSessions - Full (unfiltered) session list used to derive device names.
*/ */
function renderFilterBar(container, allSessions) { function renderFilterBar(container, allSessions) {
allSessions = allSessions || [];
// Collect unique device names preserving insertion order // Collect unique device names preserving insertion order
var devices = []; var devices = [];
var seen = {}; var seen = {};
+4 -5
View File
@@ -2570,7 +2570,7 @@ test('renderFilterBar produces pill buttons for each device plus All', () => {
assert.ok(html.includes('Server'), 'filter bar should include a pill for "Server"'); assert.ok(html.includes('Server'), 'filter bar should include a pill for "Server"');
// Should have exactly 3 buttons: All, Laptop, Server (Laptop appears only once despite two sessions) // Should have exactly 3 buttons: All, Laptop, Server (Laptop appears only once despite two sessions)
const pillCount = (html.match(/filter-pill/g) || []).length; const pillCount = (html.match(/<button/g) || []).length;
assert.ok(pillCount >= 3, 'filter bar should have at least 3 filter-pill buttons (All + 2 devices)'); assert.ok(pillCount >= 3, 'filter bar should have at least 3 filter-pill buttons (All + 2 devices)');
}); });
@@ -2593,11 +2593,10 @@ test('renderFilterBar marks active device pill with filter-pill--active class',
const html = mockContainer.innerHTML; const html = mockContainer.innerHTML;
// The 'Laptop' pill should have the active class // The 'Laptop' pill should have the active class
assert.ok(html.includes('filter-pill--active'), 'filter bar should mark active device with filter-pill--active class'); assert.ok(html.includes('filter-pill--active'), 'filter bar should mark active device with filter-pill--active class');
// Verify the active pill corresponds to 'Laptop' // Verify the active pill corresponds to 'Laptop' specifically
assert.ok( assert.ok(
html.match(/filter-pill--active[^>]*>Laptop|Laptop[^<]*filter-pill--active/) || html.match(/filter-pill--active[^>]*>Laptop|Laptop[^<]*filter-pill--active/),
html.includes('filter-pill--active'), 'filter-pill--active should be on the Laptop pill specifically'
'filter-pill--active should be present in the rendered HTML'
); );
// Reset // Reset