Skip to content

Commit 40058f4

Browse files
danielroedanielroe
committed
test: add more components
1 parent 694ad90 commit 40058f4

1 file changed

Lines changed: 320 additions & 0 deletions

File tree

‎test/nuxt/components.spec.ts‎

Lines changed: 320 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -58,6 +58,16 @@ import ProvenanceBadge from '~/components/ProvenanceBadge.vue'
5858
import MarkdownText from '~/components/MarkdownText.vue'
5959
import PackageSkeleton from '~/components/PackageSkeleton.vue'
6060
import PackageCard from '~/components/PackageCard.vue'
61+
import PackageDownloadStats from '~/components/PackageDownloadStats.vue'
62+
import PackagePlaygrounds from '~/components/PackagePlaygrounds.vue'
63+
import PackageDependencies from '~/components/PackageDependencies.vue'
64+
import PackageVersions from '~/components/PackageVersions.vue'
65+
import PackageListControls from '~/components/PackageListControls.vue'
66+
import PackageMaintainers from '~/components/PackageMaintainers.vue'
67+
import CodeViewer from '~/components/CodeViewer.vue'
68+
import CodeDirectoryListing from '~/components/CodeDirectoryListing.vue'
69+
import CodeFileTree from '~/components/CodeFileTree.vue'
70+
import UserCombobox from '~/components/UserCombobox.vue'
6171

6272
describe('component accessibility audits', () => {
6373
describe('AppHeader', () => {
@@ -245,4 +255,314 @@ describe('component accessibility audits', () => {
245255
expect(results.violations).toEqual([])
246256
})
247257
})
258+
259+
describe('PackageDownloadStats', () => {
260+
it('should have no accessibility violations without data', async () => {
261+
const component = await mountSuspended(PackageDownloadStats)
262+
const results = await runAxe(component)
263+
expect(results.violations).toEqual([])
264+
})
265+
266+
it('should have no accessibility violations with download data', async () => {
267+
const downloads = [
268+
{ downloads: 1000, weekStart: '2024-01-01', weekEnd: '2024-01-07' },
269+
{ downloads: 1200, weekStart: '2024-01-08', weekEnd: '2024-01-14' },
270+
{ downloads: 1500, weekStart: '2024-01-15', weekEnd: '2024-01-21' },
271+
]
272+
const component = await mountSuspended(PackageDownloadStats, {
273+
props: { downloads },
274+
})
275+
const results = await runAxe(component)
276+
expect(results.violations).toEqual([])
277+
})
278+
})
279+
280+
describe('PackagePlaygrounds', () => {
281+
it('should have no accessibility violations with single link', async () => {
282+
const links = [
283+
{
284+
provider: 'stackblitz',
285+
providerName: 'StackBlitz',
286+
label: 'Open in StackBlitz',
287+
url: 'https://stackblitz.com/example',
288+
},
289+
]
290+
const component = await mountSuspended(PackagePlaygrounds, {
291+
props: { links },
292+
})
293+
const results = await runAxe(component)
294+
expect(results.violations).toEqual([])
295+
})
296+
297+
it('should have no accessibility violations with multiple links', async () => {
298+
const links = [
299+
{
300+
provider: 'stackblitz',
301+
providerName: 'StackBlitz',
302+
label: 'Open in StackBlitz',
303+
url: 'https://stackblitz.com/example',
304+
},
305+
{
306+
provider: 'codesandbox',
307+
providerName: 'CodeSandbox',
308+
label: 'Open in CodeSandbox',
309+
url: 'https://codesandbox.io/example',
310+
},
311+
]
312+
const component = await mountSuspended(PackagePlaygrounds, {
313+
props: { links },
314+
})
315+
const results = await runAxe(component)
316+
expect(results.violations).toEqual([])
317+
})
318+
319+
it('should have no accessibility violations with empty links', async () => {
320+
const component = await mountSuspended(PackagePlaygrounds, {
321+
props: { links: [] },
322+
})
323+
const results = await runAxe(component)
324+
expect(results.violations).toEqual([])
325+
})
326+
})
327+
328+
describe('PackageDependencies', () => {
329+
it('should have no accessibility violations without dependencies', async () => {
330+
const component = await mountSuspended(PackageDependencies, {
331+
props: { packageName: 'test-package' },
332+
})
333+
const results = await runAxe(component)
334+
expect(results.violations).toEqual([])
335+
})
336+
337+
it('should have no accessibility violations with dependencies', async () => {
338+
const component = await mountSuspended(PackageDependencies, {
339+
props: {
340+
packageName: 'test-package',
341+
dependencies: {
342+
vue: '^3.0.0',
343+
lodash: '^4.17.0',
344+
},
345+
},
346+
})
347+
const results = await runAxe(component)
348+
expect(results.violations).toEqual([])
349+
})
350+
351+
it('should have no accessibility violations with peer dependencies', async () => {
352+
const component = await mountSuspended(PackageDependencies, {
353+
props: {
354+
packageName: 'test-package',
355+
peerDependencies: {
356+
vue: '^3.0.0',
357+
},
358+
peerDependenciesMeta: {
359+
vue: { optional: true },
360+
},
361+
},
362+
})
363+
const results = await runAxe(component)
364+
expect(results.violations).toEqual([])
365+
})
366+
})
367+
368+
describe('PackageVersions', () => {
369+
it('should have no accessibility violations', async () => {
370+
// Minimal mock data satisfying PackumentVersion type
371+
const mockVersion = {
372+
_id: 'vue@3.5.0',
373+
_npmVersion: '10.0.0',
374+
name: 'vue',
375+
version: '3.5.0',
376+
dist: { tarball: '', shasum: '', signatures: [] },
377+
}
378+
const component = await mountSuspended(PackageVersions, {
379+
props: {
380+
packageName: 'vue',
381+
versions: {
382+
'3.5.0': mockVersion,
383+
'3.4.0': { ...mockVersion, _id: 'vue@3.4.0', version: '3.4.0' },
384+
},
385+
distTags: {
386+
latest: '3.5.0',
387+
next: '3.4.0',
388+
},
389+
time: {
390+
'3.5.0': '2024-01-15T00:00:00.000Z',
391+
'3.4.0': '2024-01-01T00:00:00.000Z',
392+
},
393+
},
394+
})
395+
const results = await runAxe(component)
396+
expect(results.violations).toEqual([])
397+
})
398+
})
399+
400+
describe('PackageListControls', () => {
401+
it('should have no accessibility violations', async () => {
402+
const component = await mountSuspended(PackageListControls, {
403+
props: {
404+
filter: '',
405+
sort: 'downloads',
406+
},
407+
})
408+
const results = await runAxe(component)
409+
expect(results.violations).toEqual([])
410+
})
411+
412+
it('should have no accessibility violations with filter active', async () => {
413+
const component = await mountSuspended(PackageListControls, {
414+
props: {
415+
filter: 'vue',
416+
sort: 'downloads',
417+
totalCount: 100,
418+
filteredCount: 10,
419+
},
420+
})
421+
const results = await runAxe(component)
422+
expect(results.violations).toEqual([])
423+
})
424+
})
425+
426+
describe('PackageMaintainers', () => {
427+
it('should have no accessibility violations without maintainers', async () => {
428+
const component = await mountSuspended(PackageMaintainers, {
429+
props: { packageName: 'vue' },
430+
})
431+
const results = await runAxe(component)
432+
expect(results.violations).toEqual([])
433+
})
434+
435+
it('should have no accessibility violations with maintainers', async () => {
436+
const component = await mountSuspended(PackageMaintainers, {
437+
props: {
438+
packageName: 'vue',
439+
maintainers: [
440+
{ name: 'yyx990803', email: 'evan@vuejs.org' },
441+
{ name: 'posva', email: 'posva@example.com' },
442+
],
443+
},
444+
})
445+
const results = await runAxe(component)
446+
expect(results.violations).toEqual([])
447+
})
448+
})
449+
450+
describe('CodeViewer', () => {
451+
it('should have no accessibility violations', async () => {
452+
const component = await mountSuspended(CodeViewer, {
453+
props: {
454+
html: '<pre><code><span class="line">const x = 1;</span></code></pre>',
455+
lines: 1,
456+
selectedLines: null,
457+
},
458+
})
459+
const results = await runAxe(component)
460+
expect(results.violations).toEqual([])
461+
})
462+
463+
it('should have no accessibility violations with selected lines', async () => {
464+
const component = await mountSuspended(CodeViewer, {
465+
props: {
466+
html: '<pre><code><span class="line">const x = 1;</span><span class="line">const y = 2;</span></code></pre>',
467+
lines: 2,
468+
selectedLines: { start: 1, end: 1 },
469+
},
470+
})
471+
const results = await runAxe(component)
472+
expect(results.violations).toEqual([])
473+
})
474+
})
475+
476+
describe('CodeDirectoryListing', () => {
477+
const mockTree = [
478+
{ name: 'src', type: 'directory' as const, path: 'src', children: [] },
479+
{ name: 'index.js', type: 'file' as const, path: 'index.js', size: 1024 },
480+
{ name: 'package.json', type: 'file' as const, path: 'package.json', size: 512 },
481+
]
482+
483+
it('should have no accessibility violations', async () => {
484+
const component = await mountSuspended(CodeDirectoryListing, {
485+
props: {
486+
tree: mockTree,
487+
currentPath: '',
488+
baseUrl: '/code/vue',
489+
},
490+
})
491+
const results = await runAxe(component)
492+
expect(results.violations).toEqual([])
493+
})
494+
495+
it('should have no accessibility violations with nested path', async () => {
496+
const component = await mountSuspended(CodeDirectoryListing, {
497+
props: {
498+
tree: mockTree,
499+
currentPath: 'src',
500+
baseUrl: '/code/vue',
501+
},
502+
})
503+
const results = await runAxe(component)
504+
expect(results.violations).toEqual([])
505+
})
506+
})
507+
508+
describe('CodeFileTree', () => {
509+
const mockTree = [
510+
{
511+
name: 'src',
512+
type: 'directory' as const,
513+
path: 'src',
514+
children: [{ name: 'index.ts', type: 'file' as const, path: 'src/index.ts' }],
515+
},
516+
{ name: 'package.json', type: 'file' as const, path: 'package.json' },
517+
]
518+
519+
it('should have no accessibility violations', async () => {
520+
const component = await mountSuspended(CodeFileTree, {
521+
props: {
522+
tree: mockTree,
523+
currentPath: '',
524+
baseUrl: '/code/vue',
525+
},
526+
})
527+
const results = await runAxe(component)
528+
expect(results.violations).toEqual([])
529+
})
530+
531+
it('should have no accessibility violations with selected file', async () => {
532+
const component = await mountSuspended(CodeFileTree, {
533+
props: {
534+
tree: mockTree,
535+
currentPath: 'src/index.ts',
536+
baseUrl: '/code/vue',
537+
},
538+
})
539+
const results = await runAxe(component)
540+
expect(results.violations).toEqual([])
541+
})
542+
})
543+
544+
describe('UserCombobox', () => {
545+
it('should have no accessibility violations', async () => {
546+
const component = await mountSuspended(UserCombobox, {
547+
props: {
548+
suggestions: ['user1', 'user2', 'user3'],
549+
label: 'Select a user',
550+
},
551+
})
552+
const results = await runAxe(component)
553+
expect(results.violations).toEqual([])
554+
})
555+
556+
it('should have no accessibility violations when disabled', async () => {
557+
const component = await mountSuspended(UserCombobox, {
558+
props: {
559+
suggestions: ['user1', 'user2'],
560+
disabled: true,
561+
label: 'Select a user',
562+
},
563+
})
564+
const results = await runAxe(component)
565+
expect(results.violations).toEqual([])
566+
})
567+
})
248568
})

0 commit comments

Comments
 (0)