Skip to content

Commit d8cd13d

Browse files
committed
remove support for "donutSolid" pie charts
This option no longer exists, so the special case is no longer required in the plugin either.
1 parent 76033ba commit d8cd13d

File tree

2 files changed

+90
-3
lines changed

2 files changed

+90
-3
lines changed

src/scripts/chartist-plugin-tooltip.ts

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -97,9 +97,7 @@ export function ChartistPluginTooltip<T extends BaseChart>(
9797
// Added support for donut graph
9898
if ((chart as any).options.donut) {
9999
// Added support for the solid donut graph
100-
tooltipSelector = (chart as any).options.donutSolid
101-
? 'ct-slice-donut-solid'
102-
: 'ct-slice-donut';
100+
tooltipSelector = 'ct-slice-donut';
103101
} else {
104102
tooltipSelector = 'ct-slice-pie';
105103
}

test/spec/tooltip.spec.ts

Lines changed: 89 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -284,6 +284,95 @@ describe('Tooltip Plugin', () => {
284284
});
285285
});
286286

287+
describe('for PieChart (Donut)', () => {
288+
let chartContainer: HTMLElement;
289+
let tooltip: HTMLElement | null;
290+
const listeners: { [key: string]: EventListener } = {};
291+
292+
beforeAll(() => {
293+
// Create container DIV.
294+
chartContainer = document.createElement('div');
295+
chartContainer.id = 'chart';
296+
chartContainer.style.height = '100px';
297+
chartContainer.style.width = '500px';
298+
(chartContainer as any).addEventListener = (
299+
type: string,
300+
listener: EventListener
301+
) => {
302+
listeners[type] = listener;
303+
};
304+
document.body.innerHTML = '';
305+
document.body.appendChild(chartContainer);
306+
});
307+
308+
it('should initialize with a Tooltip plugin', () => {
309+
const chart = new PieChart(
310+
chartContainer,
311+
{
312+
series: [20, 10, 30, 40]
313+
},
314+
{
315+
donut: true,
316+
donutWidth: 60,
317+
startAngle: 270,
318+
showLabel: true,
319+
plugins: [ChartistPluginTooltip]
320+
}
321+
);
322+
323+
chart.initialize();
324+
325+
expect(chartContainer?.innerHTML).not.toEqual('');
326+
});
327+
328+
it('should generate the tooltip element', () => {
329+
tooltip = document.body.querySelector('.chartist-tooltip');
330+
expect(tooltip).not.toBeNull();
331+
});
332+
333+
it('should append the tooltip to the body by default', () => {
334+
expect(tooltip?.parentElement).toBe(document.body);
335+
});
336+
337+
it('should hide the tooltip', () => {
338+
expect(tooltip?.classList).not.toContain('tooltip-show');
339+
});
340+
341+
it('should not show tooltip on mouse enter', () => {
342+
listeners.mouseover({
343+
target: chartContainer as EventTarget
344+
} as MouseEvent);
345+
expect(tooltip?.classList).not.toContain('tooltip-show');
346+
});
347+
348+
it('should show tooltip with mouse over a point', () => {
349+
listeners.mouseover({
350+
target: chartContainer.querySelector('.ct-slice-donut') as EventTarget,
351+
pageX: 150,
352+
pageY: 160
353+
} as MouseEvent);
354+
expect(tooltip?.classList).toContain('tooltip-show');
355+
});
356+
357+
it('should generate tooltip content', () => {
358+
expect(tooltip?.innerHTML).toEqual(
359+
'<span class="chartist-tooltip-value">20</span>'
360+
);
361+
});
362+
363+
it('should set tooltip position', () => {
364+
expect(tooltip?.style.left).toBe('150px');
365+
expect(tooltip?.style.top).toBe('140px');
366+
});
367+
368+
it('should hide tooltip on mouse leave', () => {
369+
listeners.mouseout({
370+
target: chartContainer.querySelector('.ct-slice-donut') as EventTarget
371+
} as MouseEvent);
372+
expect(tooltip?.classList).not.toContain('tooltip-show');
373+
});
374+
});
375+
287376
describe('with custom options', () => {
288377
let chartContainer: HTMLElement;
289378
let tooltip: HTMLElement | null;

0 commit comments

Comments
 (0)