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

import {DynamicGridLayout} from 'src/components';
import * as Dashboard from 'src/main/components/Dashboard';

describe('src/main/components/Dashboard', () => {
  describe('Dashboard', () => {
    let layout = null;
    let mockOnGridLayoutChange = null;

    beforeEach(() => {
      layout = [{i: 'test', x: 0, y: 0, w: 1, h: 1}];
      mockOnGridLayoutChange = jasmine.createSpy();
    });

    it('configures and renders the DynamicGridLayout', () => {
      // Given
      const component = shallow(
        <Dashboard.Dashboard
          layout={layout}
          onGridLayoutChange={mockOnGridLayoutChange}
        >
          <span key="test">It works!</span>
        </Dashboard.Dashboard>
      );

      // Then
      const dynamicGridLayout = component.find(DynamicGridLayout).at(0);
      expect(dynamicGridLayout.exists()).toBe(true);
      expect(dynamicGridLayout.prop('cols')).toEqual(12);
      expect(dynamicGridLayout.prop('layout')).toEqual(layout);
      expect(dynamicGridLayout.prop('rowHeight')).toEqual(30);
      expect(dynamicGridLayout.prop('onLayoutChange')).toEqual(
        mockOnGridLayoutChange
      );
    });

    it('renders the children', () => {
      // Given
      const children = <span key="test">It works!</span>;
      const component = shallow(
        <Dashboard.Dashboard
          layout={layout}
          onGridLayoutChange={mockOnGridLayoutChange}
        >
          {children}
        </Dashboard.Dashboard>
      );

      // Then
      expect(component.contains(children)).toBe(true);
    });
  });
});