import React from 'react';
import { shallow, mount } from 'enzyme';

import Metric from '.';

describe('Metric', () => {
  it('displays a metric', () => {
    const node = shallow(<Metric data={0.98} />);
    expect(node.hasClass('Metric')).toBe(true);
  });

  it('should render a chart', () => {
    const node = mount(
      <Metric
        chart="doughnut"
        className="AdditionalTestingClass"
        data={{
          labels: ['200', '400', '404'],
          datasets: [
            {
              data: [300, 100, 50],
              backgroundColor: ['#118CFD', '#C3E2FE', '#8ABFFE'],
              hoverBackgroundColor: ['#118CFD', '#C3E2FE', '#8ABFFE'],
              hoverBorderColor: ['#fff', '#fff', '#fff'],
              borderWidth: 3,
            },
          ],
          options: {},
        }}
        style={{ margin: 10 }}
      />
    );
    expect(node.getDOMNode().classList.contains('Metric')).toBe(true);
  });
});
