wix-style-react/dist/es/src/Backoffice/Button/Button.spec.js

wix-style-react

import React from 'react';
import ReactTestUtils from 'react-dom/test-utils';
import buttonDriverFactory from './Button.driver';
import Button from './Button';
import { createDriverFactory } from 'wix-ui-test-utils/driver-factory';
import { buttonTestkitFactory } from '../../../testkit';
import { buttonTestkitFactory as enzymeButtonTestkitFactory } from '../../../testkit/enzyme';
import { mount } from 'enzyme';

describe('Button', function () {
  var createDriver = createDriverFactory(buttonDriverFactory);

  it('should click a button', function () {
    var onClick = jest.fn();
    var driver = createDriver(React.createElement(Button, { onClick: onClick }));

    driver.click();
    expect(onClick).toBeCalled();
  });

  it('should not call onClick when disabled', function () {
    var onClick = jest.fn();
    var driver = createDriver(React.createElement(Button, { onClick: onClick, disabled: true }));

    driver.click();
    expect(onClick).toHaveBeenCalledTimes(0);
  });

  it('should not call focusableOnFocus when disabled', function () {
    var focus = jest.fn();
    var driver = createDriver(React.createElement(Button, { focusableOnFocus: focus, disabled: true }));

    driver.focus();
    expect(focus).toHaveBeenCalledTimes(0);
  });

  it('should not call focusableOnBlur when disabled', function () {
    var blur = jest.fn();
    var driver = createDriver(React.createElement(Button, { focusableOnBlur: blur, disabled: true }));

    driver.blur();
    expect(blur).toHaveBeenCalledTimes(0);
  });

  it('should call onMouseEnter when disabled', function () {
    var mouseEnter = jest.fn();
    var driver = createDriver(React.createElement(Button, { onMouseEnter: mouseEnter, disabled: true }));

    driver.mouseEnter();
    expect(mouseEnter).toHaveBeenCalledTimes(1);
  });

  it('should call onMouseLeave when disabled', function () {
    var mouseLeave = jest.fn();
    var driver = createDriver(React.createElement(Button, { onMouseLeave: mouseLeave, disabled: true }));

    driver.mouseLeave();
    expect(mouseLeave).toHaveBeenCalledTimes(1);
  });

  it('should get disabled class', function () {
    var driver = createDriver(React.createElement(Button, { disabled: true }));

    expect(driver.isButtonDisabled()).toBe(true);
  });

  it('should render children', function () {
    var children = '<div>123</div>';
    var driver = createDriver(React.createElement(
      Button,
      null,
      children
    ));

    expect(driver.getButtonTextContent()).toBe(children);
  });

  it('should have a prefixIcon', function () {
    var driver = createDriver(React.createElement(Button, { prefixIcon: React.createElement('div', null) }));

    expect(driver.isSuffixIconExists()).toBeFalsy();
    expect(driver.isPrefixIconExists()).toBeTruthy();
  });

  it('should have a suffixIcon', function () {
    var driver = createDriver(React.createElement(Button, { suffixIcon: React.createElement('div', null) }));

    expect(driver.isPrefixIconExists()).toBeFalsy();
    expect(driver.isSuffixIconExists()).toBeTruthy();
  });
});

describe('testkit', function () {
  it('should exist', function () {
    var div = document.createElement('div');
    var dataHook = 'myDataHook';
    var onClick = jest.fn();
    var wrapper = div.appendChild(ReactTestUtils.renderIntoDocument(React.createElement(
      'div',
      null,
      React.createElement(Button, { onClick: onClick, dataHook: dataHook })
    )));
    var buttonTestkit = buttonTestkitFactory({ wrapper: wrapper, dataHook: dataHook });
    expect(buttonTestkit.exists()).toBeTruthy();
  });
});

describe('enzyme testkit', function () {
  it('should exist', function () {
    var dataHook = 'myDataHook';
    var onClick = jest.fn();
    var wrapper = mount(React.createElement(Button, { onClick: onClick, dataHook: dataHook }));
    var buttonTestkit = enzymeButtonTestkitFactory({ wrapper: wrapper, dataHook: dataHook });
    expect(buttonTestkit.exists()).toBeTruthy();
  });
});