Add snapshot unit tests

README.md

@@ -83,6 +83,8 @@ If you are noticing that the jest tests are taking a long time, you might want t
 
 > Hint: Make sure the local server is running first using the `npm run start` command.
 
+In order to update all of the failing unit test snapshots, run `npm run jest-update-snapshots`. If you only want to update the snapshots for a specific unit test file, run `npm run jest-update-snapshots -- -u`
+
 #### Chromedriver issues
 
 Your version of Chrome needs to match the `chromedriver` package version. You can find your version of Chrome (ie. 121.x.xxxx.xxx) by checking the version number inside the "About Chrome" dialog in Chrome.

js/test/accessible-text-svg.test.js

@@ -0,0 +1,17 @@
+'use strict'
+
+import config from './test-config.js';
+import testHelpers from './test-helpers.js';
+
+
+describe('Accessible Text SVG Page Tests', () => {
+  beforeAll(async () => {
+  });
+
+  it('Initial page load HTML matches snapshot', async () => {
+    await page.goto(`${config.BASE_URL}/accessible-text-svg.php`);
+    await testHelpers.testPageSnapshot(page);
+  });
+
+  it.todo('Test functionality');
+});

js/test/acknowledgements.test.js

@@ -0,0 +1,15 @@
+'use strict'
+
+import config from './test-config.js';
+import testHelpers from './test-helpers.js';
+
+
+describe('Acknowledgements Page Tests', () => {
+  beforeAll(async () => {
+  });
+
+  it('Initial page load HTML matches snapshot', async () => {
+    await page.goto(`${config.BASE_URL}/acknowledgements.php`);
+    await testHelpers.testPageSnapshot(page);
+  });
+});

js/test/alert-dialog.test.js

@@ -0,0 +1,17 @@
+'use strict'
+
+import config from './test-config.js';
+import testHelpers from './test-helpers.js';
+
+
+describe('Alert Dialog Page Tests', () => {
+  beforeAll(async () => {
+  });
+
+  it('Initial page load HTML matches snapshot', async () => {
+    await page.goto(`${config.BASE_URL}/alert-dialog.php`);
+    await testHelpers.testPageSnapshot(page);
+  });
+
+  it.todo('Test functionality');
+});

js/test/alert.test.js

@@ -0,0 +1,17 @@
+'use strict'
+
+import config from './test-config.js';
+import testHelpers from './test-helpers.js';
+
+
+describe('Alert Page Tests', () => {
+  beforeAll(async () => {
+  });
+
+  it('Initial page load HTML matches snapshot', async () => {
+    await page.goto(`${config.BASE_URL}/alert.php`);
+    await testHelpers.testPageSnapshot(page);
+  });
+
+  it.todo('Test functionality');
+});

js/test/animated-gif-with-pause-button.test.js

@@ -0,0 +1,18 @@
+'use strict'
+
+import config from './test-config.js';
+import testHelpers from './test-helpers.js';
+
+
+describe('Animated GIF with Pause Button Page Tests', () => {
+  beforeAll(async () => {
+  });
+
+  // TODO: Fix inconsistent results
+  it.skip('Initial page load HTML matches snapshot', async () => {
+    await page.goto(`${config.BASE_URL}/animated-gif-with-pause-button.php`);
+    await testHelpers.testPageSnapshot(page);
+  });
+
+  it.todo('Test functionality');
+});

js/test/animated-hide-show.test.js

@@ -0,0 +1,17 @@
+'use strict'
+
+import config from './test-config.js';
+import testHelpers from './test-helpers.js';
+
+
+describe('Animated Hide Show Page Tests', () => {
+  beforeAll(async () => {
+  });
+
+  it('Initial page load HTML matches snapshot', async () => {
+    await page.goto(`${config.BASE_URL}/animated-hide-show.php`);
+    await testHelpers.testPageSnapshot(page);
+  });
+
+  it.todo('Test functionality');
+});

js/test/bookmarklets.test.js

@@ -0,0 +1,15 @@
+'use strict'
+
+import config from './test-config.js';
+import testHelpers from './test-helpers.js';
+
+
+describe('Bookmarklets Page Tests', () => {
+  beforeAll(async () => {
+  });
+
+  it('Initial page load HTML matches snapshot', async () => {
+    await page.goto(`${config.BASE_URL}/bookmarklets.php`);
+    await testHelpers.testPageSnapshot(page);
+  });
+});

js/test/bottom-fixed-navigation.test.js

@@ -0,0 +1,17 @@
+'use strict'
+
+import config from './test-config.js';
+import testHelpers from './test-helpers.js';
+
+
+describe('Bottom Fixed Navigation Page Tests', () => {
+  beforeAll(async () => {
+  });
+
+  it('Initial page load HTML matches snapshot', async () => {
+    await page.goto(`${config.BASE_URL}/bottom-fixed-navigation.php`);
+    await testHelpers.testPageSnapshot(page);
+  });
+
+  it.todo('Test functionality');
+});

js/test/button.test.js

@@ -0,0 +1,17 @@
+'use strict'
+
+import config from './test-config.js';
+import testHelpers from './test-helpers.js';
+
+
+describe('Button Page Tests', () => {
+  beforeAll(async () => {
+  });
+
+  it('Initial page load HTML matches snapshot', async () => {
+    await page.goto(`${config.BASE_URL}/button.php`);
+    await testHelpers.testPageSnapshot(page);
+  });
+
+  it.todo('Test functionality');
+});

js/test/carousel.test.js

@@ -8,13 +8,18 @@ describe('Carousel Tests', () => {
   beforeAll(async () => {
   });
 
+  // TODO: Fix inconsistent results
+  it.skip('Initial page load HTML matches snapshot', async () => {
+    await page.goto(`${config.BASE_URL}/carousel.php`);
+    await testHelpers.testPageSnapshot(page);
+  });
+
 
   // Test #1
   it('Test carousel type #1 (list of links)', async () => {
     let domInfo;
 
     await page.goto(`${config.BASE_URL}/carousel.php`);
-
 
     // wait until all content loads
     await page.waitForSelector('#example1');

js/test/chart.test.js

@@ -0,0 +1,17 @@
+'use strict'
+
+import config from './test-config.js';
+import testHelpers from './test-helpers.js';
+
+
+describe('Chart Page Tests', () => {
+  beforeAll(async () => {
+  });
+
+  it('Initial page load HTML matches snapshot', async () => {
+    await page.goto(`${config.BASE_URL}/chart.php`);
+    await testHelpers.testPageSnapshot(page);
+  });
+
+  it.todo('Test functionality');
+});

js/test/checkbox.test.js

@@ -19,6 +19,11 @@ describe('ARIA Checkbox Tests', () => {
     }, n);
   }
 
+  it('Initial page load HTML matches snapshot', async () => {
+    await page.goto(`${config.BASE_URL}/checkbox.php`);
+    await testHelpers.testPageSnapshot(page);
+  });
+
   // Test #1
   it('See if all ARIA checkboxes on page are keyboard accessible', async () => {
     let ariaChecked, domInfo;

js/test/code-quality.test.js

@@ -0,0 +1,15 @@
+'use strict'
+
+import config from './test-config.js';
+import testHelpers from './test-helpers.js';
+
+
+describe('Code Quality Page Tests', () => {
+  beforeAll(async () => {
+  });
+
+  it('Initial page load HTML matches snapshot', async () => {
+    await page.goto(`${config.BASE_URL}/code-quality.php`);
+    await testHelpers.testPageSnapshot(page);
+  });
+});

js/test/combobox.test.js

@@ -0,0 +1,17 @@
+'use strict'
+
+import config from './test-config.js';
+import testHelpers from './test-helpers.js';
+
+
+describe('Combobox Page Tests', () => {
+  beforeAll(async () => {
+  });
+
+  it('Initial page load HTML matches snapshot', async () => {
+    await page.goto(`${config.BASE_URL}/combobox.php`);
+    await testHelpers.testPageSnapshot(page);
+  });
+
+  it.todo('Test functionality');
+});

js/test/date.test.js

@@ -0,0 +1,17 @@
+'use strict'
+
+import config from './test-config.js';
+import testHelpers from './test-helpers.js';
+
+
+describe('Date Page Tests', () => {
+  beforeAll(async () => {
+  });
+
+  it('Initial page load HTML matches snapshot', async () => {
+    await page.goto(`${config.BASE_URL}/date.php`);
+    await testHelpers.testPageSnapshot(page);
+  });
+
+  it.todo('Test functionality');
+});

js/test/description-list.test.js

@@ -0,0 +1,17 @@
+'use strict'
+
+import config from './test-config.js';
+import testHelpers from './test-helpers.js';
+
+
+describe('Description List Page Tests', () => {
+  beforeAll(async () => {
+  });
+
+  it('Initial page load HTML matches snapshot', async () => {
+    await page.goto(`${config.BASE_URL}/description-list.php`);
+    await testHelpers.testPageSnapshot(page);
+  });
+
+  it.todo('Test functionality');
+});

js/test/dialog.test.js

@@ -39,6 +39,11 @@ describe('Dialog Tests', () => {
     return r;
 
   }
+
+  it('Initial page load HTML matches snapshot', async () => {
+    await page.goto(`${config.BASE_URL}/dialog.php`);
+    await testHelpers.testPageSnapshot(page);
+  });
 
   it('Focus on open and close tests', async () => {
     let domInfo;

js/test/dropdown.test.js

@@ -0,0 +1,17 @@
+'use strict'
+
+import config from './test-config.js';
+import testHelpers from './test-helpers.js';
+
+
+describe('Dropdown Page Tests', () => {
+  beforeAll(async () => {
+  });
+
+  it('Initial page load HTML matches snapshot', async () => {
+    await page.goto(`${config.BASE_URL}/dropdown.php`);
+    await testHelpers.testPageSnapshot(page);
+  });
+
+  it.todo('Test functionality');
+});

js/test/exposing-style-info-to-screen-readers.test.js

@@ -1,8 +1,14 @@
 'use strict'
 
 import config from './test-config.js';
+import testHelpers from './test-helpers.js';
 
 describe('Styled Elements Tests', () => {
+  it('Initial page load HTML matches snapshot', async () => {
+    await page.goto(`${config.BASE_URL}/exposing-style-info-to-screen-readers.php`);
+    await testHelpers.testPageSnapshot(page);
+  });
+
   it('Detect if there is sr-only content in the mark tags in the visually hidden text example', async () => {
     let domInfo;
 

js/test/faq.test.js

@@ -0,0 +1,15 @@
+'use strict'
+
+import config from './test-config.js';
+import testHelpers from './test-helpers.js';
+
+
+describe('FAQ Page Tests', () => {
+  beforeAll(async () => {
+  });
+
+  it('Initial page load HTML matches snapshot', async () => {
+    await page.goto(`${config.BASE_URL}/faq.php`);
+    await testHelpers.testPageSnapshot(page);
+  });
+});

js/test/figure.test.js

@@ -0,0 +1,17 @@
+'use strict'
+
+import config from './test-config.js';
+import testHelpers from './test-helpers.js';
+
+
+describe('Figure Page Tests', () => {
+  beforeAll(async () => {
+  });
+
+  it('Initial page load HTML matches snapshot', async () => {
+    await page.goto(`${config.BASE_URL}/figure.php`);
+    await testHelpers.testPageSnapshot(page);
+  });
+
+  it.todo('Test functionality');
+});

js/test/focus-styling.test.js

@@ -0,0 +1,17 @@
+'use strict'
+
+import config from './test-config.js';
+import testHelpers from './test-helpers.js';
+
+
+describe('Focus Styling Page Tests', () => {
+  beforeAll(async () => {
+  });
+
+  it('Initial page load HTML matches snapshot', async () => {
+    await page.goto(`${config.BASE_URL}/focus-styling.php`);
+    await testHelpers.testPageSnapshot(page);
+  });
+
+  it.todo('Test functionality');
+});