darkhelm/notifications-admin
1
0
Fork 0
mirror of https://github.com/GSA/notifications-admin.git synced 2026-05-05 00:20:43 -04:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #2012 from GSA/1999-dashboard-a11y-fixes

Browse Source 
1999 dashboard a11y fixes
This commit is contained in:
Sheev Davé
2024-10-24 14:07:10 -07:00
committed by GitHub
parent 543239d078 bfead7ffac
commit 846b5b51e7
6 changed files with 73 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
tests/javascripts/activityChart.test.js
View File

@@ -33,7 +33,7 @@ beforeAll(done => {
<div id="activityChart" >
<div class="chart-header">
<div class="chart-subtitle">Service Name - last 7 days</div>
<div class="chart-legend" aria-label="Legend"></div>
<div class="chart-legend" role="region" aria-label="Legend"></div>
</div>
<div class="chart-container" id="weeklyChart" data-service-id="12345" style="width: 600px;"></div>
<table id="weeklyTable" class="usa-sr-only usa-table"></table>
@@ -125,6 +125,37 @@ test('Check HTML content after chart creation', () => {
expect(container.querySelectorAll('rect').length).toBeGreaterThan(0);
});
test('Legend is visible when there are delivered or failed messages', () => {
// Example data with delivered and failed messages
const labels = ['Day 1', 'Day 2'];
const deliveredData = [10, 20]; // Mock delivered data
const failedData = [5, 0]; // Mock failed data
// Call the createChart function
window.createChart('#weeklyChart', labels, deliveredData, failedData);
// Check if the legend is displayed using computed style
const legendContainer = document.querySelector('.chart-legend');
const legendDisplayStyle = window.getComputedStyle(legendContainer).display;
expect(legendDisplayStyle).toBe('flex');
expect(legendContainer.querySelectorAll('.legend-item').length).toBe(2); // Ensure two legend items
});
test('Legend is hidden when there are no delivered or failed messages', () => {
// Example data with no delivered and no failed messages
const labels = ['Day 1', 'Day 2'];
const deliveredData = [0, 0]; // No delivered messages
const failedData = [0, 0]; // No failed messages
// Call the createChart function
window.createChart('#weeklyChart', labels, deliveredData, failedData);
// Check if the legend is hidden using computed style
const legendContainer = document.querySelector('.chart-legend');
const legendDisplayStyle = window.getComputedStyle(legendContainer).display;
expect(legendDisplayStyle).toBe('none');
});
test('Fetches data and creates chart and table correctly', async () => {
const mockResponse = {
'2024-07-01': { sms: { delivered: 50, failed: 5 } },

2
tests/javascripts/timeoutPopup.test.js
View File

@@ -2,7 +2,7 @@ beforeAll(() => {
jest.spyOn(global, 'setTimeout');
document.body.innerHTML = `
<dialog class="usa-modal" id="sessionTimer" aria-labelledby="sessionTimerHeading" aria-describedby="timerWarning">
<dialog class="usa-modal" id="sessionTimer" aria-labelledby="sessionTimerHeading" aria-describedby="timeLeft">
<div class="usa-modal__content">
<div class="usa-modal__main">
<h2 class="usa-modal__heading" id="sessionTimerHeading">