<?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="OpenSwatchMenuAndChooseColorByIndexActionGroup">
        <annotations>
            <description>Open the Swatch Menu and choose color based on the provided Index.</description>
        </annotations>
        <arguments>
            <argument name="index" type="string" defaultValue="0"/>
        </arguments>

        <!-- I had to use executeJS to perform the click to get around the use of CSS ::before and ::after -->
        <executeJS function="jQuery('#swatch-visual-options-panel > table > tbody > tr:nth-child({{index}}) > td.swatches-visual-col.col-default input').click()" stepKey="clickSwatch"/>
        <click selector="{{AdminManageSwatchSection.nthChooseColor(index)}}" stepKey="clickChooseColor"/>
    </actionGroup>
</actionGroups>
