Added accessibility tests to notebook components

Added a11y tests to these components:

- NotebookView
- FilterSelect
- NotebookResultCount
- PaginationNavigation

To following components I didn't add a11y tests because they are
wrappers of one or several components already tested:

- PaginatedThreadList (ThreadList + PaginationNavigation)
- NotebookFilters (FilterSelect)

src/sidebar/components/test/FilterSelect-test.js

@@ -3,6 +3,8 @@ import { mount } from 'enzyme';
 import FilterSelect from '../FilterSelect';
 import { $imports } from '../FilterSelect';
 
+import { checkAccessibility } from '../../../test-util/accessibility';
+
 import mockImportedComponents from '../../../test-util/mock-imported-components';
 
 describe('FilterSelect', () => {
@@ -88,4 +90,27 @@ describe('FilterSelect', () => {
     assert.isFalse(wrapper.find('MenuItem').at(1).props().isSelected);
     assert.isTrue(wrapper.find('MenuItem').at(2).props().isSelected);
   });
+
+  it(
+    'should pass a11y checks',
+    checkAccessibility([
+      {
+        content: () => {
+          $imports.$restore();
+          return createComponent();
+        },
+      },
+      {
+        name: 'with icon',
+        content: () => {
+          $imports.$restore();
+          return createComponent({
+            icon: 'profile',
+            title: 'Select something',
+            selectedOption: { value: 'twovalue', display: 'Two Value' },
+          });
+        },
+      },
+    ])
+  );
 });

src/sidebar/components/test/NotebookResultCount-test.js

 import { mount } from 'enzyme';
 
+import { checkAccessibility } from '../../../test-util/accessibility';
+
 import NotebookResultCount from '../NotebookResultCount';
 import { $imports } from '../NotebookResultCount';
 
@@ -132,4 +134,36 @@ describe('NotebookResultCount', () => {
       assert.equal(wrapper.text(), '(2 annotations)');
     });
   });
+
+  it(
+    'should pass a11y checks',
+    checkAccessibility([
+      {
+        name: 'no results',
+        content: () => createComponent({ isFiltered: true }),
+      },
+      {
+        name: 'with results',
+        content: () => {
+          fakeCountVisible.returns(2);
+          fakeUseRootThread.returns({ children: [1, 2] });
+          return createComponent();
+        },
+      },
+      {
+        name: 'with results and filters applied',
+        content: () => {
+          fakeCountVisible.returns(3);
+          fakeUseRootThread.returns({ children: [1] });
+          return createComponent({ forcedVisibleCount: 1, isFiltered: true });
+        },
+      },
+      {
+        name: 'loading spinner',
+        content: () => {
+          return createComponent({ isLoading: true });
+        },
+      },
+    ])
+  );
 });

src/sidebar/components/test/NotebookView-test.js

 import { mount } from 'enzyme';
 import { act } from 'preact/test-utils';
 
+import { checkAccessibility } from '../../../test-util/accessibility';
+
 import mockImportedComponents from '../../../test-util/mock-imported-components';
 
 import { ResultSizeError } from '../../search-client';
@@ -185,4 +187,26 @@ describe('NotebookView', () => {
       assert.equal(wrapper.find('PaginatedThreadList').props().currentPage, 1);
     });
   });
+
+  it(
+    'should pass a11y checks',
+    checkAccessibility([
+      {
+        content: () => {
+          fakeStore.focusedGroup.returns({ id: 'hallothere', name: 'Hallo' });
+          return createComponent();
+        },
+      },
+      {
+        name: 'with message warning',
+        content: () => {
+          fakeLoadAnnotationsService.load.callsFake(options => {
+            options.onError(new ResultSizeError(5000));
+          });
+          fakeStore.focusedGroup.returns({ id: 'hallothere', name: 'Hallo' });
+          return createComponent();
+        },
+      },
+    ])
+  );
 });

src/sidebar/components/test/PaginationNavigation-test.js

 import { mount } from 'enzyme';
 import { act } from 'preact/test-utils';
 
+import { checkAccessibility } from '../../../test-util/accessibility';
+
 import PaginationNavigation, { $imports } from '../PaginationNavigation';
 
 describe('PaginationNavigation', () => {
@@ -148,4 +150,11 @@ describe('PaginationNavigation', () => {
       });
     });
   });
+
+  it(
+    'should pass a11y checks',
+    checkAccessibility({
+      content: () => createComponent({ currentPage: 2 }),
+    })
+  );
 });