tests for pagination (#1062)

* tests for pagination * tests for pagination * tests for pagination * tests for pagination * tests for pagination * fix test for variants
2021-04-21 15:14:38 +02:00 · 2021-04-21 15:14:38 +02:00 · 6395aa16a3
commit 6395aa16a3
parent 795f9ccc4b
26 changed files with 255 additions and 68 deletions
--- a/cypress/elements/catalog/products/products-list.js
+++ b/cypress/elements/catalog/products/products-list.js
@ -3,7 +3,7 @@ export const PRODUCTS_LIST = {
  productsNames: "[data-test='name']",
  createProductBtn: "[data-test='add-product']",
  searchProducts: "[placeholder='Search Products...']",
-  emptyProductRow: "[class*='Skeleton']",
+  emptyProductRow: "[data-test-id='skeleton']",
  productRowElements: {
    name: '[data-test="name"]',
    type: '[data-test="product-type"]',
@ -27,5 +27,9 @@ export const PRODUCTS_LIST = {
      stock: '[data-test-id="stock"]'
    },
    filterBySearchInput: '[data-test*="filterField"][data-test*="Input"]'
-  }
+  },
+  nextPageButton: "[data-test='button-pagination-next']",
+  previousPagePagination: "[data-test='button-pagination-back']",
+  resultsOnPageSelect: "[data-test-id='rowNumberSelect']",
+  rowNumberOption: "[data-test-id='rowNumberOption']"
 };
--- a/cypress/elements/channels/select-channels-to-assign.js
+++ b/cypress/elements/channels/select-channels-to-assign.js
@ -4,5 +4,7 @@ export const SELECT_CHANNELS_TO_ASSIGN = {
  allChannelsCheckbox: "[name='allChannels']",
  selectChannelsForm: "[role='dialog']",
  channelRow: "[data-test-id='channel-row']",
+  expandChannelRow: "[data-test-id='expand-channel-row']",
+  channelVariantRow: '[data-test-id="channel-variant-row"]',
  channelCheckbox: "[class*='MuiCheckbox']"
 };
--- a/cypress/elements/shared/button-selectors.js
+++ b/cypress/elements/shared/button-selectors.js
@ -5,5 +5,7 @@ export const BUTTON_SELECTORS = {
  goBackButton: "[data-test-id='app-header-back-button']",
  checkbox: "[type='checkbox']",
  selectOption: "[data-test*='select-option']",
-  deleteButton: '[data-test="button-bar-delete"]'
+  notSelectedOption: ":not([aria-selected])",
+  deleteButton: '[data-test="button-bar-delete"]',
+  expandIcon: `[class*="expandIcon"]`
 };
--- a/cypress/integration/collections.js
+++ b/cypress/integration/collections.js
@ -69,7 +69,7 @@ describe("Collections", () => {
  });

  it("should not display hidden collections", () => {
-    const collectionName = `${startsWith}${faker.random.number()}`;
+    const collectionName = `${startsWith}${faker.datatype.number()}`;
    cy.visit(urlList.collections);
    let collection;

@ -88,7 +88,7 @@ describe("Collections", () => {
  });

  it("should display collections", () => {
-    const collectionName = `${startsWith}${faker.random.number()}`;
+    const collectionName = `${startsWith}${faker.datatype.number()}`;
    let collection;
    cy.visit(urlList.collections);

@ -104,7 +104,7 @@ describe("Collections", () => {
      });
  });
  it("should not display collection not set as available in channel", () => {
-    const collectionName = `${startsWith}${faker.random.number()}`;
+    const collectionName = `${startsWith}${faker.datatype.number()}`;
    let collection;
    let channel;

@ -131,7 +131,7 @@ describe("Collections", () => {
  it("should display products hidden in listing", () => {
    // Products "hidden in listings" are not displayed in Category listings or search results,
    // but are listed on Collections
-    const randomName = `${startsWith}${faker.random.number()}`;
+    const randomName = `${startsWith}${faker.datatype.number()}`;
    let collection;
    let createdProduct;

--- a/cypress/integration/configuration/channels.js
+++ b/cypress/integration/configuration/channels.js
@ -43,7 +43,7 @@ describe("Channels", () => {
  });

  it("should create new channel", () => {
-    const randomChannel = `${channelStartsWith} ${faker.random.number()}`;
+    const randomChannel = `${channelStartsWith} ${faker.datatype.number()}`;
    cy.addAliasToGraphRequest("Channels");
    cy.visit(urlList.channels);
    cy.wait("@Channels");
@ -82,7 +82,7 @@ describe("Channels", () => {
  });

  it("should validate slug name", () => {
-    const randomChannel = `${channelStartsWith} ${faker.random.number()}`;
+    const randomChannel = `${channelStartsWith} ${faker.datatype.number()}`;
    createChannel(false, randomChannel, randomChannel, currency);
    cy.visit(urlList.channels);
    createChannelByView(randomChannel, currency);
@ -92,7 +92,7 @@ describe("Channels", () => {
  });

  it("should validate duplicated currency", () => {
-    const randomChannel = `${channelStartsWith} ${faker.random.number()}`;
+    const randomChannel = `${channelStartsWith} ${faker.datatype.number()}`;
    cy.visit(urlList.channels);
    createChannelByView(randomChannel, "notExistingCurrency");
    cy.get(ADD_CHANNEL_FORM_SELECTORS.currencyValidationMessage).should(
@ -101,7 +101,7 @@ describe("Channels", () => {
  });

  it("should delete channel", () => {
-    const randomChannelToDelete = `${channelStartsWith} ${faker.random.number()}`;
+    const randomChannelToDelete = `${channelStartsWith} ${faker.datatype.number()}`;
    createChannel(
      false,
      randomChannelToDelete,
@ -125,7 +125,7 @@ describe("Channels", () => {
  });

  it("should not be possible to add products to order with inactive channel", () => {
-    const randomChannel = `${channelStartsWith} ${faker.random.number()}`;
+    const randomChannel = `${channelStartsWith} ${faker.datatype.number()}`;
    createChannel(false, randomChannel, randomChannel, currency);
    cy.visit(urlList.orders)
      .get(ORDERS_SELECTORS.createOrder)
--- a/cypress/integration/configuration/shippingMethod.js
+++ b/cypress/integration/configuration/shippingMethod.js
@ -22,7 +22,7 @@ import { isShippingAvailableInCheckout } from "../../utils/storeFront/checkoutUt

 describe("Shipping methods", () => {
  const startsWith = "CyShippingMethods-";
-  const name = `${startsWith}${faker.random.number()}`;
+  const name = `${startsWith}${faker.datatype.number()}`;
  const price = 8;
  let defaultChannel;
  let plAddress;
@ -77,7 +77,7 @@ describe("Shipping methods", () => {
  });

  it("should display different price for each channel", () => {
-    const shippingName = `${startsWith}${faker.random.number()}`;
+    const shippingName = `${startsWith}${faker.datatype.number()}`;
    const defaultChannelPrice = 11;
    const createdChannelPrice = 7;
    const createdChannelCurrency = "PLN";
@ -148,7 +148,7 @@ describe("Shipping methods", () => {
      });
  });
  it("should create price based shipping method", () => {
-    const shippingName = `${startsWith}${faker.random.number()}`;
+    const shippingName = `${startsWith}${faker.datatype.number()}`;

    createShippingZone(
      shippingName,
@ -174,7 +174,7 @@ describe("Shipping methods", () => {
  });

  it("should create weight based shipping method", () => {
-    const shippingName = `${startsWith}${faker.random.number()}`;
+    const shippingName = `${startsWith}${faker.datatype.number()}`;

    createShippingZone(
      shippingName,
--- a/cypress/integration/discounts/sales.js
+++ b/cypress/integration/discounts/sales.js
@ -34,7 +34,7 @@ describe("Sales discounts", () => {
    productsUtils.deleteProductsStartsWith(startsWith);
    deleteShippingStartsWith(startsWith);

-    const name = `${startsWith}${faker.random.number()}`;
+    const name = `${startsWith}${faker.datatype.number()}`;
    productsUtils
      .createTypeAttributeAndCategoryForProduct(name)
      .then(
@ -72,7 +72,7 @@ describe("Sales discounts", () => {
  });

  it("should create percentage discount", () => {
-    const saleName = `${startsWith}${faker.random.number()}`;
+    const saleName = `${startsWith}${faker.datatype.number()}`;
    const discountValue = 50;
    const productPrice = 100;

@ -105,7 +105,7 @@ describe("Sales discounts", () => {
  });

  it("should create fixed price discount", () => {
-    const saleName = `${startsWith}${faker.random.number()}`;
+    const saleName = `${startsWith}${faker.datatype.number()}`;
    const discountValue = 50;
    const productPrice = 100;

@ -138,7 +138,7 @@ describe("Sales discounts", () => {
  });

  it("should not displayed discount not assign to channel", () => {
-    const saleName = `${startsWith}${faker.random.number()}`;
+    const saleName = `${startsWith}${faker.datatype.number()}`;
    let channel;
    let product;
    const discountValue = 50;
--- a/cypress/integration/discounts/vouchers.js
+++ b/cypress/integration/discounts/vouchers.js
@ -35,7 +35,7 @@ describe("Vouchers discounts", () => {
    deleteShippingStartsWith(startsWith);
    deleteVouchersStartsWith(startsWith);

-    const name = `${startsWith}${faker.random.number()}`;
+    const name = `${startsWith}${faker.datatype.number()}`;

    productsUtils
      .createTypeAttributeAndCategoryForProduct(name)
@ -86,7 +86,7 @@ describe("Vouchers discounts", () => {
  });

  it("should create percentage voucher", () => {
-    const voucherCode = `${startsWith}${faker.random.number()}`;
+    const voucherCode = `${startsWith}${faker.datatype.number()}`;
    const voucherValue = 50;

    createVoucher({
@ -104,7 +104,7 @@ describe("Vouchers discounts", () => {
      });
  });
  it("should create fixed price voucher", () => {
-    const voucherCode = `${startsWith}${faker.random.number()}`;
+    const voucherCode = `${startsWith}${faker.datatype.number()}`;
    const voucherValue = 50;

    createVoucher({
@ -123,7 +123,7 @@ describe("Vouchers discounts", () => {

  // Test should pass after fixing - SALEOR-1629 bug
  xit("should create free shipping voucher", () => {
-    const voucherCode = `${startsWith}${faker.random.number()}`;
+    const voucherCode = `${startsWith}${faker.datatype.number()}`;

    createVoucher({
      voucherCode,
@ -139,7 +139,7 @@ describe("Vouchers discounts", () => {
  });

  it("should create voucher not available for selected channel", () => {
-    const randomName = `${startsWith}${faker.random.number()}`;
+    const randomName = `${startsWith}${faker.datatype.number()}`;
    const voucherValue = 50;

    channelsUtils
--- a/cypress/integration/homePage/homePageAnalitics.js
+++ b/cypress/integration/homePage/homePageAnalitics.js
@ -32,7 +32,7 @@ describe("Homepage analytics", () => {

  const productPrice = 22;
  const shippingPrice = 12;
-  const randomName = startsWith + faker.random.number();
+  const randomName = startsWith + faker.datatype.number();
  const randomEmail = randomName + "@example.com";

  before(() => {
@ -161,7 +161,7 @@ describe("Homepage analytics", () => {
    homePageUtils
      .getProductsOutOfStock(defaultChannel.slug)
      .as("productsOutOfStock");
-    const productOutOfStockRandomName = startsWith + faker.random.number();
+    const productOutOfStockRandomName = startsWith + faker.datatype.number();

    productsUtils.createProductInChannel({
      name: productOutOfStockRandomName,
--- a/cypress/integration/orders/channelsInDraftOrders.js
+++ b/cypress/integration/orders/channelsInDraftOrders.js
@ -14,7 +14,7 @@ import * as channelsUtils from "../../utils/channelsUtils";

 describe("Channels in draft orders", () => {
  const startsWith = "CyChannelInDraftOrders-";
-  const randomName = startsWith + faker.random.number();
+  const randomName = startsWith + faker.datatype.number();

  let defaultChannel;
  let otherChannel;
--- a/cypress/integration/orders/draftOrders.js
+++ b/cypress/integration/orders/draftOrders.js
@ -19,7 +19,7 @@ import {

 describe("Draft orders", () => {
  const startsWith = "CyDraftOrders-";
-  const randomName = startsWith + faker.random.number();
+  const randomName = startsWith + faker.datatype.number();

  let defaultChannel;
  let warehouse;
--- a/cypress/integration/orders/orders.js
+++ b/cypress/integration/orders/orders.js
@ -19,7 +19,7 @@ import {

 describe("Orders", () => {
  const startsWith = "CyOrders-";
-  const randomName = startsWith + faker.random.number();
+  const randomName = startsWith + faker.datatype.number();

  let customer;
  let defaultChannel;
--- a/cypress/integration/products/createProduct.js
+++ b/cypress/integration/products/createProduct.js
@ -20,9 +20,9 @@ import * as productUtils from "../../utils/products/productsUtils";

 describe("Create product", () => {
  const startsWith = "CyCreateProduct-";
-  const name = `${startsWith}${faker.random.number()}`;
+  const name = `${startsWith}${faker.datatype.number()}`;
  const generalInfo = {
-    name: `${startsWith}${faker.random.number()}`,
+    name: `${startsWith}${faker.datatype.number()}`,
    description: faker.lorem.sentence(),
    rating: 2
  };
@ -59,7 +59,7 @@ describe("Create product", () => {
  });

  it("should create product with variants", () => {
-    const randomName = `${startsWith}${faker.random.number()}`;
+    const randomName = `${startsWith}${faker.datatype.number()}`;
    productUtils.createTypeProduct(randomName, attribute.id);
    seo.slug = randomName;
    const productData = {
@ -86,7 +86,7 @@ describe("Create product", () => {
  });
  it("should create product without variants", () => {
    const prices = { sellingPrice: 6, costPrice: 3 };
-    const randomName = `${startsWith}${faker.random.number()}`;
+    const randomName = `${startsWith}${faker.datatype.number()}`;
    seo.slug = randomName;
    productUtils.createTypeProduct(randomName, attribute.id, false);
    const productData = {
--- a/cypress/integration/products/menageProducts/availableForPurchaseProducts.js
+++ b/cypress/integration/products/menageProducts/availableForPurchaseProducts.js
@ -11,7 +11,7 @@ import { isProductAvailableForPurchase } from "../../../utils/storeFront/storeFr
 // <reference types="cypress" />
 describe("Products available in listings", () => {
  const startsWith = "CyAvailForPurchase-";
-  const name = `${startsWith}${faker.random.number()}`;
+  const name = `${startsWith}${faker.datatype.number()}`;
  let productType;
  let attribute;
  let category;
@ -59,7 +59,7 @@ describe("Products available in listings", () => {
  });

  it("should update product to available for purchase", () => {
-    const productName = `${startsWith}${faker.random.number()}`;
+    const productName = `${startsWith}${faker.datatype.number()}`;
    let product;

    productsUtils
@ -85,7 +85,7 @@ describe("Products available in listings", () => {
      });
  });
  it("should update product to not available for purchase", () => {
-    const productName = `${startsWith}${faker.random.number()}`;
+    const productName = `${startsWith}${faker.datatype.number()}`;
    let product;

    productsUtils
--- a/cypress/integration/products/menageProducts/publishedProducts.js
+++ b/cypress/integration/products/menageProducts/publishedProducts.js
@ -10,7 +10,7 @@ import { isProductVisible } from "../../../utils/storeFront/storeFrontProductUti
 // <reference types="cypress" />
 describe("Published products", () => {
  const startsWith = "CyPublishedProducts-";
-  const name = `${startsWith}${faker.random.number()}`;
+  const name = `${startsWith}${faker.datatype.number()}`;
  let productType;
  let attribute;
  let category;
@ -37,7 +37,7 @@ describe("Published products", () => {
    cy.clearSessionData().loginUserViaRequest();
  });
  it("should update product to published", () => {
-    const productName = `${startsWith}${faker.random.number()}`;
+    const productName = `${startsWith}${faker.datatype.number()}`;
    let defaultChannel;
    getDefaultChannel()
      .then(channel => {
@ -64,7 +64,7 @@ describe("Published products", () => {
      });
  });
  it("should update product to not published", () => {
-    const productName = `${startsWith}${faker.random.number()}`;
+    const productName = `${startsWith}${faker.datatype.number()}`;
    let defaultChannel;
    let product;

--- a/cypress/integration/products/menageProducts/visibleInListingsProducts.js
+++ b/cypress/integration/products/menageProducts/visibleInListingsProducts.js
@ -10,7 +10,7 @@ import { isProductVisibleInSearchResult } from "../../../utils/storeFront/storeF
 // <reference types="cypress" />
 describe("Products displayed in listings", () => {
  const startsWith = "CyVisibleInListings-";
-  const name = `${startsWith}${faker.random.number()}`;
+  const name = `${startsWith}${faker.datatype.number()}`;
  let productType;
  let attribute;
  let category;
@ -37,7 +37,7 @@ describe("Products displayed in listings", () => {
    cy.clearSessionData().loginUserViaRequest();
  });
  it("should update product to visible in listings", () => {
-    const productName = `${startsWith}${faker.random.number()}`;
+    const productName = `${startsWith}${faker.datatype.number()}`;
    let defaultChannel;
    getDefaultChannel()
      .then(channel => {
@ -67,7 +67,7 @@ describe("Products displayed in listings", () => {
      });
  });
  it("should update product to not visible in listings", () => {
-    const productName = `${startsWith}${faker.random.number()}`;
+    const productName = `${startsWith}${faker.datatype.number()}`;
    let defaultChannel;
    getDefaultChannel()
      .then(channel => {
--- a/cypress/integration/products/productsList/filteringProducts.js
+++ b/cypress/integration/products/productsList/filteringProducts.js
@ -22,7 +22,7 @@ import {

 describe("Products", () => {
  const startsWith = "CyFilterProducts-";
-  const name = `${startsWith}${faker.random.number()}`;
+  const name = `${startsWith}${faker.datatype.number()}`;
  const stockQuantity = 747;
  const price = 342;
  let attribute;
@ -95,7 +95,7 @@ describe("Products", () => {
  });

  it("should filter products out of stock", () => {
-    const productOutOfStock = `${startsWith}${faker.random.number()}`;
+    const productOutOfStock = `${startsWith}${faker.datatype.number()}`;
    createProductInChannel({
      name: productOutOfStock,
      channelId: channel.id,
--- a/cypress/integration/products/productsList/pagination.js
+++ b/cypress/integration/products/productsList/pagination.js
@ -0,0 +1,62 @@
+import { PRODUCTS_LIST } from "../../../elements/catalog/products/products-list";
+import { BUTTON_SELECTORS } from "../../../elements/shared/button-selectors";
+import { SHARED_ELEMENTS } from "../../../elements/shared/sharedElements";
+import {
+  getDisplayedColumnArray,
+  isNumberOfProductsSameAsInSelectResultsOnPage
+} from "../../../steps/catalog/products/productsListSteps";
+import { urlList } from "../../../url/urlList";
+
+describe("Products", () => {
+  beforeEach(() => {
+    cy.clearSessionData().loginUserViaRequest();
+    cy.visit(urlList.products);
+  });
+  it("Should go to the next page", () => {
+    cy.get(PRODUCTS_LIST.productsList)
+      .should("be.visible")
+      .get(PRODUCTS_LIST.emptyProductRow)
+      .should("not.exist")
+      .get(PRODUCTS_LIST.previousPagePagination)
+      .should("be.disabled");
+    let firstPageProducts;
+    getDisplayedColumnArray("name").then(
+      productsList => (firstPageProducts = productsList)
+    );
+    cy.addAliasToGraphRequest("ProductList");
+    cy.get(PRODUCTS_LIST.nextPageButton)
+      .click()
+      .get(SHARED_ELEMENTS.progressBar)
+      .should("not.exist");
+    cy.wait("@ProductList");
+    getDisplayedColumnArray("name").then(productList => {
+      expect(productList).to.not.equal(firstPageProducts);
+    });
+    cy.get(PRODUCTS_LIST.previousPagePagination).then($button => {
+      expect($button).to.be.enabled;
+    });
+  });
+  it("should displayed correct number of results per page", () => {
+    isNumberOfProductsSameAsInSelectResultsOnPage().then(
+      isTheSame =>
+        expect(isTheSame, "check if number of displayed products is correct").to
+          .be.true
+    );
+    cy.get(PRODUCTS_LIST.resultsOnPageSelect)
+      .click()
+      .get(
+        `${PRODUCTS_LIST.rowNumberOption}${BUTTON_SELECTORS.notSelectedOption}`
+      )
+      .first()
+      .click()
+      .get(SHARED_ELEMENTS.progressBar)
+      .should("not.exist");
+    isNumberOfProductsSameAsInSelectResultsOnPage().then(
+      isTheSame =>
+        expect(
+          isTheSame,
+          "check if number of displayed products is correct, after changing results number in table footer"
+        ).to.be.true
+    );
+  });
+});
--- a/cypress/integration/products/productsVariants.js
+++ b/cypress/integration/products/productsVariants.js
@ -5,7 +5,6 @@ import {
  createProduct,
  updateChannelInProduct
 } from "../../apiRequests/Product";
-import { BUTTON_SELECTORS } from "../../elements/shared/button-selectors";
 import {
  createFirstVariant,
  createVariant,
@ -38,7 +37,7 @@ describe("Creating variants", () => {
    productUtils.deleteProductsStartsWith(startsWith);
    deleteChannelsStartsWith(startsWith);

-    const name = `${startsWith}${faker.random.number()}`;
+    const name = `${startsWith}${faker.datatype.number()}`;
    getDefaultChannel()
      .then(channel => {
        defaultChannel = channel;
@ -73,7 +72,7 @@ describe("Creating variants", () => {
  });

  it("should create variant visible on frontend", () => {
-    const name = `${startsWith}${faker.random.number()}`;
+    const name = `${startsWith}${faker.datatype.number()}`;
    const price = 10;
    let createdProduct;

@ -100,9 +99,9 @@ describe("Creating variants", () => {
        expect(variant).to.have.property("price", price);
      });
  });
-  xit("should create several variants", () => {
-    const name = `${startsWith}${faker.random.number()}`;
-    const secondVariantSku = `${startsWith}${faker.random.number()}`;
+  it("should create several variants", () => {
+    const name = `${startsWith}${faker.datatype.number()}`;
+    const secondVariantSku = `${startsWith}${faker.datatype.number()}`;
    const variants = [{ price: 7 }, { name: attributeValues[1], price: 16 }];
    let createdProduct;

@ -123,14 +122,15 @@ describe("Creating variants", () => {
          sku: secondVariantSku,
          warehouseName: warehouse.name,
          attributeName: variants[1].name,
-          price: variants[1].price
+          price: variants[1].price,
+          channelName: defaultChannel.name
        });
      })
      .then(() => {
        selectChannelInHeader(defaultChannel.name);
        variantsShouldBeVisible({
          name: variants[1].name,
-          price: variants.price
+          price: variants[1].price
        });
        getProductVariants(createdProduct.id, defaultChannel.slug);
      })
@ -141,7 +141,7 @@ describe("Creating variants", () => {
      });
  });
  it("should create variant for many channels", () => {
-    const name = `${startsWith}${faker.random.number()}`;
+    const name = `${startsWith}${faker.datatype.number()}`;
    const variantsPrice = 10;
    let newChannel;
    let createdProduct;
--- a/cypress/steps/catalog/products/VariantsSteps.js
+++ b/cypress/steps/catalog/products/VariantsSteps.js
@ -4,6 +4,7 @@ import { VARIANTS_SELECTORS } from "../../../elements/catalog/products/variants-
 import { AVAILABLE_CHANNELS_FORM } from "../../../elements/channels/available-channels-form";
 import { BUTTON_SELECTORS } from "../../../elements/shared/button-selectors";
 import { SHARED_ELEMENTS } from "../../../elements/shared/sharedElements";
+import { selectChannelVariantInDetailsPage } from "../../channelsSteps";
 import { fillUpPriceList } from "./priceList";

 export function variantsShouldBeVisible({ name, price }) {
@ -38,7 +39,8 @@ export function createVariant({
  warehouseName,
  attributeName,
  price,
-  costPrice = price
+  costPrice = price,
+  channelName
 }) {
  cy.get(PRODUCT_DETAILS.addVariantsButton)
    .click()
@ -47,18 +49,23 @@ export function createVariant({
    .get(VARIANTS_SELECTORS.attributeOption)
    .contains(attributeName)
    .click()
-    .get(PRICE_LIST.priceInput)
-    .type(price)
-    .get(PRICE_LIST.costPriceInput)
-    .type(costPrice)
    .get(VARIANTS_SELECTORS.skuInputInAddVariant)
    .type(sku)
    .get(VARIANTS_SELECTORS.addWarehouseButton)
    .click();
  cy.contains(VARIANTS_SELECTORS.warehouseOption, warehouseName).click();
-  cy.addAliasToGraphRequest("ProductVariantDetails");
  cy.get(VARIANTS_SELECTORS.saveButton).click();
-  cy.wait("@ProductVariantDetails");
+  cy.get(BUTTON_SELECTORS.back).click();
+  selectChannelVariantInDetailsPage(channelName, attributeName);
+  cy.get(BUTTON_SELECTORS.confirm).click();
+  cy.contains(PRODUCT_DETAILS.variantRow, attributeName).click();
+  cy.get(PRICE_LIST.priceInput)
+    .type(price)
+    .get(PRICE_LIST.costPriceInput)
+    .type(costPrice);
+  cy.addAliasToGraphRequest("ProductVariantChannelListingUpdate");
+  cy.get(VARIANTS_SELECTORS.saveButton).click();
+  cy.wait("@ProductVariantChannelListingUpdate");
  cy.get(BUTTON_SELECTORS.back)
    .click()
    .get(SHARED_ELEMENTS.progressBar)
--- a/cypress/steps/catalog/products/productsListSteps.js
+++ b/cypress/steps/catalog/products/productsListSteps.js
@ -2,6 +2,38 @@ import { PRODUCTS_LIST } from "../../../elements/catalog/products/products-list"
 import { BUTTON_SELECTORS } from "../../../elements/shared/button-selectors";
 import { SHARED_ELEMENTS } from "../../../elements/shared/sharedElements";

+export function isNumberOfProductsSameAsInSelectResultsOnPage() {
+  let numberOfResults;
+  return cy
+    .get(PRODUCTS_LIST.productsList)
+    .should("be.visible")
+    .get(PRODUCTS_LIST.emptyProductRow)
+    .should("not.exist")
+    .then(() => {
+      cy.get(PRODUCTS_LIST.resultsOnPageSelect).invoke("text");
+    })
+    .then(text => {
+      numberOfResults = text;
+      getDisplayedColumnArray("name");
+    })
+    .then(
+      productsList => productsList.length === parseInt(numberOfResults, 10)
+    );
+}
+export function getDisplayedColumnArray(columnName) {
+  let productsList = new Array();
+  return cy
+    .get(PRODUCTS_LIST.productsList)
+    .each($product => {
+      cy.wrap($product)
+        .find(PRODUCTS_LIST.productRowElements[columnName])
+        .invoke("text")
+        .then(productName => {
+          productsList = productsList.concat([productName]);
+        });
+    })
+    .then(() => productsList);
+}
 export function selectFilterOption(filter, optionName) {
  selectFilterBy(filter)
    .get(PRODUCTS_LIST.filters.filterBySearchInput)
--- a/cypress/steps/channelsSteps.js
+++ b/cypress/steps/channelsSteps.js
@ -58,3 +58,16 @@ export function selectChannelInDetailsPages(channelName) {
    .find(BUTTON_SELECTORS.submit)
    .click();
 }
+export function selectChannelVariantInDetailsPage(channelName, attributeName) {
+  cy.get(AVAILABLE_CHANNELS_FORM.menageChannelsButton).click();
+  cy.contains(SELECT_CHANNELS_TO_ASSIGN.expandChannelRow, channelName)
+    .find(BUTTON_SELECTORS.expandIcon)
+    .click();
+  cy.contains(SELECT_CHANNELS_TO_ASSIGN.expandChannelRow, channelName)
+    .contains(SELECT_CHANNELS_TO_ASSIGN.channelVariantRow, attributeName)
+    .find(BUTTON_SELECTORS.checkbox)
+    .click();
+  cy.get(SELECT_CHANNELS_TO_ASSIGN.selectChannelsForm)
+    .find(BUTTON_SELECTORS.submit)
+    .click();
+}
--- a/cypress/utils/products/productsListUtils.js
+++ b/cypress/utils/products/productsListUtils.js
@ -1,5 +1,4 @@
 import { PRODUCTS_LIST } from "../../elements/catalog/products/products-list";
-/* eslint-disable no-unused-expressions*/
 export function getDisplayedColumnArray(columnName) {
  let productsList = new Array();
  return cy
@ -18,9 +17,10 @@ export function expectProductsSortedBy(columnName, inAscOrder = true) {
  getDisplayedColumnArray(columnName).then(productsArray => {
    let sortedProductsArray = productsArray.slice();
    if (columnName !== "price") {
-      inAscOrder
-        ? sortedProductsArray.sort()
-        : sortedProductsArray.sort().reverse();
+      sortedProductsArray.sort();
+      if (!inAscOrder) {
+        sortedProductsArray.reverse();
+      }
    } else {
      sortedProductsArray = getSortedPriceColumn(
        sortedProductsArray,
--- a/src/channels/components/ChannelsWithVariantsAvailabilityDialog/ChannelsWithVariantsAvailabilityDialogContent.tsx
+++ b/src/channels/components/ChannelsWithVariantsAvailabilityDialog/ChannelsWithVariantsAvailabilityDialogContent.tsx
@ -145,7 +145,10 @@ const ChannelsWithVariantsAvailabilityDialogContent: React.FC<ChannelsWithVarian
          placeholderImage;

        return (
-          <ExpansionPanel classes={expanderClasses}>
+          <ExpansionPanel
+            classes={expanderClasses}
+            data-test-id="expand-channel-row"
+          >
            <ExpansionPanelSummary
              expandIcon={<IconChevronDown />}
              classes={summaryClasses}
@ -182,9 +185,9 @@ const ChannelsWithVariantsAvailabilityDialogContent: React.FC<ChannelsWithVarian
            {allVariants.map(({ id: variantId, name }) => (
              <>
                <div
+                  data-test-id="channel-variant-row"
                  key={variantId}
                  className={classes.variantContainer}
-                  data-test-id="channel-row"
                >
                  <ControlledCheckbox
                    checked={isVariantSelected(variantId)}
--- a/src/components/RowNumberSelect/RowNumberSelect.tsx
+++ b/src/components/RowNumberSelect/RowNumberSelect.tsx
@ -53,13 +53,18 @@ const RowNumberSelect: React.FC<RowNumberSelectProps> = ({
        <FormattedMessage defaultMessage="No of Rows:" />
      </span>
      <Select
+        data-test-id="rowNumberSelect"
        className={classes.select}
        value={settings.rowNumber}
        onChange={event => onChange("rowNumber", event.target.value)}
      >
        {choices.length > 0 &&
          choices.map(choice => (
-            <MenuItem value={choice} key={choice}>
+            <MenuItem
+              value={choice}
+              key={choice}
+              data-test-id="rowNumberOption"
+            >
              {choice}
            </MenuItem>
          ))}
--- a/src/storybook/snapshots/Stories.test.ts.snap
+++ b/src/storybook/snapshots/Stories.test.ts.snap
@ -22174,6 +22174,7 @@ exports[`Storyshots Views / Apps / Apps list default 1`] = `
                          </span>
                          <div
                            class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                            data-test-id="rowNumberSelect"
                          >
                            <div
                              aria-haspopup="listbox"
@ -22582,6 +22583,7 @@ exports[`Storyshots Views / Apps / Apps list loading 1`] = `
                          </span>
                          <div
                            class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                            data-test-id="rowNumberSelect"
                          >
                            <div
                              aria-haspopup="listbox"
@ -22872,6 +22874,7 @@ exports[`Storyshots Views / Apps / Apps list no data 1`] = `
                          </span>
                          <div
                            class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                            data-test-id="rowNumberSelect"
                          >
                            <div
                              aria-haspopup="listbox"
@ -42262,6 +42265,7 @@ exports[`Storyshots Views / Categories / Category list default 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -42890,6 +42894,7 @@ exports[`Storyshots Views / Categories / Category list empty 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -43232,6 +43237,7 @@ exports[`Storyshots Views / Categories / Category list loading 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -59374,6 +59380,7 @@ exports[`Storyshots Views / Collections / Collection list default 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -60054,6 +60061,7 @@ exports[`Storyshots Views / Collections / Collection list loading 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -60424,6 +60432,7 @@ exports[`Storyshots Views / Collections / Collection list no data 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -76078,6 +76087,7 @@ exports[`Storyshots Views / Customers / Customer list default 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -77674,6 +77684,7 @@ exports[`Storyshots Views / Customers / Customer list loading 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -78047,6 +78058,7 @@ exports[`Storyshots Views / Customers / Customer list no data 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -88334,6 +88346,7 @@ exports[`Storyshots Views / Discounts / Sale list default 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -89010,6 +89023,7 @@ exports[`Storyshots Views / Discounts / Sale list loading 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -89444,6 +89458,7 @@ exports[`Storyshots Views / Discounts / Sale list no channels 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -90086,6 +90101,7 @@ exports[`Storyshots Views / Discounts / Sale list no data 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -99546,6 +99562,7 @@ exports[`Storyshots Views / Discounts / Voucher list default 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -100081,6 +100098,7 @@ exports[`Storyshots Views / Discounts / Voucher list loading 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -100561,6 +100579,7 @@ exports[`Storyshots Views / Discounts / Voucher list no channels 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -101062,6 +101081,7 @@ exports[`Storyshots Views / Discounts / Voucher list no data 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -105181,6 +105201,7 @@ exports[`Storyshots Views / Navigation / Menu list default 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -105576,6 +105597,7 @@ exports[`Storyshots Views / Navigation / Menu list loading 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -105876,6 +105898,7 @@ exports[`Storyshots Views / Navigation / Menu list no data 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -106296,6 +106319,7 @@ exports[`Storyshots Views / Orders / Draft order list default 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -107939,6 +107963,7 @@ exports[`Storyshots Views / Orders / Draft order list loading 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -108342,6 +108367,7 @@ exports[`Storyshots Views / Orders / Draft order list when no data 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -136626,6 +136652,7 @@ exports[`Storyshots Views / Orders / Order list default 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -138032,6 +138059,7 @@ exports[`Storyshots Views / Orders / Order list limits reached 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -139404,6 +139432,7 @@ exports[`Storyshots Views / Orders / Order list loading 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -139845,6 +139874,7 @@ exports[`Storyshots Views / Orders / Order list no limits 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -141206,6 +141236,7 @@ exports[`Storyshots Views / Orders / Order list when no data 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -150067,6 +150098,7 @@ exports[`Storyshots Views / Pages / Page list default 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -150650,6 +150682,7 @@ exports[`Storyshots Views / Pages / Page list loading 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -150968,6 +151001,7 @@ exports[`Storyshots Views / Pages / Page list no data 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -159066,6 +159100,7 @@ exports[`Storyshots Views / Plugins / Plugin list default 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -159424,6 +159459,7 @@ exports[`Storyshots Views / Plugins / Plugin list loading 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -159753,6 +159789,7 @@ exports[`Storyshots Views / Plugins / Plugin list no data 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -200920,6 +200957,7 @@ exports[`Storyshots Views / Products / Product list default 1`] = `
                        </span>
                        <div
                          class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                          data-test-id="rowNumberSelect"
                        >
                          <div
                            aria-haspopup="listbox"
@ -203491,6 +203529,7 @@ exports[`Storyshots Views / Products / Product list limits reached 1`] = `
                        </span>
                        <div
                          class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                          data-test-id="rowNumberSelect"
                        >
                          <div
                            aria-haspopup="listbox"
@ -206029,6 +206068,7 @@ exports[`Storyshots Views / Products / Product list loading 1`] = `
                        </span>
                        <div
                          class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                          data-test-id="rowNumberSelect"
                        >
                          <div
                            aria-haspopup="listbox"
@ -206579,6 +206619,7 @@ exports[`Storyshots Views / Products / Product list no channels 1`] = `
                        </span>
                        <div
                          class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                          data-test-id="rowNumberSelect"
                        >
                          <div
                            aria-haspopup="listbox"
@ -208830,6 +208871,7 @@ exports[`Storyshots Views / Products / Product list no data 1`] = `
                        </span>
                        <div
                          class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                          data-test-id="rowNumberSelect"
                        >
                          <div
                            aria-haspopup="listbox"
@ -209280,6 +209322,7 @@ exports[`Storyshots Views / Products / Product list no limits 1`] = `
                        </span>
                        <div
                          class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                          data-test-id="rowNumberSelect"
                        >
                          <div
                            aria-haspopup="listbox"
@ -211805,6 +211848,7 @@ exports[`Storyshots Views / Products / Product list with data 1`] = `
                        </span>
                        <div
                          class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                          data-test-id="rowNumberSelect"
                        >
                          <div
                            aria-haspopup="listbox"
@ -230395,6 +230439,7 @@ exports[`Storyshots Views / Shipping / Shipping zones list default 1`] = `
                          </span>
                          <div
                            class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                            data-test-id="rowNumberSelect"
                          >
                            <div
                              aria-haspopup="listbox"
@ -231102,6 +231147,7 @@ exports[`Storyshots Views / Shipping / Shipping zones list loading 1`] = `
                          </span>
                          <div
                            class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                            data-test-id="rowNumberSelect"
                          >
                            <div
                              aria-haspopup="listbox"
@ -231501,6 +231547,7 @@ exports[`Storyshots Views / Shipping / Shipping zones list no data 1`] = `
                          </span>
                          <div
                            class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                            data-test-id="rowNumberSelect"
                          >
                            <div
                              aria-haspopup="listbox"
@ -231861,6 +231908,7 @@ exports[`Storyshots Views / Shipping / Shipping zones list no site settings perm
                          </span>
                          <div
                            class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                            data-test-id="rowNumberSelect"
                          >
                            <div
                              aria-haspopup="listbox"
@ -235519,6 +235567,7 @@ exports[`Storyshots Views / Staff / Staff members default 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -236246,6 +236295,7 @@ exports[`Storyshots Views / Staff / Staff members limits reached 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -236922,6 +236972,7 @@ exports[`Storyshots Views / Staff / Staff members no limits 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -237603,6 +237654,7 @@ exports[`Storyshots Views / Staff / Staff members when loading 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -242720,6 +242772,7 @@ exports[`Storyshots Views / Warehouses / Warehouse list default 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -243321,6 +243374,7 @@ exports[`Storyshots Views / Warehouses / Warehouse list limits reached 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -243876,6 +243930,7 @@ exports[`Storyshots Views / Warehouses / Warehouse list loading 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -244238,6 +244293,7 @@ exports[`Storyshots Views / Warehouses / Warehouse list no data 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"
@ -244531,6 +244587,7 @@ exports[`Storyshots Views / Warehouses / Warehouse list no limits 1`] = `
                      </span>
                      <div
                        class="MuiInputBase-root-id MuiInput-root-id MuiInput-underline-id RowNumberSelect-select-id"
+                        data-test-id="rowNumberSelect"
                      >
                        <div
                          aria-haspopup="listbox"