From e882b46287430bce0bab139e2bf95f46fc82b190 Mon Sep 17 00:00:00 2001
From: Chris Williams <chris.williams@airbnb.com>
Date: Thu, 15 Oct 2020 15:13:24 -0700
Subject: [PATCH] test(xychart): add Animated(BarGroup, BarStack, BarSeries,
 LineSeries) tests

---
 .../test/components/BarGroup.test.tsx         | 24 ++++++++++++--
 .../test/components/BarSeries.test.tsx        | 19 +++++++++++-
 .../test/components/BarStack.test.tsx         | 31 +++++++++++++++++--
 .../test/components/LineSeries.test.tsx       | 19 +++++++++++-
 4 files changed, 87 insertions(+), 6 deletions(-)

diff --git a/packages/visx-xychart/test/components/BarGroup.test.tsx b/packages/visx-xychart/test/components/BarGroup.test.tsx
index a492b53d52..f7b64deccc 100644
--- a/packages/visx-xychart/test/components/BarGroup.test.tsx
+++ b/packages/visx-xychart/test/components/BarGroup.test.tsx
@@ -1,6 +1,7 @@
 import React, { useEffect } from 'react';
+import { animated } from 'react-spring';
 import { mount } from 'enzyme';
-import { BarGroup, BarSeries, DataProvider, useEventEmitter } from '../../src';
+import { AnimatedBarGroup, BarGroup, BarSeries, DataProvider, useEventEmitter } from '../../src';
 import setupTooltipTest from '../mocks/setupTooltipTest';
 
 const providerProps = {
@@ -77,7 +78,7 @@ describe('<BarGroup />', () => {
 
     setupTooltipTest(
       <>
-        <BarGroup horizontal>
+        <BarGroup>
           <BarSeries dataKey={series1.key} {...series1} />
           <BarSeries dataKey={series2.key} {...series2} />
         </BarGroup>
@@ -87,3 +88,22 @@ describe('<BarGroup />', () => {
     );
   });
 });
+
+describe('<AnimatedBarGroup />', () => {
+  it('should be defined', () => {
+    expect(AnimatedBarGroup).toBeDefined();
+  });
+  it('should render an animated.rect', () => {
+    const wrapper = mount(
+      <DataProvider {...providerProps}>
+        <svg>
+          <AnimatedBarGroup>
+            <BarSeries dataKey={series1.key} {...series1} />
+            <BarSeries dataKey={series2.key} {...series2} />
+          </AnimatedBarGroup>
+        </svg>
+      </DataProvider>,
+    );
+    expect(wrapper.find(animated.rect)).toHaveLength(4);
+  });
+});
diff --git a/packages/visx-xychart/test/components/BarSeries.test.tsx b/packages/visx-xychart/test/components/BarSeries.test.tsx
index e6633ad569..19b9bf5d92 100644
--- a/packages/visx-xychart/test/components/BarSeries.test.tsx
+++ b/packages/visx-xychart/test/components/BarSeries.test.tsx
@@ -1,6 +1,7 @@
 import React, { useContext, useEffect } from 'react';
+import { animated } from 'react-spring';
 import { mount } from 'enzyme';
-import { DataContext, BarSeries, useEventEmitter } from '../../src';
+import { DataContext, AnimatedBarSeries, BarSeries, useEventEmitter } from '../../src';
 import getDataContext from '../mocks/getDataContext';
 import setupTooltipTest from '../mocks/setupTooltipTest';
 
@@ -62,3 +63,19 @@ describe('<BarSeries />', () => {
     );
   });
 });
+
+describe('<AnimatedBarSeries />', () => {
+  it('should be defined', () => {
+    expect(AnimatedBarSeries).toBeDefined();
+  });
+  it('should render an animated.rect', () => {
+    const wrapper = mount(
+      <DataContext.Provider value={getDataContext(series)}>
+        <svg>
+          <AnimatedBarSeries dataKey={series.key} {...series} />
+        </svg>
+      </DataContext.Provider>,
+    );
+    expect(wrapper.find(animated.rect)).toHaveLength(series.data.length);
+  });
+});
diff --git a/packages/visx-xychart/test/components/BarStack.test.tsx b/packages/visx-xychart/test/components/BarStack.test.tsx
index ef22c3f27f..5b90e14dd8 100644
--- a/packages/visx-xychart/test/components/BarStack.test.tsx
+++ b/packages/visx-xychart/test/components/BarStack.test.tsx
@@ -1,6 +1,14 @@
 import React, { useContext, useEffect } from 'react';
 import { mount } from 'enzyme';
-import { BarStack, BarSeries, DataProvider, DataContext, useEventEmitter } from '../../src';
+import { animated } from 'react-spring';
+import {
+  BarStack,
+  BarSeries,
+  DataProvider,
+  DataContext,
+  useEventEmitter,
+  AnimatedBarStack,
+} from '../../src';
 import setupTooltipTest from '../mocks/setupTooltipTest';
 
 const providerProps = {
@@ -109,7 +117,7 @@ describe('<BarStack />', () => {
 
     setupTooltipTest(
       <>
-        <BarStack horizontal>
+        <BarStack>
           <BarSeries dataKey={series1.key} {...series1} />
           <BarSeries dataKey={series2.key} {...series2} />
         </BarStack>
@@ -119,3 +127,22 @@ describe('<BarStack />', () => {
     );
   });
 });
+
+describe('<AnimatedBarStack />', () => {
+  it('should be defined', () => {
+    expect(AnimatedBarStack).toBeDefined();
+  });
+  it('should render an animated.rect', () => {
+    const wrapper = mount(
+      <DataProvider {...providerProps}>
+        <svg>
+          <AnimatedBarStack>
+            <BarSeries dataKey={series1.key} {...series1} />
+            <BarSeries dataKey={series2.key} {...series2} />
+          </AnimatedBarStack>
+        </svg>
+      </DataProvider>,
+    );
+    expect(wrapper.find(animated.rect)).toHaveLength(4);
+  });
+});
diff --git a/packages/visx-xychart/test/components/LineSeries.test.tsx b/packages/visx-xychart/test/components/LineSeries.test.tsx
index 7a0ab88905..928ae7116c 100644
--- a/packages/visx-xychart/test/components/LineSeries.test.tsx
+++ b/packages/visx-xychart/test/components/LineSeries.test.tsx
@@ -1,7 +1,8 @@
 import React, { useContext, useEffect } from 'react';
+import { animated } from 'react-spring';
 import { mount } from 'enzyme';
 import { LinePath } from '@visx/shape';
-import { DataContext, LineSeries, useEventEmitter } from '../../src';
+import { AnimatedLineSeries, DataContext, LineSeries, useEventEmitter } from '../../src';
 import getDataContext from '../mocks/getDataContext';
 import setupTooltipTest from '../mocks/setupTooltipTest';
 
@@ -64,3 +65,19 @@ describe('<LineSeries />', () => {
     );
   });
 });
+
+describe('<AnimatedLineSeries />', () => {
+  it('should be defined', () => {
+    expect(AnimatedLineSeries).toBeDefined();
+  });
+  it('should render an animated.path', () => {
+    const wrapper = mount(
+      <DataContext.Provider value={getDataContext(series)}>
+        <svg>
+          <AnimatedLineSeries dataKey={series.key} {...series} />
+        </svg>
+      </DataContext.Provider>,
+    );
+    expect(wrapper.find(animated.path)).toHaveLength(1);
+  });
+});