/* eslint-env mocha */

/* global sinon */

/* eslint-disable prefer-arrow-callback */

/* eslint-disable no-unused-expressions */
import React from 'react';
import createReactClass from 'create-react-class';
import PropTypes from 'prop-types';
import chai, { expect } from 'chai';
import chaiEnzyme from 'chai-enzyme'; // `this.wrapper` and `this.dom` is set in the helpers file

import { mountComponent, unmountComponent } from '../../../tests/enzyme-helpers';
import Illustration from '../../illustration';
chai.use(chaiEnzyme());
var DemoIllustration = createReactClass({
  displayName: 'DemoIllustration',
  render: function render() {
    return React.createElement(Illustration, this.props);
  }
});
describe('SLDSIllustration: ', function () {
  describe('Image with heading and message render', function () {
    var svg;
    var heading;
    var messageBody;
    beforeEach(mountComponent(React.createElement(DemoIllustration, {
      className: "custom-illustration",
      internalIllustration: true,
      heading: "Lorem ipsum dolor",
      messageBody: "Lorem ipsum dolor sit amet, consectetur",
      name: "No Access",
      path: "/assets/images/illustrations/empty-state-no-access.svg#no-access",
      size: "small",
      style: {
        backgroundColor: 'rgb(218, 165, 32)'
      }
    })));
    afterEach(unmountComponent);
    it('renders container class', function () {
      expect(this.wrapper).to.have.className('slds-illustration');
      expect(this.wrapper).to.have.className('custom-illustration');
    });
    it('renders illustration size class', function () {
      expect(this.wrapper).to.have.className('slds-illustration_small');
    });
    it('sets svg aria-hidden to true', function () {
      svg = this.wrapper.find('svg');
      expect(svg).to.have.attr('aria-hidden', 'true');
    });
    it('renders illustration svg class', function () {
      svg = this.wrapper.find('svg');
      expect(svg.hasClass('slds-illustration__svg')).to.be.true; // chai-enzyme is buggy with an svg
    });
    it('renders svg name attribute', function () {
      svg = this.wrapper.find('svg'); // also tests that all '_' and ' ' are replaced with '-'

      expect(svg).to.have.attr('name', 'no-access');
    });
    it('renders svg custom background color', function () {
      svg = this.wrapper.find('svg');
      expect(svg).to.have.style('backgroundColor', 'rgb(218, 165, 32)');
    });
    it('renders heading', function () {
      heading = this.wrapper.find('.slds-text-heading_medium');
      expect(heading.text()).to.equal('Lorem ipsum dolor');
    });
    it('renders message body', function () {
      messageBody = this.wrapper.find('.slds-text-body_regular');
      expect(messageBody.text()).to.equal('Lorem ipsum dolor sit amet, consectetur');
    });
  });
  describe('Heading and message render', function () {
    var svg;
    var heading;
    var messageBody;
    beforeEach(mountComponent(React.createElement(DemoIllustration, {
      internalIllustration: true,
      heading: "Lorem ipsum dolor",
      messageBody: "Lorem ipsum dolor sit amet, consectetur"
    })));
    afterEach(unmountComponent);
    it('does not render svg', function () {
      svg = this.wrapper.find('svg');
      expect(svg).not.to.be.present();
    });
    it('renders heading', function () {
      heading = this.wrapper.find('.slds-text-heading_medium');
      expect(heading.text()).to.equal('Lorem ipsum dolor');
    });
    it('renders message body', function () {
      messageBody = this.wrapper.find('.slds-text-body_regular');
      expect(messageBody.text()).to.equal('Lorem ipsum dolor sit amet, consectetur');
    });
  });
  describe('Heading only renders', function () {
    var svg;
    var heading;
    var messageBody;
    beforeEach(mountComponent(React.createElement(DemoIllustration, {
      internalIllustration: true,
      heading: "Lorem ipsum dolor"
    })));
    afterEach(unmountComponent);
    it('does not render svg', function () {
      svg = this.wrapper.find('svg');
      expect(svg).not.to.be.present();
    });
    it('renders heading', function () {
      heading = this.wrapper.find('.slds-text-heading_medium');
      expect(heading.text()).to.equal('Lorem ipsum dolor');
    });
    it('does not render message body', function () {
      expect(this.wrapper.find('.slds-text-body_regular')).not.to.be.present();
    });
  });
  describe('Message only renders', function () {
    var svg;
    var heading;
    var messageBody;
    beforeEach(mountComponent(React.createElement(DemoIllustration, {
      internalIllustration: true,
      messageBody: "Lorem ipsum dolor sit amet, consectetur"
    })));
    afterEach(unmountComponent);
    it('does not render svg', function () {
      svg = this.wrapper.find('svg');
      expect(svg).not.to.be.present();
    });
    it('does not render heading', function () {
      heading = this.wrapper.find('.slds-text-heading_medium');
      expect(heading).not.to.be.present();
    });
    it('renders message body', function () {
      messageBody = this.wrapper.find('.slds-text-body_regular');
      expect(messageBody.text()).to.equal('Lorem ipsum dolor sit amet, consectetur');
    });
  });
});
//# sourceMappingURL=illustration.browser-test.js.map