import ReactDOM from 'react-dom';
import React from 'react';
import { shallow, render } from 'enzyme';
import { expect } from 'chai';
import { Text } from 'recharts';

describe('<Text />', () => {
  it('Does not wrap long text if enough width', () => {
    const wrapper = shallow(
      <Text width={144}>This is really long text</Text>
    );

    expect(wrapper.instance().state.wordsByLines.length).to.equal(1);
  });

  it('Wraps long text if not enough width', () => {
    const wrapper = shallow(
      <Text width={143}>This is really long text</Text>
    );

    expect(wrapper.instance().state.wordsByLines.length).to.equal(2);
  });

  it('Wraps long text if styled and not enough room', () => {
    const wrapper = shallow(
      <Text width={144} style={{ fontWeight: 900 }}>This is really long text</Text>
    );

    expect(wrapper.instance().state.wordsByLines.length).to.equal(2);
  });

  it('Does not perform word length calculation if width or fit props not set', () => {
    const wrapper = shallow(
      <Text>This is really long text</Text>
    );

    expect(wrapper.instance().state.wordsByLines.length).to.equal(1);
    expect(wrapper.instance().state.wordsByLines[0].width).to.equal(undefined);
  });
});

@@ -294,19 +294,19 @@
  width=%7B
-144
+200
 %7D%3EThis i
@@ -521,10 +521,10 @@
 h=%7B1
-43
+00
 %7D%3ETh
@@ -752,11 +752,11 @@
 th=%7B
-144
+200
 %7D st
@@ -770,19 +770,19 @@
 font
-Weight: 900
+Size: '2em'
  %7D%7D%3E

Update <Text> tests so they are not as particular about browser differences