From 5599cddc15796c284df75384882952068f1a29af Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bart=C5=82omiej=20Szubert?= <bartlomiejszubert@gmail.com>
Date: Sat, 19 Sep 2020 11:34:51 +0200
Subject: [PATCH 1/2] Fix #29971 - Layered navigation swatches ignore show
 tooltip setting

---
 .../Swatches/Model/Plugin/FilterRenderer.php  |  77 ++++++++-----
 .../templates/product/layered/renderer.phtml  | 107 +++++++++---------
 .../web/js/layered/swatch-renderer.js         |  30 +++++
 3 files changed, 134 insertions(+), 80 deletions(-)
 create mode 100644 app/code/Magento/Swatches/view/frontend/web/js/layered/swatch-renderer.js

diff --git a/app/code/Magento/Swatches/Model/Plugin/FilterRenderer.php b/app/code/Magento/Swatches/Model/Plugin/FilterRenderer.php
index e2d452dd9ddaa..ec7030903c6cc 100644
--- a/app/code/Magento/Swatches/Model/Plugin/FilterRenderer.php
+++ b/app/code/Magento/Swatches/Model/Plugin/FilterRenderer.php
@@ -3,63 +3,82 @@
  * Copyright © Magento, Inc. All rights reserved.
  * See COPYING.txt for license details.
  */
+declare(strict_types=1);
+
 namespace Magento\Swatches\Model\Plugin;
 
-/**
- * Class FilterRenderer
- */
+use Closure;
+use Magento\Catalog\Model\Layer\Filter\FilterInterface;
+use Magento\Framework\App\ObjectManager;
+use Magento\Framework\Exception\LocalizedException;
+use Magento\Framework\View\LayoutInterface;
+use Magento\LayeredNavigation\Block\Navigation\FilterRenderer as Subject;
+use Magento\Swatches\Block\LayeredNavigation\RenderLayered;
+use Magento\Swatches\Helper\Data;
+use Magento\Swatches\ViewModel\Product\Renderer\Configurable as ConfigurableViewModel;
+
 class FilterRenderer
 {
     /**
-     * @var \Magento\Framework\View\LayoutInterface
+     * @var LayoutInterface
      */
     protected $layout;
 
     /**
-     * Path to RenderLayered Block
-     *
-     * @var string
+     * @var Data
      */
-    protected $block = \Magento\Swatches\Block\LayeredNavigation\RenderLayered::class;
+    protected $swatchHelper;
 
     /**
-     * @var \Magento\Swatches\Helper\Data
+     * @var ConfigurableViewModel|null
      */
-    protected $swatchHelper;
+    private $configurableViewModel;
 
     /**
-     * @param \Magento\Framework\View\LayoutInterface $layout
-     * @param \Magento\Swatches\Helper\Data $swatchHelper
+     * @var string
+     */
+    protected $block = RenderLayered::class;
+
+    /**
+     * @param LayoutInterface $layout
+     * @param Data $swatchHelper
+     * @param ConfigurableViewModel|null $configurableViewModel
      */
     public function __construct(
-        \Magento\Framework\View\LayoutInterface $layout,
-        \Magento\Swatches\Helper\Data $swatchHelper
+        LayoutInterface $layout,
+        Data $swatchHelper,
+        ?ConfigurableViewModel $configurableViewModel = null
     ) {
         $this->layout = $layout;
         $this->swatchHelper = $swatchHelper;
+        $this->configurableViewModel = $configurableViewModel
+            ?? ObjectManager::getInstance()->get(ConfigurableViewModel::class);
     }
 
     /**
-     * @SuppressWarnings(PHPMD.UnusedFormalParameter)
-     * @param \Magento\LayeredNavigation\Block\Navigation\FilterRenderer $subject
-     * @param \Closure $proceed
-     * @param \Magento\Catalog\Model\Layer\Filter\FilterInterface $filter
+     * Override block rendered for swatch attribute in layered navigation
+     *
+     * @param Subject $subject
+     * @param Closure $proceed
+     * @param FilterInterface $filter
+     *
      * @return mixed
-     * @throws \Magento\Framework\Exception\LocalizedException
+     * @throws LocalizedException
+     * @SuppressWarnings(PHPMD.UnusedFormalParameter)
      */
     public function aroundRender(
-        \Magento\LayeredNavigation\Block\Navigation\FilterRenderer $subject,
-        \Closure $proceed,
-        \Magento\Catalog\Model\Layer\Filter\FilterInterface $filter
+        Subject $subject,
+        Closure $proceed,
+        FilterInterface $filter
     ) {
-        if ($filter->hasAttributeModel()) {
-            if ($this->swatchHelper->isSwatchAttribute($filter->getAttributeModel())) {
-                return $this->layout
-                    ->createBlock($this->block)
-                    ->setSwatchFilter($filter)
-                    ->toHtml();
-            }
+        if ($filter->hasAttributeModel() && $this->swatchHelper->isSwatchAttribute($filter->getAttributeModel())) {
+            return $this->layout
+                ->createBlock($this->block)
+                ->setSwatchFilter($filter)
+                ->setData('configurable_view_model', $this->configurableViewModel)
+                ->toHtml();
         }
+
         return $proceed($filter);
     }
 }
diff --git a/app/code/Magento/Swatches/view/frontend/templates/product/layered/renderer.phtml b/app/code/Magento/Swatches/view/frontend/templates/product/layered/renderer.phtml
index bae3820042de0..1194d3ffc00e6 100644
--- a/app/code/Magento/Swatches/view/frontend/templates/product/layered/renderer.phtml
+++ b/app/code/Magento/Swatches/view/frontend/templates/product/layered/renderer.phtml
@@ -4,31 +4,38 @@
  * See COPYING.txt for license details.
  */
 
+use Magento\Framework\Escaper;
+use Magento\Framework\View\Helper\SecureHtmlRenderer;
+use Magento\Swatches\Block\LayeredNavigation\RenderLayered;
+use Magento\Swatches\ViewModel\Product\Renderer\Configurable as ConfigurableViewModel;
+
 // phpcs:disable PSR2.ControlStructures.SwitchDeclaration
 // phpcs:disable Generic.WhiteSpace.ScopeIndent
 
-/** @var $block \Magento\Swatches\Block\LayeredNavigation\RenderLayered */
-/** @var \Magento\Framework\View\Helper\SecureHtmlRenderer $secureRenderer */
-/** @var \Magento\Framework\Escaper $escaper */
+/** @var RenderLayered $block */
+/** @var SecureHtmlRenderer $secureRenderer */
+/** @var Escaper $escaper */
 ?>
 <?php $swatchData = $block->getSwatchData(); ?>
-<div class="swatch-attribute swatch-layered <?= $block->escapeHtmlAttr($swatchData['attribute_code']) ?>"
-     data-attribute-code="<?= $block->escapeHtmlAttr($swatchData['attribute_code']) ?>"
-     data-attribute-id="<?= $block->escapeHtmlAttr($swatchData['attribute_id']) ?>">
+<?php /** @var ConfigurableViewModel $configurableViewModel */ ?>
+<?php $configurableViewModel = $block->getConfigurableViewModel() ?>
+<div class="swatch-attribute swatch-layered <?= $escaper->escapeHtmlAttr($swatchData['attribute_code']) ?>"
+     data-attribute-code="<?= $escaper->escapeHtmlAttr($swatchData['attribute_code']) ?>"
+     data-attribute-id="<?= $escaper->escapeHtmlAttr($swatchData['attribute_id']) ?>">
     <div class="swatch-attribute-options clearfix">
         <?php foreach ($swatchData['options'] as $option => $label): ?>
-            <a href="<?= $block->escapeUrl($label['link']) ?>" rel="nofollow"
-               aria-label="<?= $block->escapeHtmlAttr($label['label']) ?>"
+            <a href="<?= $escaper->escapeUrl($label['link']) ?>" rel="nofollow"
+               aria-label="<?= $escaper->escapeHtmlAttr($label['label']) ?>"
                class="swatch-option-link-layered">
                 <?php if (isset($swatchData['swatches'][$option]['type'])): ?>
                     <?php switch ($swatchData['swatches'][$option]['type']) {
                         case '3':
                             ?>
-                            <div class="swatch-option <?= $block->escapeHtmlAttr($label['custom_style']) ?>"
+                            <div class="swatch-option <?= $escaper->escapeHtmlAttr($label['custom_style']) ?>"
                                  tabindex="-1"
                                  data-option-type="3"
-                                 data-option-id="<?= $block->escapeHtmlAttr($option) ?>"
-                                 data-option-label="<?= $block->escapeHtmlAttr($label['label']) ?>"
+                                 data-option-id="<?= $escaper->escapeHtmlAttr($option) ?>"
+                                 data-option-label="<?= $escaper->escapeHtmlAttr($label['label']) ?>"
                                  data-option-tooltip-thumb=""
                                  data-option-tooltip-value=""
                                 ></div>
@@ -43,64 +50,64 @@
                                 'swatch_image',
                                 $swatchData['swatches'][$option]['value']
                             );
-                            $escapedUrl = $block->escapeUrl($swatchImagePath);
+                            $escapedUrl = $escaper->escapeUrl($swatchImagePath);
                             ?>
-                            <div class="swatch-option image <?= $block->escapeHtmlAttr($label['custom_style']) ?>"
+                            <div class="swatch-option image <?= $escaper->escapeHtmlAttr($label['custom_style']) ?>"
                                  tabindex="-1"
                                  data-option-type="2"
-                                 data-option-id="<?= $block->escapeHtmlAttr($option) ?>"
-                                 data-option-label="<?= $block->escapeHtmlAttr($label['label']) ?>"
-                                 data-option-tooltip-thumb="<?= $block->escapeUrl($swatchThumbPath) ?>"
+                                 data-option-id="<?= $escaper->escapeHtmlAttr($option) ?>"
+                                 data-option-label="<?= $escaper->escapeHtmlAttr($label['label']) ?>"
+                                 data-option-tooltip-thumb="<?= $escaper->escapeUrl($swatchThumbPath) ?>"
                                  data-option-tooltip-value="">
                             </div>
                             <?php
-                            $element = 'swatchImageOption' .$escaper->escapeJs($option);
-                            $script = 'var ' .$element
-                                .' = document.querySelector(\'div[data-option-id="' .$escaper->escapeJs($option)
-                                .'"]\');' .PHP_EOL;
-                            $script .= $element .'.style.background = "url(\''
-                                .$escapedUrl .'\') no-repeat center";' .PHP_EOL;
-                            $script .= $element .'.style.backgroundSize = "initial";';
+                            $element = 'swatchImageOption' . $escaper->escapeJs($option);
+                            $script = 'var ' . $element
+                                . ' = document.querySelector(\'div[data-option-id="' . $escaper->escapeJs($option)
+                                . '"]\');' . PHP_EOL;
+                            $script .= $element . '.style.background = "url(\''
+                                . $escapedUrl . '\') no-repeat center";' . PHP_EOL;
+                            $script .= $element . '.style.backgroundSize = "initial";';
                             ?>
-                            <?= /* @noEscape*/ $secureRenderer->renderTag('script', [], $script, false); ?>
+                            <?= /* @noEscape*/ $secureRenderer->renderTag('script', [], $script, false) ?>
                             <?php break;
                         case '1':
                             ?>
-                            <div class="swatch-option color <?= $block->escapeHtmlAttr($label['custom_style']) ?>"
+                            <div class="swatch-option color <?= $escaper->escapeHtmlAttr($label['custom_style']) ?>"
                                  tabindex="-1"
                                  data-option-type="1"
-                                 data-option-id="<?= $block->escapeHtmlAttr($option) ?>"
-                                 data-option-label="<?= $block->escapeHtmlAttr($label['label']) ?>"
+                                 data-option-id="<?= $escaper->escapeHtmlAttr($option) ?>"
+                                 data-option-label="<?= $escaper->escapeHtmlAttr($label['label']) ?>"
                                  data-option-tooltip-thumb=""
-                                 data-option-tooltip-value="<?= $block->escapeHtmlAttr(
+                                 data-option-tooltip-value="<?= $escaper->escapeHtmlAttr(
                                      $swatchData['swatches'][$option]['value']
                                  ) ?>">
                             </div>
                             <?php
-                            $element = 'swatchImageOption' .$escaper->escapeJs($option);
+                            $element = 'swatchImageOption' . $escaper->escapeJs($option);
                             $backgroundValue = $escaper->escapeJs(
                                 str_replace('\'', '\\\'', $swatchData['swatches'][$option]['value'])
                             );
-                            $script = 'var ' .$element
-                                .' = document.querySelector(\'div[data-option-id="' .$escaper->escapeJs($option)
-                                .'"]\');' .PHP_EOL;
-                            $script .= $element .'.style.background = "' .$backgroundValue
-                                .' no-repeat center";' .PHP_EOL;
-                            $script .= $element .'.style.backgroundSize = "initial";';
+                            $script = 'var ' . $element
+                                . ' = document.querySelector(\'div[data-option-id="' . $escaper->escapeJs($option)
+                                . '"]\');' . PHP_EOL;
+                            $script .= $element . '.style.background = "' . $backgroundValue
+                                . ' no-repeat center";' . PHP_EOL;
+                            $script .= $element . '.style.backgroundSize = "initial";';
                             ?>
-                            <?= /* @noEscape*/ $secureRenderer->renderTag('script', [], $script, false); ?>
+                            <?= /* @noEscape*/ $secureRenderer->renderTag('script', [], $script, false) ?>
                             <?php break;
                         case '0':
                         default:
                             ?>
-                            <div class="swatch-option text <?= $block->escapeHtmlAttr($label['custom_style']) ?>"
+                            <div class="swatch-option text <?= $escaper->escapeHtmlAttr($label['custom_style']) ?>"
                                  tabindex="-1"
                                  data-option-type="0"
-                                 data-option-id="<?= $block->escapeHtmlAttr($option) ?>"
-                                 data-option-label="<?= $block->escapeHtmlAttr($label['label']) ?>"
+                                 data-option-id="<?= $escaper->escapeHtmlAttr($option) ?>"
+                                 data-option-label="<?= $escaper->escapeHtmlAttr($label['label']) ?>"
                                  data-option-tooltip-thumb=""
                                  data-option-tooltip-value=""
-                                ><?= $block->escapeHtml($swatchData['swatches'][$option]['value']) ?></div>
+                                ><?= $escaper->escapeHtml($swatchData['swatches'][$option]['value']) ?></div>
                         <?php break;
                     } ?>
                 <?php endif; ?>
@@ -108,14 +115,12 @@
         <?php endforeach; ?>
     </div>
 </div>
-<?php $scriptString = <<<script
-
-    require(["jquery", "Magento_Swatches/js/swatch-renderer"], function ($) {
-        $('.swatch-layered.{$block->escapeJs($swatchData['attribute_code'])}')
-            .find('[data-option-type="1"], [data-option-type="2"], [data-option-type="0"], [data-option-type="3"]')
-            .SwatchRendererTooltip();
-    });
-
-script;
-?>
-<?= /* @noEscape */ $secureRenderer->renderTag('script', [], $scriptString, false) ?>
+<script type="text/x-magento-init">
+    {
+        ".swatch-layered.<?= $escaper->escapeJs($swatchData['attribute_code']) ?>": {
+            "Magento_Swatches/js/layered/swatch-renderer": {
+                "showTooltip": <?= $escaper->escapeJs($configurableViewModel->getShowSwatchTooltip()) ?>
+            }
+        }
+    }
+</script>
diff --git a/app/code/Magento/Swatches/view/frontend/web/js/layered/swatch-renderer.js b/app/code/Magento/Swatches/view/frontend/web/js/layered/swatch-renderer.js
new file mode 100644
index 0000000000000..de96dc15b4ff7
--- /dev/null
+++ b/app/code/Magento/Swatches/view/frontend/web/js/layered/swatch-renderer.js
@@ -0,0 +1,30 @@
+/**
+ * Copyright © Magento, Inc. All rights reserved.
+ * See COPYING.txt for license details.
+ */
+
+define([
+    'jquery',
+    'Magento_Swatches/js/swatch-renderer'
+], function ($) {
+    'use strict';
+
+    $.widget('mage.layeredSwatchRenderer', {
+        options: {
+            showTooltip: 1,
+            swatchElementSelector: '[data-option-type="1"], [data-option-type="2"], ' +
+                '[data-option-type="0"], [data-option-type="3"]'
+        },
+
+        /**
+         * @private
+         */
+        _create: function () {
+            if (this.options.showTooltip === 1) {
+                $(this.element).find(this.options.swatchElementSelector).SwatchRendererTooltip();
+            }
+        }
+    });
+
+    return $.mage.layeredSwatchRenderer;
+});

From 354ec22b3153048eb8b751c5366364316ec90022 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bart=C5=82omiej=20Szubert?= <bartlomiejszubert@gmail.com>
Date: Tue, 6 Oct 2020 14:35:30 +0200
Subject: [PATCH 2/2] Fix #29971 - cover changes with mftf test

---
 ...dminAssignCategoryToProductActionGroup.xml |  21 +++
 ...ignCategoryToProductAndSaveActionGroup.xml |  12 +-
 ...SaveProductWithNewAttributeActionGroup.xml |  26 +++
 .../StorefrontCategorySidebarSection.xml      |   1 +
 ...nfigurationsByAttributeCodeActionGroup.xml |   2 +
 ...ndFilterInLayeredNavigationActionGroup.xml |  21 +++
 .../StorefrontLayeredNavigationSection.xml    |   1 +
 .../Swatches/Model/Plugin/FilterRenderer.php  |  14 +-
 ...vigationSwatchTooltipHiddenActionGroup.xml |  19 +++
 ...igationSwatchTooltipVisibleActionGroup.xml |  23 +++
 ...ductPageSwatchTooltipHiddenActionGroup.xml |  19 +++
 ...uctPageSwatchTooltipVisibleActionGroup.xml |  24 +++
 .../Test/AdminDisablingSwatchTooltipsTest.xml | 160 ++++++------------
 13 files changed, 213 insertions(+), 130 deletions(-)
 create mode 100644 app/code/Magento/Catalog/Test/Mftf/ActionGroup/AdminAssignCategoryToProductActionGroup.xml
 create mode 100644 app/code/Magento/Catalog/Test/Mftf/ActionGroup/AdminSaveProductWithNewAttributeActionGroup.xml
 create mode 100644 app/code/Magento/LayeredNavigation/Test/Mftf/ActionGroup/StorefrontExpandFilterInLayeredNavigationActionGroup.xml
 create mode 100644 app/code/Magento/Swatches/Test/Mftf/ActionGroup/AssertLayeredNavigationSwatchTooltipHiddenActionGroup.xml
 create mode 100644 app/code/Magento/Swatches/Test/Mftf/ActionGroup/AssertLayeredNavigationSwatchTooltipVisibleActionGroup.xml
 create mode 100644 app/code/Magento/Swatches/Test/Mftf/ActionGroup/AssertProductPageSwatchTooltipHiddenActionGroup.xml
 create mode 100644 app/code/Magento/Swatches/Test/Mftf/ActionGroup/AssertProductPageSwatchTooltipVisibleActionGroup.xml

diff --git a/app/code/Magento/Catalog/Test/Mftf/ActionGroup/AdminAssignCategoryToProductActionGroup.xml b/app/code/Magento/Catalog/Test/Mftf/ActionGroup/AdminAssignCategoryToProductActionGroup.xml
new file mode 100644
index 0000000000000..a8cafd4433161
--- /dev/null
+++ b/app/code/Magento/Catalog/Test/Mftf/ActionGroup/AdminAssignCategoryToProductActionGroup.xml
@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+ /**
+  * Copyright © Magento, Inc. All rights reserved.
+  * See COPYING.txt for license details.
+  */
+-->
+
+<actionGroups xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+              xsi:noNamespaceSchemaLocation="urn:magento:mftf:Test/etc/actionGroupSchema.xsd">
+    <actionGroup name="AdminAssignCategoryToProductActionGroup">
+        <arguments>
+            <argument name="categoryName" type="string"/>
+        </arguments>
+        <!-- on edit Product page catalog/product/edit/id/{{product_id}}/ -->
+        <click selector="{{AdminProductFormSection.categoriesDropdown}}" stepKey="openDropDown"/>
+        <checkOption selector="{{AdminProductFormSection.selectCategory(categoryName)}}" stepKey="selectCategory"/>
+        <click selector="{{AdminProductFormSection.done}}" stepKey="clickDone"/>
+        <waitForPageLoad stepKey="waitForApplyCategory"/>
+    </actionGroup>
+</actionGroups>
diff --git a/app/code/Magento/Catalog/Test/Mftf/ActionGroup/AdminAssignCategoryToProductAndSaveActionGroup.xml b/app/code/Magento/Catalog/Test/Mftf/ActionGroup/AdminAssignCategoryToProductAndSaveActionGroup.xml
index 0cb7c4885ac77..2d0396f6a0b0c 100644
--- a/app/code/Magento/Catalog/Test/Mftf/ActionGroup/AdminAssignCategoryToProductAndSaveActionGroup.xml
+++ b/app/code/Magento/Catalog/Test/Mftf/ActionGroup/AdminAssignCategoryToProductAndSaveActionGroup.xml
@@ -8,17 +8,9 @@
 
 <actionGroups xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
               xsi:noNamespaceSchemaLocation="urn:magento:mftf:Test/etc/actionGroupSchema.xsd">
-    <actionGroup name="AdminAssignCategoryToProductAndSaveActionGroup">
-        <arguments>
-            <argument name="categoryName" type="string"/>
-        </arguments>
-        <!-- on edit Product page catalog/product/edit/id/{{product_id}}/ -->
-        <click selector="{{AdminProductFormSection.categoriesDropdown}}" stepKey="openDropDown"/>
-        <checkOption selector="{{AdminProductFormSection.selectCategory(categoryName)}}" stepKey="selectCategory"/>
-        <click selector="{{AdminProductFormSection.done}}" stepKey="clickDone"/>
-        <waitForPageLoad stepKey="waitForApplyCategory"/>
+    <actionGroup name="AdminAssignCategoryToProductAndSaveActionGroup" extends="AdminAssignCategoryToProductActionGroup">
         <click selector="{{AdminProductFormSection.save}}" stepKey="clickSave"/>
         <waitForPageLoad stepKey="waitForSavingProduct"/>
         <see userInput="You saved the product." selector="{{CatalogProductsSection.messageSuccessSavedProduct}}" stepKey="seeSuccessMessage"/>
     </actionGroup>
-</actionGroups>
\ No newline at end of file
+</actionGroups>
diff --git a/app/code/Magento/Catalog/Test/Mftf/ActionGroup/AdminSaveProductWithNewAttributeActionGroup.xml b/app/code/Magento/Catalog/Test/Mftf/ActionGroup/AdminSaveProductWithNewAttributeActionGroup.xml
new file mode 100644
index 0000000000000..1a991f963569c
--- /dev/null
+++ b/app/code/Magento/Catalog/Test/Mftf/ActionGroup/AdminSaveProductWithNewAttributeActionGroup.xml
@@ -0,0 +1,26 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+ /**
+  * Copyright © Magento, Inc. All rights reserved.
+  * See COPYING.txt for license details.
+  */
+-->
+
+<actionGroups xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+              xsi:noNamespaceSchemaLocation="urn:magento:mftf:Test/etc/actionGroupSchema.xsd">
+    <actionGroup name="AdminSaveProductWithNewAttributeActionGroup">
+        <annotations>
+            <description>Clicks on the Save button. If popup related to new attribute appears, clicks on the Confirm button to close it. Validates that the Success Message is present and correct.</description>
+        </annotations>
+
+        <scrollToTopOfPage stepKey="scrollTopPageProduct"/>
+        <waitForElementVisible selector="{{AdminProductFormActionSection.saveButton}}" stepKey="waitForSaveProductButton"/>
+        <click selector="{{AdminProductFormActionSection.saveButton}}" stepKey="clickSaveProduct"/>
+        <wait time="1" stepKey="waitForPopup"/>
+        <conditionalClick selector="{{AdminChooseAffectedAttributeSetPopup.confirm}}"
+                          dependentSelector="{{AdminChooseAffectedAttributeSetPopup.confirm}}" visible="true"
+                          stepKey="clickOnConfirmInPopup"/>
+        <waitForElementVisible selector="{{AdminMessagesSection.success}}" stepKey="waitProductSaveSuccessMessage"/>
+        <see selector="{{AdminMessagesSection.success}}" userInput="You saved the product." stepKey="seeSaveConfirmation"/>
+    </actionGroup>
+</actionGroups>
diff --git a/app/code/Magento/Catalog/Test/Mftf/Section/StorefrontCategorySidebarSection/StorefrontCategorySidebarSection.xml b/app/code/Magento/Catalog/Test/Mftf/Section/StorefrontCategorySidebarSection/StorefrontCategorySidebarSection.xml
index 5ec493aef0cea..64cc35bdd3419 100644
--- a/app/code/Magento/Catalog/Test/Mftf/Section/StorefrontCategorySidebarSection/StorefrontCategorySidebarSection.xml
+++ b/app/code/Magento/Catalog/Test/Mftf/Section/StorefrontCategorySidebarSection/StorefrontCategorySidebarSection.xml
@@ -16,6 +16,7 @@
         <element name="filterOptionByLabel" type="button" selector=" div.filter-options-item div[data-option-label='{{optionLabel}}']" parameterized="true"/>
         <element name="removeFilter" type="button" selector="div.filter-current .remove"/>
         <element name="activeFilterOptions" type="text" selector=".filter-options-item.active .items"/>
+        <element name="activeFilterOptionsByTitle" type="text" selector="//div[@class='filter-options-title' and contains(text(), '{{var1}}')]/following-sibling::*[@class='filter-options-item active'][1]/*[@class='items']" parameterized="true"/>
         <element name="activeFilterOptionItemByPosition" type="text" selector=".filter-options-item.active .items li:nth-child({{itemPosition}}) a" parameterized="true"/>
         <element name="enabledFilterOptionItemByLabel" type="text" selector="//div[@class='filter-options']//li[@class='item']//a[contains(text(), '{{optionLabel}}')]" parameterized="true"/>
         <element name="disabledFilterOptionItemByLabel" type="text" selector="//div[@class='filter-options']//li[@class='item' and contains(text(), '{{optionLabel}}')]" parameterized="true"/>
diff --git a/app/code/Magento/ConfigurableProduct/Test/Mftf/ActionGroup/GenerateConfigurationsByAttributeCodeActionGroup.xml b/app/code/Magento/ConfigurableProduct/Test/Mftf/ActionGroup/GenerateConfigurationsByAttributeCodeActionGroup.xml
index 80248cf5e00f8..3baab15bb573b 100644
--- a/app/code/Magento/ConfigurableProduct/Test/Mftf/ActionGroup/GenerateConfigurationsByAttributeCodeActionGroup.xml
+++ b/app/code/Magento/ConfigurableProduct/Test/Mftf/ActionGroup/GenerateConfigurationsByAttributeCodeActionGroup.xml
@@ -17,6 +17,7 @@
         </arguments>
 
         <click selector="{{AdminProductFormConfigurationsSection.createConfigurations}}" stepKey="clickCreateConfigurations"/>
+        <waitForElementVisible selector="{{AdminCreateProductConfigurationsPanel.createNewAttribute}}" time="30" stepKey="waitForConfigurationModalOpen"/>
         <click selector="{{AdminCreateProductConfigurationsPanel.filters}}" stepKey="clickFilters"/>
         <fillField selector="{{AdminCreateProductConfigurationsPanel.attributeCode}}" userInput="{{attributeCode}}" stepKey="fillFilterAttributeCodeField"/>
         <click selector="{{AdminCreateProductConfigurationsPanel.applyFilters}}" stepKey="clickApplyFiltersButton"/>
@@ -28,5 +29,6 @@
         <fillField selector="{{AdminCreateProductConfigurationsPanel.quantity}}" userInput="99" stepKey="enterAttributeQuantity"/>
         <click selector="{{AdminCreateProductConfigurationsPanel.next}}" stepKey="clickOnNextButton3"/>
         <click selector="{{AdminCreateProductConfigurationsPanel.next}}" stepKey="clickOnNextButton4"/>
+        <waitForElementVisible selector="{{AdminProductFormActionSection.saveButton}}" stepKey="waitForSaveBtnVisible"/>
     </actionGroup>
 </actionGroups>
diff --git a/app/code/Magento/LayeredNavigation/Test/Mftf/ActionGroup/StorefrontExpandFilterInLayeredNavigationActionGroup.xml b/app/code/Magento/LayeredNavigation/Test/Mftf/ActionGroup/StorefrontExpandFilterInLayeredNavigationActionGroup.xml
new file mode 100644
index 0000000000000..dfe771cb053df
--- /dev/null
+++ b/app/code/Magento/LayeredNavigation/Test/Mftf/ActionGroup/StorefrontExpandFilterInLayeredNavigationActionGroup.xml
@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+/**
+ * Copyright © Magento, Inc. All rights reserved.
+ * See COPYING.txt for license details.
+ */
+-->
+
+<actionGroups xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+              xsi:noNamespaceSchemaLocation="urn:magento:mftf:Test/etc/actionGroupSchema.xsd">
+    <actionGroup name="StorefrontExpandFilterInLayeredNavigationActionGroup">
+        <annotations>
+            <description>Expands the filter on a Storefront layered navigation if it is not expanded.</description>
+        </annotations>
+        <arguments>
+            <argument name="filterLabel"/>
+        </arguments>
+
+        <conditionalClick selector="{{StorefrontCategorySidebarSection.filterOptionsTitle(filterLabel)}}" dependentSelector="{{StorefrontCategorySidebarSection.activeFilterOptionsByTitle(filterLabel)}}" visible="false" stepKey="expandFilterOptions"/>
+    </actionGroup>
+</actionGroups>
diff --git a/app/code/Magento/LayeredNavigation/Test/Mftf/Section/LayeredNavigationSection/StorefrontLayeredNavigationSection.xml b/app/code/Magento/LayeredNavigation/Test/Mftf/Section/LayeredNavigationSection/StorefrontLayeredNavigationSection.xml
index d3a3005c296b2..5bf2ed43347dd 100644
--- a/app/code/Magento/LayeredNavigation/Test/Mftf/Section/LayeredNavigationSection/StorefrontLayeredNavigationSection.xml
+++ b/app/code/Magento/LayeredNavigation/Test/Mftf/Section/LayeredNavigationSection/StorefrontLayeredNavigationSection.xml
@@ -9,5 +9,6 @@
 	xsi:noNamespaceSchemaLocation="urn:magento:mftf:Page/etc/SectionObject.xsd">
     <section name="StorefrontLayeredNavigationSection">
         <element name="shoppingOptionsByName" type="button" selector="//*[text()='Shopping Options']/..//*[contains(text(),'{{arg}}')]" parameterized="true"/>
+        <element name="nthSwatchOption" type="button" selector="div#layered-filter-block div.swatch-option:nth-of-type({{var}})" parameterized="true"/>
     </section>
 </sections>
diff --git a/app/code/Magento/Swatches/Model/Plugin/FilterRenderer.php b/app/code/Magento/Swatches/Model/Plugin/FilterRenderer.php
index ec7030903c6cc..961d664d36db3 100644
--- a/app/code/Magento/Swatches/Model/Plugin/FilterRenderer.php
+++ b/app/code/Magento/Swatches/Model/Plugin/FilterRenderer.php
@@ -9,7 +9,6 @@
 
 use Closure;
 use Magento\Catalog\Model\Layer\Filter\FilterInterface;
-use Magento\Framework\App\ObjectManager;
 use Magento\Framework\Exception\LocalizedException;
 use Magento\Framework\View\LayoutInterface;
 use Magento\LayeredNavigation\Block\Navigation\FilterRenderer as Subject;
@@ -22,12 +21,12 @@ class FilterRenderer
     /**
      * @var LayoutInterface
      */
-    protected $layout;
+    private $layout;
 
     /**
      * @var Data
      */
-    protected $swatchHelper;
+    private $swatchHelper;
 
     /**
      * @var ConfigurableViewModel|null
@@ -37,22 +36,21 @@ class FilterRenderer
     /**
      * @var string
      */
-    protected $block = RenderLayered::class;
+    private $block = RenderLayered::class;
 
     /**
      * @param LayoutInterface $layout
      * @param Data $swatchHelper
-     * @param ConfigurableViewModel|null $configurableViewModel
+     * @param ConfigurableViewModel $configurableViewModel
      */
     public function __construct(
         LayoutInterface $layout,
         Data $swatchHelper,
-        ?ConfigurableViewModel $configurableViewModel = null
+        ConfigurableViewModel $configurableViewModel
     ) {
         $this->layout = $layout;
         $this->swatchHelper = $swatchHelper;
-        $this->configurableViewModel = $configurableViewModel
-            ?? ObjectManager::getInstance()->get(ConfigurableViewModel::class);
+        $this->configurableViewModel = $configurableViewModel;
     }
 
     /**
diff --git a/app/code/Magento/Swatches/Test/Mftf/ActionGroup/AssertLayeredNavigationSwatchTooltipHiddenActionGroup.xml b/app/code/Magento/Swatches/Test/Mftf/ActionGroup/AssertLayeredNavigationSwatchTooltipHiddenActionGroup.xml
new file mode 100644
index 0000000000000..30aec8a5c5aab
--- /dev/null
+++ b/app/code/Magento/Swatches/Test/Mftf/ActionGroup/AssertLayeredNavigationSwatchTooltipHiddenActionGroup.xml
@@ -0,0 +1,19 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+ /**
+  * Copyright © Magento, Inc. All rights reserved.
+  * See COPYING.txt for license details.
+  */
+-->
+
+<actionGroups xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+        xsi:noNamespaceSchemaLocation="urn:magento:mftf:Test/etc/actionGroupSchema.xsd">
+    <actionGroup name="AssertLayeredNavigationSwatchTooltipHiddenActionGroup" extends="AssertLayeredNavigationSwatchTooltipVisibleActionGroup">
+        <annotations>
+            <description>Validates that the swatch tooltip doesn't appear on layered navigation after hovering swatch.</description>
+        </annotations>
+
+        <remove keyForRemoval="swatchTooltipVisible"/>
+        <dontSeeElement selector="{{StorefrontProductInfoMainSection.swatchOptionTooltip}}" stepKey="swatchTooltipHidden"/>
+    </actionGroup>
+</actionGroups>
diff --git a/app/code/Magento/Swatches/Test/Mftf/ActionGroup/AssertLayeredNavigationSwatchTooltipVisibleActionGroup.xml b/app/code/Magento/Swatches/Test/Mftf/ActionGroup/AssertLayeredNavigationSwatchTooltipVisibleActionGroup.xml
new file mode 100644
index 0000000000000..6eb159db51af1
--- /dev/null
+++ b/app/code/Magento/Swatches/Test/Mftf/ActionGroup/AssertLayeredNavigationSwatchTooltipVisibleActionGroup.xml
@@ -0,0 +1,23 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+ /**
+  * Copyright © Magento, Inc. All rights reserved.
+  * See COPYING.txt for license details.
+  */
+-->
+
+<actionGroups xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+        xsi:noNamespaceSchemaLocation="urn:magento:mftf:Test/etc/actionGroupSchema.xsd">
+    <actionGroup name="AssertLayeredNavigationSwatchTooltipVisibleActionGroup">
+        <annotations>
+            <description>Validates that the swatch tooltip appears on layered navigation after hovering swatch.</description>
+        </annotations>
+        <arguments>
+            <argument name="nthSwatch" type="string" defaultValue="1"/>
+        </arguments>
+
+        <moveMouseOver selector="{{StorefrontLayeredNavigationSection.nthSwatchOption(nthSwatch)}}" stepKey="hoverSwatch"/>
+        <wait time="1" stepKey="waitForTooltip"/>
+        <seeElement selector="{{StorefrontProductInfoMainSection.swatchOptionTooltip}}" stepKey="swatchTooltipVisible"/>
+    </actionGroup>
+</actionGroups>
diff --git a/app/code/Magento/Swatches/Test/Mftf/ActionGroup/AssertProductPageSwatchTooltipHiddenActionGroup.xml b/app/code/Magento/Swatches/Test/Mftf/ActionGroup/AssertProductPageSwatchTooltipHiddenActionGroup.xml
new file mode 100644
index 0000000000000..8c813a950e76f
--- /dev/null
+++ b/app/code/Magento/Swatches/Test/Mftf/ActionGroup/AssertProductPageSwatchTooltipHiddenActionGroup.xml
@@ -0,0 +1,19 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+ /**
+  * Copyright © Magento, Inc. All rights reserved.
+  * See COPYING.txt for license details.
+  */
+-->
+
+<actionGroups xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+        xsi:noNamespaceSchemaLocation="urn:magento:mftf:Test/etc/actionGroupSchema.xsd">
+    <actionGroup name="AssertProductPageSwatchTooltipHiddenActionGroup" extends="AssertProductPageSwatchTooltipVisibleActionGroup">
+        <annotations>
+            <description>Validates that the swatch tooltip doesn't appear on product page after hovering swatch.</description>
+        </annotations>
+
+        <remove keyForRemoval="swatchTooltipVisible"/>
+        <dontSeeElement selector="{{StorefrontProductInfoMainSection.swatchOptionTooltip}}" stepKey="swatchTooltipHidden"/>
+    </actionGroup>
+</actionGroups>
diff --git a/app/code/Magento/Swatches/Test/Mftf/ActionGroup/AssertProductPageSwatchTooltipVisibleActionGroup.xml b/app/code/Magento/Swatches/Test/Mftf/ActionGroup/AssertProductPageSwatchTooltipVisibleActionGroup.xml
new file mode 100644
index 0000000000000..c067471bf9295
--- /dev/null
+++ b/app/code/Magento/Swatches/Test/Mftf/ActionGroup/AssertProductPageSwatchTooltipVisibleActionGroup.xml
@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+ /**
+  * Copyright © Magento, Inc. All rights reserved.
+  * See COPYING.txt for license details.
+  */
+-->
+
+<actionGroups xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+        xsi:noNamespaceSchemaLocation="urn:magento:mftf:Test/etc/actionGroupSchema.xsd">
+    <actionGroup name="AssertProductPageSwatchTooltipVisibleActionGroup">
+        <annotations>
+            <description>Validates that the swatch tooltip appears on product page after hovering swatch.</description>
+        </annotations>
+        <arguments>
+            <argument name="nthSwatch" type="string" defaultValue="1"/>
+        </arguments>
+
+        <waitForElementVisible selector="{{StorefrontProductInfoMainSection.nthSwatchOption(nthSwatch)}}" stepKey="waitForSwatchVisible"/>
+        <moveMouseOver selector="{{StorefrontProductInfoMainSection.nthSwatchOption(nthSwatch)}}" stepKey="hoverSwatch"/>
+        <wait time="1" stepKey="waitForTooltip"/>
+        <seeElement selector="{{StorefrontProductInfoMainSection.swatchOptionTooltip}}" stepKey="swatchTooltipVisible"/>
+    </actionGroup>
+</actionGroups>
diff --git a/app/code/Magento/Swatches/Test/Mftf/Test/AdminDisablingSwatchTooltipsTest.xml b/app/code/Magento/Swatches/Test/Mftf/Test/AdminDisablingSwatchTooltipsTest.xml
index b48f181c8d199..077428a30b19b 100644
--- a/app/code/Magento/Swatches/Test/Mftf/Test/AdminDisablingSwatchTooltipsTest.xml
+++ b/app/code/Magento/Swatches/Test/Mftf/Test/AdminDisablingSwatchTooltipsTest.xml
@@ -18,145 +18,81 @@
             <group value="Swatches"/>
         </annotations>
         <before>
-            <!-- Create category -->
             <createData entity="ApiCategory" stepKey="createCategory"/>
 
-            <!-- Log in -->
+            <createData entity="ApiConfigurableProductWithDescription" stepKey="createProduct">
+                <requiredEntity createDataKey="createCategory"/>
+            </createData>
+
+            <createData entity="VisualSwatchProductAttributeForm" stepKey="createVisualSwatchAttribute"/>
+            <createData entity="SwatchProductAttributeOption1" stepKey="swatchAttributeFirstOption">
+                <requiredEntity createDataKey="createVisualSwatchAttribute"/>
+            </createData>
+
             <actionGroup ref="AdminLoginActionGroup" stepKey="loginAsAdmin"/>
         </before>
         <after>
-            <!-- Clean up our modifications to the existing color attribute -->
-            <actionGroup ref="AdminOpenProductAttributePageActionGroup" stepKey="goToProductAttributes"/>
-            <fillField selector="{{AdminProductAttributeGridSection.FilterByAttributeCode}}" userInput="color"
-                       stepKey="fillFilter"/>
-            <click selector="{{AdminProductAttributeGridSection.Search}}" stepKey="clickSearch"/>
-            <click selector="{{AdminProductAttributeGridSection.AttributeCode('color')}}" stepKey="clickRowToEdit"/>
-            <click selector="{{AdminManageSwatchSection.nthDelete('1')}}" stepKey="deleteSwatch1"/>
-            <waitForPageLoad stepKey="waitToClickSave"/>
-            <click selector="{{AttributePropertiesSection.SaveAndEdit}}" stepKey="clickSaveAndEdit"/>
-
-            <!-- Log out -->
             <actionGroup ref="AdminLogoutActionGroup" stepKey="logOut"/>
 
-            <!-- Delete category -->
+            <deleteData stepKey="deleteProduct" createDataKey="createProduct"/>
             <deleteData stepKey="deleteCategory" createDataKey="createCategory"/>
 
-            <!-- Enable swatch tooltips -->
-            <magentoCLI command="config:set catalog/frontend/show_swatch_tooltip 1" stepKey="disableTooltips"/>
+            <deleteData stepKey="deleteVisualSwatchAttribute" createDataKey="createVisualSwatchAttribute"/>
+
+            <magentoCLI command="config:set catalog/frontend/show_swatch_tooltip 1" stepKey="enableTooltips"/>
             <actionGroup ref="CliCacheFlushActionGroup" stepKey="flushCacheAfterEnabling">
                 <argument name="tags" value=""/>
             </actionGroup>
         </after>
 
-        <!-- Go to the edit page for the "color" attribute -->
-        <actionGroup ref="AdminOpenProductAttributePageActionGroup" stepKey="goToProductAttributes"/>
-        <fillField selector="{{AdminProductAttributeGridSection.FilterByAttributeCode}}" userInput="color"
-                   stepKey="fillFilter"/>
-        <click selector="{{AdminProductAttributeGridSection.Search}}" stepKey="clickSearch"/>
-        <click selector="{{AdminProductAttributeGridSection.AttributeCode('color')}}" stepKey="clickRowToEdit"/>
-
-        <!-- Change to visual swatches -->
-        <selectOption selector="{{AdminNewAttributePanel.inputType}}" userInput="swatch_visual"
-                      stepKey="selectVisualSwatch"/>
-
-        <!-- Set swatch using the color picker -->
-        <click selector="{{AdminManageSwatchSection.addSwatch}}" stepKey="clickAddSwatch1"/>
-        <actionGroup ref="OpenSwatchMenuByIndexActionGroup" stepKey="clickSwatch1">
-            <argument name="index" value="0"/>
+        <actionGroup ref="AdminProductPageOpenByIdActionGroup" stepKey="openProductEditPage">
+            <argument name="productId" value="$$createProduct.id$$"/>
         </actionGroup>
-        <click selector="{{AdminManageSwatchSection.nthChooseColor('1')}}" stepKey="clickChooseColor1"/>
-        <actionGroup ref="SetColorPickerByHexActionGroup" stepKey="fillHex1">
-            <argument name="nthColorPicker" value="1"/>
-            <argument name="hexColor" value="e74c3c"/>
+
+        <actionGroup ref="AdminAssignCategoryToProductActionGroup" stepKey="assignCategoryToProduct">
+            <argument name="categoryName" value="$$createCategory.name$$"/>
         </actionGroup>
-        <fillField selector="{{AdminManageSwatchSection.adminInputByIndex('0')}}" userInput="red" stepKey="fillAdmin1"/>
-        <waitForPageLoad stepKey="waitToClickSave"/>
 
-        <!-- Save -->
-        <click selector="{{AttributePropertiesSection.SaveAndEdit}}" stepKey="clickSaveAndEdit1"/>
-        <waitForElementVisible selector="{{AdminProductMessagesSection.successMessage}}" stepKey="waitForSuccess"/>
+        <selectOption selector="{{AdminProductFormSection.productStockStatus}}" userInput="{{ApiConfigurableProductWithDescription.status}}" stepKey="selectStockStatus"/>
 
-        <!-- Assert that the Save was successful after round trip to server -->
-        <actionGroup ref="AssertSwatchColorActionGroup" stepKey="assertSwatchAdmin">
-            <argument name="nthSwatch" value="1"/>
-            <argument name="expectedStyle" value="background: rgb(231, 77, 60);"/>
+        <actionGroup ref="AdminCreateConfigurationsForAttributeActionGroup" stepKey="createConfigurationFirst">
+            <argument name="attributeCode" value="$createVisualSwatchAttribute.attribute_code$"/>
+            <argument name="price" value="10"/>
         </actionGroup>
 
-        <!-- Create a configurable product to verify the storefront with -->
-        <actionGroup ref="AdminOpenProductIndexPageActionGroup" stepKey="amOnProductGridPage"/>
-        <click selector="{{AdminProductGridActionSection.addProductToggle}}" stepKey="clickOnAddProductToggle"/>
-        <click selector="{{AdminProductGridActionSection.addConfigurableProduct}}"
-               stepKey="clickOnAddConfigurableProduct"/>
-        <fillField userInput="{{_defaultProduct.name}}" selector="{{AdminProductFormSection.productName}}"
-                   stepKey="fillName"/>
-        <fillField userInput="{{_defaultProduct.sku}}" selector="{{AdminProductFormSection.productSku}}"
-                   stepKey="fillSKU"/>
-        <fillField userInput="{{_defaultProduct.price}}" selector="{{AdminProductFormSection.productPrice}}"
-                   stepKey="fillPrice"/>
-        <fillField userInput="{{_defaultProduct.quantity}}" selector="{{AdminProductFormSection.productQuantity}}"
-                   stepKey="fillQuantity"/>
-        <searchAndMultiSelectOption selector="{{AdminProductFormSection.categoriesDropdown}}"
-                                    parameterArray="[$$createCategory.name$$]" stepKey="fillCategory"/>
-        <click selector="{{AdminProductSEOSection.sectionHeader}}" stepKey="openSeoSection"/>
-        <fillField userInput="{{_defaultProduct.urlKey}}" selector="{{AdminProductSEOSection.urlKeyInput}}"
-                   stepKey="fillUrlKey"/>
-
-        <!-- Create configurations based on the Swatch we created earlier -->
-        <click selector="{{AdminProductFormConfigurationsSection.createConfigurations}}"
-               stepKey="clickCreateConfigurations"/>
-        <click selector="{{AdminCreateProductConfigurationsPanel.filters}}" stepKey="clickFilters"/>
-        <fillField selector="{{AdminCreateProductConfigurationsPanel.attributeCode}}" userInput="color"
-                   stepKey="fillFilterAttributeCodeField"/>
-        <click selector="{{AdminCreateProductConfigurationsPanel.applyFilters}}" stepKey="clickApplyFiltersButton"/>
-        <click selector="{{AdminCreateProductConfigurationsPanel.firstCheckbox}}" stepKey="clickOnFirstCheckbox"/>
-        <click selector="{{AdminCreateProductConfigurationsPanel.next}}" stepKey="clickOnNextButton1"/>
-        <click selector="{{AdminCreateProductConfigurationsPanel.selectAll}}" stepKey="clickOnSelectAll"/>
-        <click selector="{{AdminCreateProductConfigurationsPanel.next}}" stepKey="clickOnNextButton2"/>
-        <click selector="{{AdminCreateProductConfigurationsPanel.applyUniquePricesByAttributeToEachSku}}"
-               stepKey="clickOnApplyUniquePricesByAttributeToEachSku"/>
-        <selectOption selector="{{AdminCreateProductConfigurationsPanel.selectAttribute}}" userInput="Color"
-                      stepKey="selectAttributes"/>
-        <fillField selector="{{AdminCreateProductConfigurationsPanel.attribute1}}" userInput="10"
-                   stepKey="fillAttributePrice1"/>
-        <click selector="{{AdminCreateProductConfigurationsPanel.applySingleQuantityToEachSkus}}"
-               stepKey="clickOnApplySingleQuantityToEachSku"/>
-        <fillField selector="{{AdminCreateProductConfigurationsPanel.quantity}}" userInput="99"
-                   stepKey="enterAttributeQuantity"/>
-        <click selector="{{AdminCreateProductConfigurationsPanel.next}}" stepKey="clickOnNextButton3"/>
-        <click selector="{{AdminCreateProductConfigurationsPanel.next}}" stepKey="clickOnNextButton4"/>
-        <click selector="{{AdminProductFormActionSection.saveButton}}" stepKey="clickOnSaveButton2"/>
-        <conditionalClick selector="{{AdminChooseAffectedAttributeSetPopup.confirm}}"
-                          dependentSelector="{{AdminChooseAffectedAttributeSetPopup.confirm}}" visible="true"
-                          stepKey="clickOnConfirmInPopup"/>
-        <seeElement selector="{{AdminProductMessagesSection.successMessage}}" stepKey="seeSaveProductMessage"/>
-        <seeInTitle userInput="{{_defaultProduct.name}}" stepKey="seeProductNameInTitle"/>
-
-        <!-- Go to the product page and see swatch options -->
-        <amOnPage url="{{_defaultProduct.urlKey}}.html" stepKey="amOnProductPage"/>
-        <waitForPageLoad stepKey="waitForProductPage"/>
-
-        <!-- Verify that the storefront shows the swatches too -->
-        <actionGroup ref="AssertStorefrontSwatchColorActionGroup" stepKey="assertSwatchStorefront">
-            <argument name="nthSwatch" value="1"/>
-            <argument name="expectedRgb" value="rgb(231, 77, 60)"/>
+        <actionGroup ref="AdminSaveProductWithNewAttributeActionGroup" stepKey="saveProduct"/>
+
+        <magentoCron groups="index" stepKey="reindexInvalidatedIndices"/>
+
+        <actionGroup ref="StorefrontOpenProductPageActionGroup" stepKey="openProductPage">
+            <argument name="productUrl" value="$$createProduct.custom_attributes[url_key]$$"/>
         </actionGroup>
+        <actionGroup ref="AssertProductPageSwatchTooltipVisibleActionGroup" stepKey="assertProductPageSwatchTooltipVisible"/>
 
-        <!-- Verify swatch tooltips are visible-->
-        <moveMouseOver selector="{{StorefrontProductInfoMainSection.nthSwatchOption('1')}}" stepKey="hoverEnabledSwatch"/>
-        <wait time="1" stepKey="waitForTooltip1"/>
-        <seeElement selector="{{StorefrontProductInfoMainSection.swatchOptionTooltip}}" stepKey="swatchTooltipVisible"/>
+        <actionGroup ref="StorefrontNavigateCategoryPageActionGroup" stepKey="openCategoryPage">
+            <argument name="category" value="$$createCategory$$"/>
+        </actionGroup>
+        <actionGroup ref="StorefrontExpandFilterInLayeredNavigationActionGroup" stepKey="expandSwatchFilter">
+            <argument name="filterLabel" value="$$createVisualSwatchAttribute.attribute[default_label]$$"/>
+        </actionGroup>
+        <actionGroup ref="AssertLayeredNavigationSwatchTooltipVisibleActionGroup" stepKey="assertLayeredNavigationSwatchTooltipVisible"/>
 
-        <!-- Disable swatch tooltips -->
         <magentoCLI command="config:set catalog/frontend/show_swatch_tooltip 0" stepKey="disableTooltips"/>
         <actionGroup ref="CliCacheFlushActionGroup" stepKey="flushCacheAfterDisabling">
             <argument name="tags" value=""/>
         </actionGroup>
 
-        <!-- Verify swatch tooltips are not visible -->
-        <reloadPage stepKey="refreshPage"/>
-        <waitForPageLoad stepKey="waitForPageReload"/>
-        <moveMouseOver selector="{{StorefrontProductInfoMainSection.nthSwatchOption('1')}}" stepKey="hoverDisabledSwatch"/>
-        <wait time="1" stepKey="waitForTooltip2"/>
-        <dontSeeElement selector="{{StorefrontProductInfoMainSection.swatchOptionTooltip}}" stepKey="swatchTooltipNotVisible"/>
+        <actionGroup ref="StorefrontOpenProductPageActionGroup" stepKey="openProductPage2">
+            <argument name="productUrl" value="$$createProduct.custom_attributes[url_key]$$"/>
+        </actionGroup>
+        <actionGroup ref="AssertProductPageSwatchTooltipHiddenActionGroup" stepKey="assertProductPageSwatchTooltipHidden"/>
+
+        <actionGroup ref="StorefrontNavigateCategoryPageActionGroup" stepKey="openCategoryPage2">
+            <argument name="category" value="$$createCategory$$"/>
+        </actionGroup>
+        <actionGroup ref="StorefrontExpandFilterInLayeredNavigationActionGroup" stepKey="expandSwatchFilter2">
+            <argument name="filterLabel" value="$$createVisualSwatchAttribute.attribute[default_label]$$"/>
+        </actionGroup>
+        <actionGroup ref="AssertLayeredNavigationSwatchTooltipHiddenActionGroup" stepKey="assertLayeredNavigationSwatchTooltipHidden"/>
     </test>
 </tests>