/**
* Tests for Chart Block Creator
*/
import {
createChartBlockCreator,
createQuickChartConfig,
} from '../ChartBlockCreator';
import type {
ChartConfig,
DataSource,
ChartType,
} from '../types';
describe('ChartBlockCreator', () => {
describe('createChartBlockCreator', () => {
it('should create a valid Creator configuration', () => {
const config = createChartBlockCreator();
expect(config).toBeDefined();
expect(config.data).toBeDefined();
expect(config.onLoad).toBeDefined();
expect(config.onReady).toBeDefined();
expect(config.methods).toBeDefined();
});
it('should create configuration with custom options', () => {
const config = createChartBlockCreator({
apiKey: 'test-api-key',
defaultChartType: 'line',
refreshInterval: 60000,
debug: true,
});
expect(config).toBeDefined();
expect(config.data).toBeDefined();
});
it('should initialize with default data', () => {
const config = createChartBlockCreator();
expect(config.data.chartConfig).toBeNull();
expect(config.data.isLoading).toBe(false);
expect(config.data.error).toBeNull();
expect(config.data.mode).toBe('create');
});
it('should have required lifecycle methods', () => {
const config = createChartBlockCreator();
expect(typeof config.onLoad).toBe('function');
expect(typeof config.onReady).toBe('function');
expect(typeof config.onDestroy).toBe('function');
expect(typeof config.onShow).toBe('function');
expect(typeof config.onHide).toBe('function');
});
it('should have required methods exposed', () => {
const config = createChartBlockCreator();
expect(config.methods).toBeDefined();
expect(typeof config.methods!.createBlock).toBe('function');
expect(typeof config.methods!.cancelBlock).toBe('function');
expect(typeof config.methods!.updateChartConfig).toBe('function');
expect(typeof config.methods!.loadChartData).toBe('function');
expect(typeof config.methods!.renderChart).toBe('function');
expect(typeof config.methods!.startRefresh).toBe('function');
expect(typeof config.methods!.stopRefresh).toBe('function');
expect(typeof config.methods!.exportAsImage).toBe('function');
});
});
describe('createQuickChartConfig', () => {
it('should create a valid chart configuration with minimal params', () => {
const config = createQuickChartConfig({
type: 'bar',
appToken: 'test-app-token',
tableId: 'test-table-id',
xAxisField: 'Date',
yAxisField: 'Views',
});
expect(config.chartType).toBe('bar');
expect(config.dataSource.appToken).toBe('test-app-token');
expect(config.dataSource.tableId).toBe('test-table-id');
expect(config.dataSource.fields.xAxis).toBe('Date');
expect(config.dataSource.fields.yAxis).toBe('Views');
});
it('should create configuration with all optional params', () => {
const config = createQuickChartConfig({
type: 'line',
appToken: 'test-app-token',
tableId: 'test-table-id',
xAxisField: 'Date',
yAxisField: ['Views', 'Likes'],
title: 'Test Chart',
seriesField: 'Platform',
viewId: 'test-view-id',
});
expect(config.chartType).toBe('line');
expect(config.title).toBe('Test Chart');
expect(config.dataSource.viewId).toBe('test-view-id');
expect(config.dataSource.fields.series).toBe('Platform');
expect(config.dataSource.fields.yAxis).toEqual(['Views', 'Likes']);
});
it('should include default options', () => {
const config = createQuickChartConfig({
type: 'pie',
appToken: 'test-app',
tableId: 'test-table',
xAxisField: 'Category',
yAxisField: 'Count',
});
expect(config.options).toBeDefined();
expect(config.options!.showLegend).toBe(true);
expect(config.options!.showDataLabels).toBe(false);
expect(config.options!.animation).toBe(true);
});
it('should support all chart types', () => {
const chartTypes: ChartType[] = ['bar', 'line', 'pie', 'area', 'scatter', 'funnel', 'radar'];
chartTypes.forEach((type) => {
const config = createQuickChartConfig({
type,
appToken: 'test-app',
tableId: 'test-table',
xAxisField: 'X',
yAxisField: 'Y',
});
expect(config.chartType).toBe(type);
});
});
});
describe('ChartConfig interface', () => {
it('should accept valid chart configuration', () => {
const config: ChartConfig = {
chartType: 'bar',
title: 'Test Chart',
dataSource: {
appToken: 'test-app',
tableId: 'test-table',
fields: {
xAxis: 'Date',
yAxis: ['Views'],
},
},
options: {
colors: ['#3370FF', '#34C759'],
showLegend: true,
showDataLabels: false,
animation: true,
stacked: false,
},
};
expect(config.chartType).toBe('bar');
expect(config.options?.colors).toHaveLength(2);
});
it('should accept configuration with multiple Y-axis fields', () => {
const config: ChartConfig = {
chartType: 'line',
dataSource: {
appToken: 'test-app',
tableId: 'test-table',
fields: {
xAxis: 'Date',
yAxis: ['Views', 'Likes', 'Comments'],
},
},
};
expect(config.dataSource.fields.yAxis).toEqual(['Views', 'Likes', 'Comments']);
});
it('should accept configuration with series field', () => {
const config: ChartConfig = {
chartType: 'bar',
dataSource: {
appToken: 'test-app',
tableId: 'test-table',
fields: {
xAxis: 'Platform',
yAxis: 'Views',
series: 'Sentiment',
},
},
};
expect(config.dataSource.fields.series).toBe('Sentiment');
});
});
describe('DataSource interface', () => {
it('should accept minimal data source configuration', () => {
const dataSource: DataSource = {
appToken: 'test-app-token',
tableId: 'test-table-id',
fields: {
xAxis: 'X',
yAxis: 'Y',
},
};
expect(dataSource.appToken).toBe('test-app-token');
expect(dataSource.tableId).toBe('test-table-id');
});
it('should accept data source with view ID', () => {
const dataSource: DataSource = {
appToken: 'test-app',
tableId: 'test-table',
viewId: 'test-view',
fields: {
xAxis: 'X',
yAxis: 'Y',
},
};
expect(dataSource.viewId).toBe('test-view');
});
it('should accept data source with filters', () => {
const dataSource: DataSource = {
appToken: 'test-app',
tableId: 'test-table',
fields: {
xAxis: 'X',
yAxis: 'Y',
},
filters: [
{ field: 'Status', operator: 'is', value: 'Active' },
{ field: 'Views', operator: 'gt', value: 100 },
],
};
expect(dataSource.filters).toHaveLength(2);
expect(dataSource.filters![0].operator).toBe('is');
});
});
});
