From f0cefd2ede867368d8ef0a29139feffe0c4afbd0 Mon Sep 17 00:00:00 2001 From: plouc Date: Mon, 2 Nov 2020 09:03:58 +0900 Subject: [PATCH] feat(pie): add tests for colors --- packages/pie/tests/Pie.test.js | 170 +++++++++++++++++++-------------- 1 file changed, 96 insertions(+), 74 deletions(-) diff --git a/packages/pie/tests/Pie.test.js b/packages/pie/tests/Pie.test.js index 6162422909..2809ef687d 100644 --- a/packages/pie/tests/Pie.test.js +++ b/packages/pie/tests/Pie.test.js @@ -3,34 +3,41 @@ import TestRenderer from 'react-test-renderer' import Pie from '../src/Pie' import PieSlice from '../src/PieSlice' -const sampleData = [{ - id: 'A', - value: 30, -},{ - id: 'B', - value: 20, -},{ - id: 'C', - value: 50, -}] +const sampleData = [ + { + id: 'A', + value: 30, + color: '#ff5500', + }, + { + id: 'B', + value: 20, + color: '#ffdd00', + }, + { + id: 'C', + value: 50, + color: '#99cc44', + }, +] + +sampleData.forEach(datum => { + datum.nested = { + color: datum.color, + } +}) const sampleDataWithCustomProps = sampleData.map(datum => ({ name: datum.id, attributes: { - volume: datum.value - } + volume: datum.value, + }, })) describe('Pie', () => { describe('data', () => { it('should use default id and value properties', () => { - const pie = TestRenderer.create( - - ) + const pie = TestRenderer.create() const pieInstance = pie.root const slices = pieInstance.findAllByType(PieSlice) @@ -106,12 +113,7 @@ describe('Pie', () => { it('should support custom value formatting', () => { const pie = TestRenderer.create( - + ) const pieInstance = pie.root @@ -132,12 +134,7 @@ describe('Pie', () => { it('should support sorting data by value', () => { const pie = TestRenderer.create( - + ) const pieInstance = pie.root @@ -149,89 +146,114 @@ describe('Pie', () => { expect(slice50.props.data.arc.startAngle).toEqual(0) expect(slice30.props.data.arc.startAngle).toBeGreaterThan(0) - expect(slice20.props.data.arc.startAngle).toBeGreaterThan(slice30.props.data.arc.startAngle) + expect(slice20.props.data.arc.startAngle).toBeGreaterThan( + slice30.props.data.arc.startAngle + ) }) }) describe('layout', () => { - it('should support donut charts', () => { + it('should support donut charts', () => {}) - }) + it('should support padAngle', () => {}) - it('should support padAngle', () => { + it('should support cornerRadius', () => {}) - }) + it('should support custom start and end angles', () => {}) - it('should support cornerRadius', () => { + it('should support optimizing space usage via the fit property', () => {}) + }) - }) + describe('colors', () => { + it('should use colors from scheme', () => { + const pie = TestRenderer.create( + + ) + const pieInstance = pie.root - it('should support custom start and end angles', () => { + const slices = pieInstance.findAllByType(PieSlice) - }) + expect(slices[0].props.data.id).toEqual('A') + expect(slices[0].props.data.color).toEqual('#7fc97f') - it('should support optimizing space usage via the fit property', () => { + expect(slices[1].props.data.id).toEqual('B') + expect(slices[1].props.data.color).toEqual('#beaed4') + expect(slices[2].props.data.id).toEqual('C') + expect(slices[2].props.data.color).toEqual('#fdc086') }) - }) - describe('colors', () => { - it('should use colors from scheme', () => { - - }) + it('should allow to use colors from data using a path', () => { + const pie = TestRenderer.create( + + ) + const pieInstance = pie.root - it('should use colors from data', () => { + const slices = pieInstance.findAllByType(PieSlice) - }) - }) + expect(slices[0].props.data.id).toEqual('A') + expect(slices[0].props.data.color).toEqual('#ff5500') - describe('patterns & gradients', () => { - it('should support patterns', () => { + expect(slices[1].props.data.id).toEqual('B') + expect(slices[1].props.data.color).toEqual('#ffdd00') + expect(slices[2].props.data.id).toEqual('C') + expect(slices[2].props.data.color).toEqual('#99cc44') }) - it('should support gradients', () => { + it('should allow to use colors from data using a function', () => { + const pie = TestRenderer.create( + d.data.color} /> + ) + const pieInstance = pie.root - }) - }) + const slices = pieInstance.findAllByType(PieSlice) - describe('legends', () => { - it('should render legends', () => { + expect(slices[0].props.data.id).toEqual('A') + expect(slices[0].props.data.color).toEqual('#ff5500') + expect(slices[1].props.data.id).toEqual('B') + expect(slices[1].props.data.color).toEqual('#ffdd00') + + expect(slices[2].props.data.id).toEqual('C') + expect(slices[2].props.data.color).toEqual('#99cc44') }) }) - describe('interactivity', () => { - it('should support onClick handler', () => { - - }) + describe('patterns & gradients', () => { + it('should support patterns', () => {}) - it('should support onMouseEnter handler', () => { + it('should support gradients', () => {}) + }) - }) + describe('legends', () => { + it('should render legends', () => {}) + }) - it('should support onMouseMove handler', () => { + describe('interactivity', () => { + it('should support onClick handler', () => {}) - }) + it('should support onMouseEnter handler', () => {}) - it('should support onMouseLeave handler', () => { + it('should support onMouseMove handler', () => {}) - }) + it('should support onMouseLeave handler', () => {}) }) describe('tooltip', () => { - it('should render a tooltip when hovering a slice', () => { - }) + it('should render a tooltip when hovering a slice', () => {}) - it('should allow to override the default tooltip', () => { - }) + it('should allow to override the default tooltip', () => {}) }) describe('layers', () => { - it('should support disabling a layer', () => { - }) + it('should support disabling a layer', () => {}) - it('should support adding a custom layer', () => { - }) + it('should support adding a custom layer', () => {}) }) })