@vtex/styleguide/lib/EXPERIMENTAL_Table/hooks/__tests__/useTableVisibility.test.js

> VTEX Styleguide React components ([Docs](https://vtex.github.io/styleguide))

"use strict";

var _reactHooks = require("@testing-library/react-hooks");

var _useTableVisibility = require("../useTableVisibility");

var _useTableVisibility2 = _interopRequireDefault(_useTableVisibility);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

describe('Table V2 @ hooks/useTableVisibility spec', function () {
  var columns = [{
    id: 'name'
  }, {
    id: 'location'
  }, {
    id: 'company'
  }];
  var ids = columns.map(function (col) {
    return col.id;
  });
  it('toggles correctly', function () {
    var _renderHook = (0, _reactHooks.renderHook)(function () {
      return (0, _useTableVisibility2.default)({
        columns: columns,
        hiddenColumns: ['name']
      });
    }),
        result = _renderHook.result;

    expect(result.current.hiddenColumns).toEqual(['name']);
    expect(result.current.visibleColumns).toEqual([{
      id: 'location'
    }, {
      id: 'company'
    }]);
    (0, _reactHooks.act)(function () {
      result.current.toggleColumn('name');
    });
    expect(result.current.hiddenColumns).toEqual([]);
    expect(result.current.visibleColumns).toEqual(columns);
    (0, _reactHooks.act)(function () {
      result.current.toggleColumn('location');
    });
    expect(result.current.hiddenColumns).toEqual(['location']);
    expect(result.current.visibleColumns).toEqual([{
      id: 'name'
    }, {
      id: 'company'
    }]);
    (0, _reactHooks.act)(function () {
      result.current.toggleColumn('company');
    });
    expect(result.current.hiddenColumns).toEqual(['location', 'company']);
    expect(result.current.visibleColumns).toEqual([{
      id: 'name'
    }]);
  });
  it('shows a column correctly', function () {
    var _renderHook2 = (0, _reactHooks.renderHook)(function () {
      return (0, _useTableVisibility2.default)({
        columns: columns,
        hiddenColumns: ['name']
      });
    }),
        result = _renderHook2.result;

    expect(result.current.visibleColumns).toEqual([{
      id: 'location'
    }, {
      id: 'company'
    }]);
    (0, _reactHooks.act)(function () {
      result.current.showColumn('name');
    });
    expect(result.current.hiddenColumns).toEqual([]);
    expect(result.current.visibleColumns).toEqual(columns);
  });
  it('hides a column correctly', function () {
    var _renderHook3 = (0, _reactHooks.renderHook)(function () {
      return (0, _useTableVisibility2.default)({
        columns: columns,
        hiddenColumns: ['name']
      });
    }),
        result = _renderHook3.result;

    expect(result.current.visibleColumns).toEqual([{
      id: 'location'
    }, {
      id: 'company'
    }]);
    (0, _reactHooks.act)(function () {
      result.current.hideColumn('location');
    });
    expect(result.current.hiddenColumns).toEqual(['name', 'location']);
    expect(result.current.visibleColumns).toEqual([{
      id: 'company'
    }]);
  });
  it('hiddes all columns', function () {
    var _renderHook4 = (0, _reactHooks.renderHook)(function () {
      return (0, _useTableVisibility2.default)({
        columns: columns
      });
    }),
        result = _renderHook4.result;

    expect(result.current.hiddenColumns).toEqual([]);
    expect(result.current.visibleColumns).toEqual(columns);
    (0, _reactHooks.act)(function () {
      result.current.hideAllColumns();
    });
    expect(result.current.hiddenColumns).toEqual(ids);
    expect(result.current.visibleColumns).toEqual([]);
  });
  it('shows all columns', function () {
    var _renderHook5 = (0, _reactHooks.renderHook)(function () {
      return (0, _useTableVisibility2.default)({
        columns: columns,
        hiddenColumns: ['name', 'location', 'company']
      });
    }),
        result = _renderHook5.result;

    expect(result.current.hiddenColumns).toEqual(ids);
    expect(result.current.visibleColumns).toEqual([]);
    (0, _reactHooks.act)(function () {
      result.current.showAllColumns();
    });
    expect(result.current.hiddenColumns).toEqual([]);
    expect(result.current.visibleColumns).toEqual(columns);
  });
});