wix-style-react/dist/es/src/Loader/Loader.spec.js

wix-style-react

var _this = this;

function _asyncToGenerator(fn) { return function () { var gen = fn.apply(this, arguments); return new Promise(function (resolve, reject) { function step(key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { return Promise.resolve(value).then(function (value) { step("next", value); }, function (err) { step("throw", err); }); } } return step("next"); }); }; }

import React from 'react';
import Loader from './Loader';
import loaderDriverFactory from './Loader.driver';
import { createDriverFactory } from 'wix-ui-test-utils/driver-factory';
import { loaderTestkitFactory } from '../../testkit';
import { loaderTestkitFactory as enzymeLoaderTestkitFactory } from '../../testkit/enzyme';
import { isEnzymeTestkitExists, isTestkitExists } from '../../test/utils/testkit-sanity';
import { mount } from 'enzyme';

describe('Loader', function () {
  var createDriver = createDriverFactory(loaderDriverFactory);

  describe('size property', function () {
    it('should create a component with default medium size', function () {
      var driver = createDriver(React.createElement(Loader, null));
      expect(driver.isMedium()).toEqual(true);
    });

    it('should allow creating a tiny loader', function () {
      var driver = createDriver(React.createElement(Loader, { size: 'tiny' }));
      expect(driver.isTiny()).toEqual(true);
    });

    it('should allow creating a small loader', function () {
      var driver = createDriver(React.createElement(Loader, { size: 'small' }));
      expect(driver.isSmall()).toEqual(true);
    });

    it('should allow creating a medium loader', function () {
      var driver = createDriver(React.createElement(Loader, { size: 'medium' }));
      expect(driver.isMedium()).toEqual(true);
    });

    it('should allow creating a large loader', function () {
      var driver = createDriver(React.createElement(Loader, { size: 'large' }));
      expect(driver.isLarge()).toEqual(true);
    });
  });

  describe('text property', function () {
    it('should create a component with no text by default', function () {
      var driver = createDriver(React.createElement(Loader, null));
      expect(driver.hasText()).toEqual(false);
    });

    it('should create a component with text', function () {
      var text = 'All computers wait at the same speed';
      var driver = createDriver(React.createElement(Loader, { text: text }));
      expect(driver.hasText()).toEqual(true);
      expect(driver.getText()).toEqual(text);
    });

    it('should create a component with text element', function () {
      var text = 'All computers wait at the same speed';
      var textElement = React.createElement(
        'div',
        null,
        text
      );
      var driver = createDriver(React.createElement(Loader, { text: textElement }));
      expect(driver.hasText()).toEqual(true);
      expect(driver.getText()).toMatch(text);
    });

    it('should not show text next to tiny loader', function () {
      var size = 'tiny';
      var text = 'All computers wait at the same speed';
      var driver = createDriver(React.createElement(Loader, { size: size, text: text }));
      expect(driver.hasText()).toEqual(false);
    });
  });

  describe('color property', function () {
    it('should be blue by default', function () {
      var driver = createDriver(React.createElement(Loader, null));
      expect(driver.getColor()).toEqual('blue');
    });

    it('should get the given color', function () {
      var driver = createDriver(React.createElement(Loader, { color: 'white' }));
      expect(driver.getColor()).toEqual('white');
    });
  });

  describe('status property', function () {
    it('should be loading by default', function () {
      var driver = createDriver(React.createElement(Loader, null));
      expect(driver.isLoading()).toEqual(true);
    });

    it('should allow setting error status', function () {
      var driver = createDriver(React.createElement(Loader, { status: 'error' }));
      expect(driver.isError()).toEqual(true);
    });

    it('should allow setting success status', function () {
      var driver = createDriver(React.createElement(Loader, { status: 'success' }));
      expect(driver.isSuccess()).toEqual(true);
    });

    describe('tooltip message when hovered', function () {
      afterEach(function () {
        document.body.innerHTML = ''; // required for tooltip element to be removed and not to leak in consecutive tests
      });

      it('should show tooltip when hovered', _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
        var statusMessage, driver;
        return regeneratorRuntime.wrap(function _callee$(_context) {
          while (1) {
            switch (_context.prev = _context.next) {
              case 0:
                statusMessage = 'this is a some message';
                driver = createDriver(React.createElement(Loader, { status: 'success', statusMessage: statusMessage }));
                _context.t0 = expect;
                _context.next = 5;
                return driver.getStatusMessage();

              case 5:
                _context.t1 = _context.sent;
                _context.t2 = statusMessage;
                (0, _context.t0)(_context.t1).toBe(_context.t2);

              case 8:
              case 'end':
                return _context.stop();
            }
          }
        }, _callee, _this);
      })));
    });
  });

  describe('testkit', function () {
    it('should exist', function () {
      expect(isTestkitExists(React.createElement(Loader, null), loaderTestkitFactory)).toBe(true);
    });
  });

  describe('enzyme testkit', function () {
    it('should exist', function () {
      expect(isEnzymeTestkitExists(React.createElement(Loader, null), enzymeLoaderTestkitFactory, mount)).toBe(true);
    });
  });

  it('shouldn\'t throw when the Loader doesn\'t exist', function () {
    expect(function () {
      return loaderDriverFactory({});
    }).not.toThrow();
  });
});