vcc-ui/es/components/select-input/test.js

VCC UI is a collection of React UI Components that can be used for developing front-end applications at Volvo Car Corporation.

function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

import React from 'react';
import { SelectInput } from '.';
import createSnapshot from '../../test/create-snapshot';
import render from '../../test/render';
describe('options prop', function () {
  it('renders <SelectInput /> correctly', function () {
    var snapshot = createSnapshot(React.createElement(SelectInput, {
      onChange: function onChange() {},
      value: "c70"
    }, React.createElement("option", {
      value: "bilmodell"
    }, "Bilmodell"), React.createElement("option", {
      value: "c30",
      disabled: true
    }, "Volvo C30"), React.createElement("option", {
      value: "c70"
    }, "Volvo C70"), React.createElement("option", {
      value: "c90"
    }, "Volvo C90"), React.createElement("option", {
      value: "c40"
    }, "Volvo S40"), React.createElement("option", {
      value: "s60"
    }, "Volvo S60"), React.createElement("option", {
      value: "s80"
    }, "Volvo S80"), React.createElement("option", {
      value: "s90"
    }, "Volvo S90")));
    expect(snapshot).toMatchSnapshot();
  });
  var selectInputProps = {
    onChange: function onChange() {},
    options: [{
      value: 'bilmodell',
      label: 'Bilmodell'
    }, {
      value: 'c70',
      label: 'Volvo C70'
    }, {
      value: 'c90',
      label: 'Volvo C90'
    }, {
      value: 'c99',
      label: 'Volvo C99',
      disabled: true
    }, {
      value: 's40',
      label: 'Volvo S40'
    }, {
      value: 's60',
      label: 'Volvo S60'
    }, {
      value: 's80',
      label: 'Volvo S80'
    }, {
      value: 's90',
      label: 'Volvo S90'
    }],
    value: 'v70'
  };
  it('renders <SelectInput /> correctly with options prop', function () {
    var snapshot = createSnapshot(React.createElement(SelectInput, selectInputProps));
    expect(snapshot).toMatchSnapshot();
  });
  var selectOptGroupsProps = {
    onChange: function onChange() {},
    options: {
      Berlin: [{
        value: 'c30',
        label: 'Volvo C30'
      }, {
        value: 'c70',
        label: 'Volvo C70'
      }],
      Göteborg: [{
        value: 's40',
        label: 'Volvo S40'
      }, {
        value: 's80',
        label: 'Volvo S80'
      }]
    },
    value: 's80'
  };
  it('renders <SelectInput /> correctly', function () {
    var snapshot = createSnapshot(React.createElement(SelectInput, selectOptGroupsProps));
    expect(snapshot).toMatchSnapshot();
  });
  it('renders <SelectInput /> correctly with isValid=false', function () {
    var snapshot = createSnapshot(React.createElement(SelectInput, _extends({}, selectOptGroupsProps, {
      isValid: false
    })));
    expect(snapshot).toMatchSnapshot();
  });
  it('renders <SelectInput /> correctly with theme', function () {
    var theme = {
      colors: {
        primary: 'pink'
      },
      selectInput: {
        border: '1px solid #000'
      },
      selectInputValue: {
        fontSize: '17px'
      },
      tokens: {}
    };
    var snapshot = createSnapshot(React.createElement(SelectInput, selectInputProps), theme);
    expect(snapshot).toMatchSnapshot();
  });
  it('correctly implements ref prop', function () {
    var mockRef = React.createRef();
    render(React.createElement(SelectInput, _extends({
      ref: mockRef
    }, selectInputProps)));
    expect(mockRef.current).not.toBe(null);
  });
});