Light Bulbs Comparison Source Code

Browse the implementation files for Light Bulbs Comparison.
modal.spec.ts typescript
import { describe, expect, it } from 'vitest';
import type { CatalogItem } from '@tool.io/tools/compare';

import {
	filterCompareModalItems,
	groupCompareSuggestions
} from './modal';

const item = (
	id: string,
	name: string,
	categoryIds: string[]
): CatalogItem => ({
	attributes: {},
	categoryIds,
	id,
	image: null,
	name,
	schemaVersion: 1,
	slug: id,
	sourceIds: ['fixture'],
	summary: `${name} fixture`,
	updatedAt: '2026-08-09T00:00:00Z'
});

const tesla = item('tesla-model-3', 'Tesla Model 3', [
	'vehicle',
	'car'
]);
const toyota = item('toyota-corolla', 'Toyota Corolla', [
	'vehicle',
	'car'
]);
const bicycle = item('trek-fx-3', 'Trek FX 3', [
	'vehicle',
	'bicycle'
]);
const banana = item('banana', 'Banana', ['food', 'fruit']);

describe('compare modal category behavior', () => {
	it('groups related category items ahead of unrelated top comparisons', () => {
		const groups = groupCompareSuggestions(
			[tesla, toyota, bicycle, banana],
			{
				activeCategoryId: 'car',
				excludedItemIds: [tesla.id],
				preferredRelatedSlugs: [toyota.slug],
				query: '',
				topComparedSlugs: [banana.slug, bicycle.slug]
			}
		);

		expect(groups.map((group) => group.title)).toEqual([
			'Related items',
			'Top comparisons'
		]);
		expect(
			groups[0].items.map((candidate) => candidate.slug)
		).toEqual(['toyota-corolla']);
		expect(
			groups[1].items.map((candidate) => candidate.slug)
		).toEqual(['banana', 'trek-fx-3']);
	});

	it('uses one global result group once the user searches', () => {
		const groups = groupCompareSuggestions(
			[tesla, toyota, bicycle, banana],
			{
				activeCategoryId: 'car',
				excludedItemIds: [tesla.id],
				query: 'banana',
				topComparedSlugs: []
			}
		);

		expect(groups).toHaveLength(1);
		expect(groups[0].title).toBe('Search results');
		expect(
			groups[0].items.map((candidate) => candidate.slug)
		).toEqual(['banana']);
	});

	it('shows only the active category until the user searches', () => {
		expect(
			filterCompareModalItems(
				[tesla, toyota, bicycle, banana],
				{
					activeCategoryId: 'car',
					anchorItemId: tesla.id,
					query: ''
				}
			).map((candidate) => candidate.slug)
		).toEqual(['toyota-corolla']);

		expect(
			filterCompareModalItems(
				[tesla, toyota, bicycle, banana],
				{
					activeCategoryId: 'car',
					anchorItemId: tesla.id,
					query: 'banana'
				}
			).map((candidate) => candidate.slug)
		).toEqual(['banana']);
	});

	it('shows every category by default on the general compare page', () => {
		expect(
			filterCompareModalItems(
				[tesla, toyota, bicycle, banana],
				{
					activeCategoryId: null,
					anchorItemId: tesla.id,
					query: ''
				}
			)
		).toHaveLength(3);
	});
});

Description

Browse the implementation files for Light Bulbs Comparison.

References

  1. Tool.io on GitHub
  2. Tool.io TypeScript tools library

Similar or alternative tools

Don't forget to set a bookmark for tool.io!
Privacy | Imprint | Cookies