test: cleanup list test suite

packages/aware-components/src/test/a11y/list.test.ts

@@ -1,9 +1,11 @@
 import React from 'react';
 import { describe, expect, it } from 'vitest';
 import { formatWarning } from '../../helper/list';
+import { liChecks } from '../../utils/a11y/li';
 import { ulChecks } from '../../utils/a11y/ul';
+import { messages } from '../../utils/messages';
 
-describe('Accessibility check for list', () => {
+describe('Accessibility checks for <Li> and lists', () => {
   const validList = React.createElement(
     'ul',
     {},
@@ -26,21 +28,36 @@ describe('Accessibility check for list', () => {
 
   const listitem = React.createElement('div', { role: 'listitem' });
 
-  it('should return all warnings when all checks fail', () => {
+  it('returns warnings for invalid list structure', () => {
     const warnings = ulChecks(invalidList.props);
     expect(warnings.length).toEqual(2);
   });
 
-  it('should return no warnings for a valid list', () => {
+  it('returns no warnings for a valid list', () => {
     const warnings = ulChecks(validList.props);
     expect(warnings.length).toEqual(0);
   });
 
-  it('warns if an element is not a <li> but has role "listitem"', () => {
+  it('warns if a non-<li> element has role="listitem"', () => {
     const warnings = ulChecks({
       ...validList.props,
       children: [...validList.props['children'], listitem],
     });
     expect(warnings[0]).toEqual(formatWarning(listitem, 'Ul', 'role'));
   });
+
+  it('passes checks for a valid <li> element', () => {
+    const warnings = liChecks({}, true, undefined);
+    expect(warnings.length).toEqual(0);
+  });
+
+  it('warns about insufficient contrast in fallback styles', () => {
+    const warnings = liChecks({ style: { color: '#fff' } }, true, '#fff');
+    expect(warnings[0]).toEqual(`[Li] ${messages.styles.contrast}`);
+  });
+
+  it('warns if a <li> element is not inside a list', () => {
+    const warnings = liChecks({}, false, '#fff');
+    expect(warnings[0]).toEqual(messages.li.list);
+  });
 });