feat(scatterplot): add unit test for aria props

Author: plouc

packages/scales/tests/compute.test.ts

@@ -1,11 +1,13 @@
 import {
+    ScaleAxis,
     generateSeriesAxis,
     stackAxis,
     // computeAxisSlices,
     computeXYScalesForSeries,
+    // @ts-ignore
 } from '../src'
 
-const axes = ['x', 'y']
+const axes: ScaleAxis[] = ['x', 'y']
 
 describe('generateSeriesAxis', () => {
     const pointScaleExpectation = {

packages/scatterplot/src/ScatterPlot.tsx

@@ -49,6 +49,9 @@ const InnerScatterPlot = <RawDatum extends ScatterPlotDatum>({
     markers = svgDefaultProps.markers,
     legends = svgDefaultProps.legends,
     role = svgDefaultProps.role,
+    ariaLabel,
+    ariaLabelledBy,
+    ariaDescribedBy,
 }: InnerScatterPlotProps<RawDatum>) => {
     const { margin, innerWidth, innerHeight, outerWidth, outerHeight } = useDimensions(
         width,
@@ -194,7 +197,15 @@ const InnerScatterPlot = <RawDatum extends ScatterPlotDatum>({
     }
 
     return (
-        <SvgWrapper width={outerWidth} height={outerHeight} margin={margin} role={role}>
+        <SvgWrapper
+            width={outerWidth}
+            height={outerHeight}
+            margin={margin}
+            role={role}
+            ariaLabel={ariaLabel}
+            ariaLabelledBy={ariaLabelledBy}
+            ariaDescribedBy={ariaDescribedBy}
+        >
             {layers.map((layer, i) => {
                 if (typeof layer === 'string' && layerById[layer] !== undefined) {
                     return layerById[layer]

packages/scatterplot/tests/ScatterPlot.test.tsx

@@ -382,4 +382,21 @@ describe('annotations', () => {
     it('should support markers', () => {})
 })
 
-describe('accessibility', () => {})
+describe('accessibility', () => {
+    it('should forward root aria properties to the SVG element', () => {
+        const wrapper = mount(
+            <ScatterPlot<TestDatum>
+                {...baseProps}
+                ariaLabel="AriaLabel"
+                ariaLabelledBy="AriaLabelledBy"
+                ariaDescribedBy="AriaDescribedBy"
+            />
+        )
+
+        const svg = wrapper.find('svg')
+
+        expect(svg.prop('aria-label')).toBe('AriaLabel')
+        expect(svg.prop('aria-labelledby')).toBe('AriaLabelledBy')
+        expect(svg.prop('aria-describedby')).toBe('AriaDescribedBy')
+    })
+})

packages/stream/tests/Stream.test.tsx

@@ -1,4 +1,5 @@
 import { mount } from 'enzyme'
+// @ts-ignore
 import { Stream, StreamLayerData, StreamLayerDatum, StreamSliceData, StreamSvgProps } from '../src'
 
 type TestDatum = {