Fixed all tests to work with new tags sorting approach

test/tags/TagCard.test.tsx

@@ -8,19 +8,14 @@ import { ReachableServer } from '../../src/servers/data';
 
 describe('<TagCard />', () => {
   let wrapper: ShallowWrapper;
-  const tagStats = {
-    shortUrlsCount: 48,
-    visitsCount: 23257,
-  };
   const DeleteTagConfirmModal = jest.fn();
   const EditTagModal = jest.fn();
   const TagCard = createTagCard(DeleteTagConfirmModal, EditTagModal, Mock.all<ColorGenerator>());
   const createWrapper = (tag = 'ssr') => {
     wrapper = shallow(
       <TagCard
-        tag={tag}
+        tag={{ tag, visits: 23257, shortUrls: 48 }}
         selectedServer={Mock.of<ReachableServer>({ id: '1' })}
-        tagStats={tagStats}
         displayed={true}
         toggle={() => {}}
       />,

test/tags/TagsCards.test.tsx

@@ -1,19 +1,19 @@
 import { shallow, ShallowWrapper } from 'enzyme';
 import { Mock } from 'ts-mockery';
 import { TagsCards as createTagsCards } from '../../src/tags/TagsCards';
-import { TagsList } from '../../src/tags/reducers/tagsList';
 import { SelectedServer } from '../../src/servers/data';
 import { rangeOf } from '../../src/utils/utils';
+import { NormalizedTag } from '../../src/tags/data';
 
 describe('<TagsCards />', () => {
   const amountOfTags = 10;
-  const tagsList = Mock.of<TagsList>({ filteredTags: rangeOf(amountOfTags, (i) => `tag_${i}`), stats: {} });
+  const sortedTags = rangeOf(amountOfTags, (i) => Mock.of<NormalizedTag>({ tag: `tag_${i}` }));
   const TagCard = () => null;
   const TagsCards = createTagsCards(TagCard);
   let wrapper: ShallowWrapper;
 
   beforeEach(() => {
-    wrapper = shallow(<TagsCards tagsList={tagsList} selectedServer={Mock.all<SelectedServer>()} />);
+    wrapper = shallow(<TagsCards sortedTags={sortedTags} selectedServer={Mock.all<SelectedServer>()} />);
   });
 
   afterEach(() => wrapper?.unmount());

test/tags/TagsList.test.tsx

@@ -37,17 +37,21 @@ describe('<TagsList />', () => {
   it('shows a loading message when tags are being loaded', () => {
     const wrapper = createWrapper({ loading: true });
     const loadingMsg = wrapper.find(Message);
+    const searchField = wrapper.find(SearchField);
 
     expect(loadingMsg).toHaveLength(1);
     expect(loadingMsg.html()).toContain('Loading...');
+    expect(searchField).toHaveLength(0);
   });
 
   it('shows an error when tags failed to be loaded', () => {
     const wrapper = createWrapper({ error: true });
     const errorMsg = wrapper.find(Result).filterWhere((result) => result.prop('type') === 'error');
+    const searchField = wrapper.find(SearchField);
 
     expect(errorMsg).toHaveLength(1);
     expect(errorMsg.html()).toContain('Error loading tags :(');
+    expect(searchField).toHaveLength(0);
   });
 
   it('shows a message when the list of tags is empty', () => {

test/tags/TagsTable.test.tsx

@@ -4,24 +4,26 @@ import { match } from 'react-router';
 import { Location, History } from 'history';
 import { TagsTable as createTagsTable } from '../../src/tags/TagsTable';
 import { SelectedServer } from '../../src/servers/data';
-import { TagsList } from '../../src/tags/reducers/tagsList';
 import { rangeOf } from '../../src/utils/utils';
 import SimplePaginator from '../../src/common/SimplePaginator';
 import { NormalizedTag } from '../../src/tags/data';
 
 describe('<TagsTable />', () => {
   const TagsTableRow = () => null;
+  const orderByColumn = jest.fn();
   const TagsTable = createTagsTable(TagsTableRow);
   const tags = (amount: number) => rangeOf(amount, (i) => `tag_${i}`);
   let wrapper: ShallowWrapper;
-  const createWrapper = (filteredTags: string[] = [], search = '') => {
+  const createWrapper = (sortedTags: string[] = [], search = '') => {
     wrapper = shallow(
       <TagsTable
-        tagsList={Mock.of<TagsList>({ stats: {}, filteredTags })}
+        sortedTags={sortedTags.map((tag) => Mock.of<NormalizedTag>({ tag }))}
         selectedServer={Mock.all<SelectedServer>()}
+        currentOrder={{}}
         history={Mock.all<History>()}
         location={Mock.of<Location>({ search })}
         match={Mock.all<match>()}
+        orderByColumn={() => orderByColumn}
       />,
     );
 
@@ -33,6 +35,7 @@ describe('<TagsTable />', () => {
     (global as any).history = { pushState: jest.fn() };
   });
 
+  afterEach(jest.clearAllMocks);
   afterEach(() => wrapper?.unmount());
 
   it('renders empty result if there are no tags', () => {
@@ -99,22 +102,11 @@ describe('<TagsTable />', () => {
 
   it('orders tags when column is clicked', () => {
     const wrapper = createWrapper(tags(100));
-    const firstRowText = () => (wrapper.find('tbody').find(TagsTableRow).first().prop('tag') as NormalizedTag).tag;
 
-    expect(firstRowText()).toEqual('tag_1');
-    wrapper.find('thead').find('th').first().simulate('click'); // Tag column ASC
-    expect(firstRowText()).toEqual('tag_1');
-    wrapper.find('thead').find('th').first().simulate('click'); // Tag column DESC
-    expect(firstRowText()).toEqual('tag_99');
-    wrapper.find('thead').find('th').at(2).simulate('click'); // Visits column - ASC
-    expect(firstRowText()).toEqual('tag_100');
-    wrapper.find('thead').find('th').at(2).simulate('click'); // Visits column - DESC
-    expect(firstRowText()).toEqual('tag_1');
-    wrapper.find('thead').find('th').at(2).simulate('click'); // Visits column - reset
-    expect(firstRowText()).toEqual('tag_1');
-    wrapper.find('thead').find('th').at(1).simulate('click'); // Short URLs column - ASC
-    expect(firstRowText()).toEqual('tag_100');
-    wrapper.find('thead').find('th').at(1).simulate('click'); // Short URLs column - DESC
-    expect(firstRowText()).toEqual('tag_1');
+    expect(orderByColumn).not.toHaveBeenCalled();
+    wrapper.find('thead').find('th').first().simulate('click');
+    wrapper.find('thead').find('th').at(2).simulate('click');
+    wrapper.find('thead').find('th').at(1).simulate('click');
+    expect(orderByColumn).toHaveBeenCalledTimes(3);
   });
 });