f1d51b8cc8
- Foldable left panel (user profile) and right panel (task details) - Clicking a task in the list or graph node selects it and shows details - Both views (task list + graph) always mounted via absolute inset-0 for correct canvas dimensions; tabs toggle visibility with opacity - Graph node selection animation: other nodes repel outward (charge -600), then selected node smoothly slides to center (500ms cubic ease-out), then charge restores to -120 and graph stabilizes - Graph re-fits on tab switch and panel resize via ResizeObserver - Fix UUID string IDs throughout (backend returns UUIDs, not integers) - Add TaskDetailPanel, UserPanel components - Add CLAUDE.md project documentation Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
140 lines
3.2 KiB
JavaScript
140 lines
3.2 KiB
JavaScript
'use strict';
|
|
|
|
const parsers = require('./parsers');
|
|
|
|
describe('valueType', () => {
|
|
it('returns color for red', () => {
|
|
let input = 'red';
|
|
let output = parsers.valueType(input);
|
|
|
|
expect(output).toEqual(parsers.TYPES.COLOR);
|
|
});
|
|
|
|
it('returns color for #nnnnnn', () => {
|
|
let input = '#fefefe';
|
|
let output = parsers.valueType(input);
|
|
|
|
expect(output).toEqual(parsers.TYPES.COLOR);
|
|
});
|
|
|
|
it('returns color for rgb(n, n, n)', () => {
|
|
let input = 'rgb(10, 10, 10)';
|
|
let output = parsers.valueType(input);
|
|
|
|
expect(output).toEqual(parsers.TYPES.COLOR);
|
|
});
|
|
|
|
it('returns color for rgb(p, p, p)', () => {
|
|
let input = 'rgb(10%, 10%, 10%)';
|
|
let output = parsers.valueType(input);
|
|
|
|
expect(output).toEqual(parsers.TYPES.COLOR);
|
|
});
|
|
|
|
it('returns color for rgba(n, n, n, n)', () => {
|
|
let input = 'rgba(10, 10, 10, 1)';
|
|
let output = parsers.valueType(input);
|
|
|
|
expect(output).toEqual(parsers.TYPES.COLOR);
|
|
});
|
|
|
|
it('returns color for rgba(n, n, n, n) with decimal alpha', () => {
|
|
let input = 'rgba(10, 10, 10, 0.5)';
|
|
let output = parsers.valueType(input);
|
|
|
|
expect(output).toEqual(parsers.TYPES.COLOR);
|
|
});
|
|
|
|
it('returns color for rgba(p, p, p, n)', () => {
|
|
let input = 'rgba(10%, 10%, 10%, 1)';
|
|
let output = parsers.valueType(input);
|
|
|
|
expect(output).toEqual(parsers.TYPES.COLOR);
|
|
});
|
|
|
|
it('returns color for rgba(p, p, p, n) with decimal alpha', () => {
|
|
let input = 'rgba(10%, 10%, 10%, 0.5)';
|
|
let output = parsers.valueType(input);
|
|
|
|
expect(output).toEqual(parsers.TYPES.COLOR);
|
|
});
|
|
|
|
it('returns length for 100ch', () => {
|
|
let input = '100ch';
|
|
let output = parsers.valueType(input);
|
|
|
|
expect(output).toEqual(parsers.TYPES.LENGTH);
|
|
});
|
|
|
|
it('returns calc from calc(100px * 2)', () => {
|
|
let input = 'calc(100px * 2)';
|
|
let output = parsers.valueType(input);
|
|
|
|
expect(output).toEqual(parsers.TYPES.CALC);
|
|
});
|
|
});
|
|
describe('parseInteger', () => {
|
|
it.todo('test');
|
|
});
|
|
describe('parseNumber', () => {
|
|
it.todo('test');
|
|
});
|
|
describe('parseLength', () => {
|
|
it.todo('test');
|
|
});
|
|
describe('parsePercent', () => {
|
|
it.todo('test');
|
|
});
|
|
describe('parseMeasurement', () => {
|
|
it.todo('test');
|
|
});
|
|
describe('parseUrl', () => {
|
|
it.todo('test');
|
|
});
|
|
describe('parseString', () => {
|
|
it.todo('test');
|
|
});
|
|
describe('parseColor', () => {
|
|
it('should convert hsl to rgb values', () => {
|
|
let input = 'hsla(0, 1%, 2%)';
|
|
let output = parsers.parseColor(input);
|
|
|
|
expect(output).toEqual('rgb(5, 5, 5)');
|
|
});
|
|
it('should convert hsla to rgba values', () => {
|
|
let input = 'hsla(0, 1%, 2%, 0.5)';
|
|
let output = parsers.parseColor(input);
|
|
|
|
expect(output).toEqual('rgba(5, 5, 5, 0.5)');
|
|
});
|
|
|
|
it.todo('Add more tests');
|
|
});
|
|
describe('parseAngle', () => {
|
|
it.todo('test');
|
|
});
|
|
describe('parseKeyword', () => {
|
|
it.todo('test');
|
|
});
|
|
describe('dashedToCamelCase', () => {
|
|
it.todo('test');
|
|
});
|
|
describe('shorthandParser', () => {
|
|
it.todo('test');
|
|
});
|
|
describe('shorthandSetter', () => {
|
|
it.todo('test');
|
|
});
|
|
describe('shorthandGetter', () => {
|
|
it.todo('test');
|
|
});
|
|
describe('implicitSetter', () => {
|
|
it.todo('test');
|
|
});
|
|
describe('subImplicitSetter', () => {
|
|
it.todo('test');
|
|
});
|
|
describe('camelToDashed', () => {
|
|
it.todo('test');
|
|
});
|