@blaze-cms/react-page-builder 0.124.0-alpha.7 → 0.124.0

package/tests/unit/src/components/ItemList/ItemListButton.test.js

@@ -0,0 +1,175 @@
+import React from 'react';
+import '@testing-library/jest-dom/extend-expect';
+import { render, waitFor, fireEvent } from '@testing-library/react';
+import { MockedProvider } from '@apollo/client/testing';
+
+import ItemListButton from '../../../../../src/components/ItemList/ItemListButton';
+import {
+  getItemList,
+  addItemsToList,
+  removeItemsFromList
+} from '../../../../../src/application/query';
+import userItemListId from '../../../../../src/components/ItemList/hooks/use-item-list-id';
+import setItemListId from '../../../../../src/components/ItemList/helpers/set-item-list-id';
+
+jest.mock('../../../../../src/components/ItemList/hooks/use-item-list-id', () =>
+  jest.fn(() => ({ listId: 'LIST ID' }))
+);
+
+jest.mock('../../../../../src/components/ItemList/helpers/set-item-list-id', () => {
+  const originalModule = jest.requireActual(
+    '../../../../../src/components/ItemList/helpers/set-item-list-id'
+  );
+  return jest.fn((...args) => originalModule.default(...args));
+});
+
+const listId = 'LIST ID';
+const missingListId = 'MISSING';
+const emptyListId = 'EMPTY';
+const listItem = { itemId: 'ID', itemEntity: 'ENTITY' };
+const listName = 'list_name';
+const props = {
+  listName,
+  modifier: 'modifier',
+  parent: {
+    itemId: 'ID',
+    itemEntity: 'ENTITY'
+  }
+};
+
+const mocks = [
+  {
+    request: {
+      query: getItemList,
+      variables: { id: listId }
+    },
+    result: {
+      data: {
+        getItemList: { id: listId, listItems: [listItem] }
+      }
+    }
+  },
+  {
+    request: {
+      query: getItemList,
+      variables: { id: missingListId }
+    },
+    result: {
+      data: {
+        getItemList: null
+      }
+    }
+  },
+  {
+    request: {
+      query: getItemList,
+      variables: { id: emptyListId }
+    },
+    result: {
+      data: {
+        getItemList: { id: emptyListId, listItems: [] }
+      }
+    }
+  },
+  {
+    request: {
+      query: addItemsToList,
+      variables: { name: listName, id: '', listItems: [props.parent] }
+    },
+    result: {
+      data: {
+        addItemsToList: {
+          result: { id: listId, listItems: [listItem] }
+        }
+      }
+    }
+  },
+  {
+    request: {
+      query: removeItemsFromList,
+      variables: { listId, listItems: [props.parent] }
+    },
+    result: {
+      data: {
+        removeItemsFromList: {
+          result: { id: listId, listItems: [listItem] }
+        }
+      }
+    }
+  }
+];
+
+const selectedClasses = 'item-list-button item-list-button--selected modifier';
+const unselectedClasses = 'item-list-button modifier';
+const buttonRole = 'button';
+
+describe('ItemListButton component', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('should render button marked selected when current parent is in the list', async () => {
+    const { asFragment, getByRole } = render(
+      <MockedProvider mocks={mocks}>
+        <ItemListButton {...props} />
+      </MockedProvider>
+    );
+
+    await waitFor(() => getByRole(buttonRole));
+    const button = getByRole(buttonRole);
+    expect(button).toHaveClass(selectedClasses);
+    expect(asFragment()).toMatchSnapshot();
+  });
+
+  it('should add and remove item to the list on click', async () => {
+    userItemListId.mockReturnValueOnce({ listId: '' }).mockReturnValueOnce({ listId });
+    const { asFragment, getByRole } = render(
+      <MockedProvider mocks={mocks}>
+        <ItemListButton {...props} />
+      </MockedProvider>
+    );
+
+    await waitFor(() => getByRole(buttonRole));
+    const button = getByRole(buttonRole);
+    fireEvent.click(button);
+    await waitFor(() => getByRole(buttonRole));
+    const selectedButton = getByRole(buttonRole);
+    expect(selectedButton).toHaveClass(selectedClasses);
+    expect(asFragment()).toMatchSnapshot();
+
+    fireEvent.click(selectedButton);
+    await waitFor(() => getByRole(buttonRole));
+    const removedButton = getByRole(buttonRole);
+    expect(removedButton).toHaveClass(unselectedClasses);
+    expect(asFragment()).toMatchSnapshot();
+  });
+
+  it('should set list id from mutation', async () => {
+    userItemListId.mockReturnValue({ listId: '' });
+    const { getByRole } = render(
+      <MockedProvider mocks={mocks}>
+        <ItemListButton {...props} />
+      </MockedProvider>
+    );
+
+    await waitFor(() => getByRole(buttonRole));
+    const button = getByRole(buttonRole);
+    fireEvent.click(button);
+    await waitFor(() => getByRole(buttonRole));
+    expect(setItemListId).toHaveBeenCalledWith(listName, listId);
+  });
+
+  it('should render button not marked selected when current parent is not in the list', async () => {
+    userItemListId.mockReturnValue({ listId: emptyListId });
+    const { asFragment, getByRole } = render(
+      <MockedProvider mocks={mocks}>
+        <ItemListButton {...props} />
+      </MockedProvider>
+    );
+
+    await waitFor(() => getByRole(buttonRole));
+    const button = getByRole(buttonRole);
+    expect(button).toHaveClass(unselectedClasses);
+    expect(asFragment()).toMatchSnapshot();
+  });
+});

package/tests/unit/src/components/ItemList/ItemListCounter.test.js

@@ -0,0 +1,65 @@
+import React from 'react';
+import '@testing-library/jest-dom/extend-expect';
+import { render, waitFor, fireEvent } from '@testing-library/react';
+import { MockedProvider } from '@apollo/client/testing';
+import { useRouter } from 'next/router';
+import ItemListCounter from '../../../../../src/components/ItemList/ItemListCounter';
+import { getItemList } from '../../../../../src/application/query';
+
+jest.mock('../../../../../src/components/ItemList/hooks/use-item-list-id', () =>
+  jest.fn(() => ({ listId: 'LIST ID' }))
+);
+
+jest.mock('next/router', () => {
+  const push = jest.fn();
+  return {
+    useRouter: jest.fn(() => ({ push }))
+  };
+});
+
+const listId = 'LIST ID';
+const listItem = { itemId: 'ID', itemEntity: 'ENTITY' };
+const listName = 'list_name';
+const props = {
+  listName,
+  modifier: 'modifier',
+  url: '/list-url'
+};
+
+const mocks = [
+  {
+    request: {
+      query: getItemList,
+      variables: { id: listId }
+    },
+    result: {
+      data: {
+        getItemList: { id: listId, listItems: [listItem] }
+      }
+    }
+  }
+];
+
+const buttonRole = 'button';
+const router = useRouter();
+
+describe('ItemListCounter component', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('should display listItem count and route to url', async () => {
+    const { asFragment, getByRole, getByText } = render(
+      <MockedProvider mocks={mocks}>
+        <ItemListCounter {...props} />
+      </MockedProvider>
+    );
+    await waitFor(() => getByText('1'));
+
+    const button = getByRole(buttonRole);
+    expect(asFragment()).toMatchSnapshot();
+
+    fireEvent.click(button);
+    expect(router.push).toHaveBeenCalledWith('/Resolver', `${props.url}?itemListId=${listId}`);
+  });
+});

package/tests/unit/src/components/ItemList/ItemListNew.test.js

@@ -0,0 +1,164 @@
+import React from 'react';
+import '@testing-library/jest-dom/extend-expect';
+import { render, waitFor, fireEvent } from '@testing-library/react';
+import { MockedProvider } from '@apollo/client/testing';
+import { useRouter } from 'next/router';
+import ItemListNew from '../../../../../src/components/ItemList/ItemListNew';
+import { getItemList } from '../../../../../src/application/query';
+import userItemListId from '../../../../../src/components/ItemList/hooks/use-item-list-id';
+import getItemListData from '../../../../../src/components/ItemList/helpers/get-item-list-data';
+import setItemListId from '../../../../../src/components/ItemList/helpers/set-item-list-id';
+import setParamAndRedirect from '../../../../../src/components/ItemList/helpers/set-param-and-redirect';
+import { LIST_ITEM_QUERY_PARAM } from '../../../../../src/components/ItemList/constants';
+
+jest.mock('next/router', () => {
+  const useRouterMock = jest.fn(() => ({ asPath: '/test' }));
+  return { useRouter: useRouterMock };
+});
+
+jest.mock('../../../../../src/components/ItemList/hooks/use-item-list-id', () =>
+  jest.fn(() => ({ listId: 'LIST ID' }))
+);
+
+jest.mock('../../../../../src/components/ItemList/helpers/set-item-list-id', () => {
+  const originalModule = jest.requireActual(
+    '../../../../../src/components/ItemList/helpers/set-item-list-id'
+  );
+  return jest.fn((...args) => originalModule.default(...args));
+});
+
+jest.mock('../../../../../src/components/ItemList/helpers/set-param-and-redirect', () => jest.fn());
+
+jest.mock('../../../../../src/components/ItemList/helpers/get-item-list-data', () => {
+  const originalModule = jest.requireActual(
+    '../../../../../src/components/ItemList/helpers/get-item-list-data'
+  );
+  return jest.fn((...args) => originalModule.default(...args));
+});
+
+const listId = 'LIST ID';
+const missingListId = 'MISSING';
+const emptyListId = 'EMPTY';
+const queryListId = 'QUERY-LIST-ID';
+const queryListItem = { itemId: 'ID FROM QUERY', itemEntity: 'ENTITY' };
+const mocks = [
+  {
+    request: {
+      query: getItemList,
+      variables: { id: listId }
+    },
+    result: {
+      data: {
+        getItemList: { id: listId, listItems: [{ itemId: 'ID', itemEntity: 'ENTITY' }] }
+      }
+    }
+  },
+  {
+    request: {
+      query: getItemList,
+      variables: { id: missingListId }
+    },
+    result: {
+      data: {
+        getItemList: null
+      }
+    }
+  },
+  {
+    request: {
+      query: getItemList,
+      variables: { id: emptyListId }
+    },
+    result: {
+      data: {
+        getItemList: { id: emptyListId, listItems: [] }
+      }
+    }
+  },
+  {
+    request: {
+      query: getItemList,
+      variables: { id: queryListId }
+    },
+    result: {
+      data: {
+        getItemList: { id: queryListId, listItems: [queryListItem] }
+      }
+    }
+  }
+];
+
+describe('ItemListNew component', () => {
+  const props = {
+    listName: 'list_name',
+    modifier: 'button',
+    text: 'Clear list'
+  };
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('should match snapshot and render without throwing an error', async () => {
+    const { asFragment, getByText } = render(
+      <MockedProvider mocks={mocks}>
+        <ItemListNew {...props} />
+      </MockedProvider>
+    );
+    await waitFor(() => expect(getByText(props.text)).toBeInTheDocument());
+    expect(asFragment()).toMatchSnapshot();
+  });
+
+  it('should not render if list not found', async () => {
+    userItemListId.mockReturnValue({ listId: missingListId });
+    const { asFragment } = render(
+      <MockedProvider mocks={mocks}>
+        <ItemListNew {...props} listName={missingListId} />
+      </MockedProvider>
+    );
+
+    await waitFor(() => expect(getItemListData).toHaveBeenCalled());
+    expect(asFragment()).toMatchSnapshot();
+  });
+
+  it('should render using listId from query', async () => {
+    userItemListId.mockReturnValue({ listId });
+    const queryStringPath = { asPath: `/test?${LIST_ITEM_QUERY_PARAM}=${queryListId}` };
+    useRouter.mockReturnValueOnce(queryStringPath).mockReturnValueOnce(queryStringPath);
+    const { asFragment } = render(
+      <MockedProvider mocks={mocks}>
+        <ItemListNew {...props} listName={queryListId} />
+      </MockedProvider>
+    );
+
+    await waitFor(() => expect(getItemListData).toHaveBeenCalled());
+    expect(getItemListData).toHaveBeenCalledWith({
+      getItemList: { id: queryListId, listItems: [queryListItem] }
+    });
+    expect(asFragment()).toMatchSnapshot();
+  });
+
+  it('should not render if list has not items', async () => {
+    userItemListId.mockReturnValue({ listId: emptyListId });
+    const { asFragment } = render(
+      <MockedProvider mocks={mocks}>
+        <ItemListNew {...props} listName={emptyListId} />
+      </MockedProvider>
+    );
+    await waitFor(() => expect(getItemListData).toHaveBeenCalled());
+    expect(asFragment()).toMatchSnapshot();
+  });
+
+  it('should clear id and redirect onclick', async () => {
+    userItemListId.mockReturnValue({ listId });
+    const { getByText } = render(
+      <MockedProvider mocks={mocks}>
+        <ItemListNew {...props} />
+      </MockedProvider>
+    );
+    await waitFor(() => expect(getByText(props.text)).toBeInTheDocument());
+    fireEvent.click(getByText(props.text));
+    expect(setItemListId).toHaveBeenCalledWith(props.listName, '');
+    expect(setParamAndRedirect).toHaveBeenCalled();
+  });
+});

package/tests/unit/src/components/ItemList/__snapshots__/ItemListButton.test.js.snap

@@ -0,0 +1,107 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ItemListButton component should add and remove item to the list on click 1`] = `
+<DocumentFragment>
+  <div
+    class="item-list-button item-list-button--selected modifier"
+    role="button"
+  >
+    <i>
+      <svg
+        fill="currentColor"
+        height="1em"
+        stroke="currentColor"
+        stroke-width="0"
+        viewBox="0 0 16 16"
+        width="1em"
+        xmlns="http://www.w3.org/2000/svg"
+      >
+        <path
+          d="M2 15.5V2a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v13.5a.5.5 0 0 1-.74.439L8 13.069l-5.26 2.87A.5.5 0 0 1 2 15.5zm8.854-9.646a.5.5 0 0 0-.708-.708L7.5 7.793 6.354 6.646a.5.5 0 1 0-.708.708l1.5 1.5a.5.5 0 0 0 .708 0l3-3z"
+          fill-rule="evenodd"
+        />
+      </svg>
+    </i>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`ItemListButton component should add and remove item to the list on click 2`] = `
+<DocumentFragment>
+  <div
+    class="item-list-button item-list-button--selected modifier"
+    role="button"
+  >
+    <i>
+      <svg
+        fill="currentColor"
+        height="1em"
+        stroke="currentColor"
+        stroke-width="0"
+        viewBox="0 0 16 16"
+        width="1em"
+        xmlns="http://www.w3.org/2000/svg"
+      >
+        <path
+          d="M2 15.5V2a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v13.5a.5.5 0 0 1-.74.439L8 13.069l-5.26 2.87A.5.5 0 0 1 2 15.5zm8.854-9.646a.5.5 0 0 0-.708-.708L7.5 7.793 6.354 6.646a.5.5 0 1 0-.708.708l1.5 1.5a.5.5 0 0 0 .708 0l3-3z"
+          fill-rule="evenodd"
+        />
+      </svg>
+    </i>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`ItemListButton component should render button marked selected when current parent is in the list 1`] = `
+<DocumentFragment>
+  <div
+    class="item-list-button item-list-button--selected modifier"
+    role="button"
+  >
+    <i>
+      <svg
+        fill="currentColor"
+        height="1em"
+        stroke="currentColor"
+        stroke-width="0"
+        viewBox="0 0 16 16"
+        width="1em"
+        xmlns="http://www.w3.org/2000/svg"
+      >
+        <path
+          d="M2 15.5V2a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v13.5a.5.5 0 0 1-.74.439L8 13.069l-5.26 2.87A.5.5 0 0 1 2 15.5zm8.854-9.646a.5.5 0 0 0-.708-.708L7.5 7.793 6.354 6.646a.5.5 0 1 0-.708.708l1.5 1.5a.5.5 0 0 0 .708 0l3-3z"
+          fill-rule="evenodd"
+        />
+      </svg>
+    </i>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`ItemListButton component should render button not marked selected when current parent is not in the list 1`] = `
+<DocumentFragment>
+  <div
+    class="item-list-button modifier"
+    role="button"
+  >
+    <i>
+      <svg
+        fill="currentColor"
+        height="1em"
+        stroke="currentColor"
+        stroke-width="0"
+        viewBox="0 0 16 16"
+        width="1em"
+        xmlns="http://www.w3.org/2000/svg"
+      >
+        <path
+          d="M7.84 4.1a.178.178 0 0 1 .32 0l.634 1.285a.178.178 0 0 0 .134.098l1.42.206c.145.021.204.2.098.303L9.42 6.993a.178.178 0 0 0-.051.158l.242 1.414a.178.178 0 0 1-.258.187l-1.27-.668a.178.178 0 0 0-.165 0l-1.27.668a.178.178 0 0 1-.257-.187l.242-1.414a.178.178 0 0 0-.05-.158l-1.03-1.001a.178.178 0 0 1 .098-.303l1.42-.206a.178.178 0 0 0 .134-.098L7.84 4.1z"
+        />
+        <path
+          d="M2 2a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v13.5a.5.5 0 0 1-.777.416L8 13.101l-5.223 2.815A.5.5 0 0 1 2 15.5V2zm2-1a1 1 0 0 0-1 1v12.566l4.723-2.482a.5.5 0 0 1 .554 0L13 14.566V2a1 1 0 0 0-1-1H4z"
+        />
+      </svg>
+    </i>
+  </div>
+</DocumentFragment>
+`;

package/tests/unit/src/components/ItemList/__snapshots__/ItemListCounter.test.js.snap

@@ -0,0 +1,31 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ItemListCounter component should display listItem count and route to url 1`] = `
+<DocumentFragment>
+  <div
+    class="item-list-counter modifier"
+    role="button"
+    type="button"
+  >
+    <svg
+      fill="currentColor"
+      height="1em"
+      stroke="currentColor"
+      stroke-width="0"
+      viewBox="0 0 16 16"
+      width="1em"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        d="M2 15.5V2a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v13.5a.5.5 0 0 1-.74.439L8 13.069l-5.26 2.87A.5.5 0 0 1 2 15.5zM8.16 4.1a.178.178 0 0 0-.32 0l-.634 1.285a.178.178 0 0 1-.134.098l-1.42.206a.178.178 0 0 0-.098.303L6.58 6.993c.042.041.061.1.051.158L6.39 8.565a.178.178 0 0 0 .258.187l1.27-.668a.178.178 0 0 1 .165 0l1.27.668a.178.178 0 0 0 .257-.187L9.368 7.15a.178.178 0 0 1 .05-.158l1.028-1.001a.178.178 0 0 0-.098-.303l-1.42-.206a.178.178 0 0 1-.134-.098L8.16 4.1z"
+        fill-rule="evenodd"
+      />
+    </svg>
+    <span
+      class="item-list-counter__badge"
+    >
+      1
+    </span>
+  </div>
+</DocumentFragment>
+`;

package/tests/unit/src/components/ItemList/__snapshots__/ItemListNew.test.js.snap

@@ -0,0 +1,27 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ItemListNew component should match snapshot and render without throwing an error 1`] = `
+<DocumentFragment>
+  <button
+    class="item-list-new button"
+    type="button"
+  >
+    Clear list
+  </button>
+</DocumentFragment>
+`;
+
+exports[`ItemListNew component should not render if list has not items 1`] = `<DocumentFragment />`;
+
+exports[`ItemListNew component should not render if list not found 1`] = `<DocumentFragment />`;
+
+exports[`ItemListNew component should render using listId from query 1`] = `
+<DocumentFragment>
+  <button
+    class="item-list-new button"
+    type="button"
+  >
+    Clear list
+  </button>
+</DocumentFragment>
+`;

package/tests/unit/src/components/ItemList/helpers/get-item-list-data.test.js

@@ -0,0 +1,28 @@
+import '@testing-library/jest-dom/extend-expect';
+import getItemListData from '../../../../../../src/components/ItemList/helpers/get-item-list-data';
+
+describe('getItemListData helper', () => {
+  const noData = getItemListData();
+  const noGetItemList = getItemListData({});
+  const noListItems = getItemListData({ getItemList: {} });
+  const withCorrectData = getItemListData({
+    getItemList: { listItems: ['one item', 'two items'] }
+  });
+
+  it('should always return an array', () => {
+    expect(Array.isArray(noData)).toBeTruthy();
+    expect(Array.isArray(noGetItemList)).toBeTruthy();
+    expect(Array.isArray(noListItems)).toBeTruthy();
+    expect(Array.isArray(withCorrectData)).toBeTruthy();
+  });
+
+  it('should return an empty array if data passed doesnt have expected props', () => {
+    expect(noData).toEqual([]);
+    expect(noGetItemList).toEqual([]);
+    expect(noListItems).toEqual([]);
+  });
+
+  it('should return listData otherwise', () => {
+    expect(withCorrectData).toEqual(['one item', 'two items']);
+  });
+});

package/tests/unit/src/components/ItemList/helpers/get-item-list-id.test.js

@@ -0,0 +1,20 @@
+import '@testing-library/jest-dom/extend-expect';
+import getitemListId from '../../../../../../src/components/ItemList/helpers/get-item-list-id';
+
+describe('getitemListId helper', () => {
+  const noValues = getitemListId();
+  const noListId = getitemListId('listName');
+  const noListName = getitemListId(null, '123asd');
+
+  it('should return empty string if no values are passed', () => {
+    expect(noValues).toEqual('');
+  });
+
+  it('should return listId if passed', () => {
+    expect(noListName).toEqual('123asd');
+  });
+
+  it('should return local value if no id is passed but name is', () => {
+    expect(noListId).toEqual('');
+  });
+});

package/tests/unit/src/components/ItemList/helpers/get-item-list-ids.test.js

@@ -0,0 +1,19 @@
+import '@testing-library/jest-dom/extend-expect';
+import getitemListIds from '../../../../../../src/components/ItemList/helpers/get-item-list-ids';
+
+describe('getitemListIds helper', () => {
+  const noData = getitemListIds();
+  const emptyData = getitemListIds({});
+  const withData = getitemListIds({
+    getItemList: { listItems: [{ itemId: '123' }, { itemId: '456' }] }
+  });
+
+  it('should return null if no valid data is passed', () => {
+    expect(noData).toEqual(null);
+    expect(emptyData).toEqual(null);
+  });
+
+  it('should return itemsToDisplay formatted ids', () => {
+    expect(withData).toEqual([{ displayItems: ['123'] }, { displayItems: ['456'] }]);
+  });
+});

package/tests/unit/src/components/ItemList/helpers/set-item-list-id.test.js

@@ -0,0 +1,13 @@
+import '@testing-library/jest-dom/extend-expect';
+import setItemListId from '../../../../../../src/components/ItemList/helpers/set-item-list-id';
+import { LIST_ITEM_LOCAL_KEY } from '../../../../../../src/components/ItemList/constants';
+
+describe('setItemListId helper', () => {
+  const listId = 'LIST ID';
+  const listName = 'LIST';
+
+  it('should set list id in localstorage', () => {
+    setItemListId(listName, listId);
+    expect(localStorage.setItem).toHaveBeenCalledWith(`${LIST_ITEM_LOCAL_KEY}${listName}`, listId);
+  });
+});

package/tests/unit/src/components/ItemList/helpers/set-param-and-redirect.test.js

@@ -0,0 +1,30 @@
+import '@testing-library/jest-dom/extend-expect';
+import setParamAndRedirect from '../../../../../../src/components/ItemList/helpers/set-param-and-redirect';
+import { LIST_ITEM_QUERY_PARAM } from '../../../../../../src/components/ItemList/constants';
+
+describe('setParamAndRedirect helper', () => {
+  const url = '/test?otherParam=abc';
+  const urlWithQueryString = `${url}&${LIST_ITEM_QUERY_PARAM}=123`;
+
+  it('should return if no value and queryParam not present', () => {
+    const router = { asPath: url, push: jest.fn() };
+    expect(setParamAndRedirect(router)).toBeUndefined();
+    expect(router.push).not.toHaveBeenCalled();
+  });
+
+  it('should remove queryString if no value passed', () => {
+    const router = { asPath: urlWithQueryString, push: jest.fn() };
+    expect(setParamAndRedirect(router)).toBeUndefined();
+    expect(router.push).toHaveBeenCalledWith('/Resolver', url, {
+      shallow: true
+    });
+  });
+
+  it('should add queryString if value passed', () => {
+    const router = { asPath: url, push: jest.fn() };
+    expect(setParamAndRedirect(router, '123')).toBeUndefined();
+    expect(router.push).toHaveBeenCalledWith('/Resolver', urlWithQueryString, {
+      shallow: true
+    });
+  });
+});