diff --git a/packages/vx-shape/src/shapes/AreaClosed.js b/packages/vx-shape/src/shapes/AreaClosed.js index d427d3548..1af77f648 100644 --- a/packages/vx-shape/src/shapes/AreaClosed.js +++ b/packages/vx-shape/src/shapes/AreaClosed.js @@ -1,8 +1,13 @@ import React from 'react'; import cx from 'classnames'; +import PropTypes from 'prop-types'; import { area } from 'd3-shape'; import additionalProps from '../util/additionalProps'; +AreaClosed.propTypes = { + innerRef: PropTypes.func, +}; + export default function AreaClosed({ x, y, @@ -16,6 +21,7 @@ export default function AreaClosed({ stroke = 'black', fill = 'rgba(0,0,0,0.3)', curve, + innerRef, ...restProps }) { const path = area() @@ -27,6 +33,7 @@ export default function AreaClosed({ return ( new Date(d.date); const yStock = d => d.close; const fakeXScale = scaleTime({ range: [0, 100], - domain: extent(appleStock, xStock) + domain: extent(appleStock, xStock), }); const fakeYScale = scaleLinear({ range: [100, 0], domain: [0, max(appleStock, yStock)], - nice: true + nice: true, }); const AreaClosedWrapper = ({ ...restProps }) => @@ -28,15 +29,38 @@ const AreaClosedWrapper = ({ ...restProps }) => x={xStock} y={yStock} {...restProps} - /> + />, ); -describe("", () => { - test("it should be defined", () => { +describe('', () => { + test('it should be defined', () => { expect(AreaClosed).toBeDefined(); }); - test("it should have the .vx-area-closed class", () => { - expect(AreaClosedWrapper().find('path').prop("className")).toBe("vx-area-closed"); + test('it should have the .vx-area-closed class', () => { + expect( + AreaClosedWrapper() + .find('path') + .prop('className'), + ).toBe('vx-area-closed'); + }); + + test('it should expose its ref via an innerRef prop', done => { + const node = document.createElement('div'); + const refCallback = n => { + expect(n.tagName).toEqual('PATH'); + done(); + }; + ReactDOM.render( + , + node, + ); }); });