How to use the .inside() method of the Target class?

[maciejfec2i]

Hello,

I am trying to understand how the .inside() method of the Target class works. I am attempting to use it to locate an element nested within another element, but this does not seem to be working and I am unsure whether I am using it wrong or if it's an actual issue.

To give an example, I am trying to locate the 'Add to cart' button on the 'Sauce Labs Fleece Jacket' item card

I have a Button class with a WITH_TEXT Target variable which uses an xpath locator to locate the button

import net.serenitybdd.screenplay.targets.Target;

public class Button {

    public final static Target WITH_TEXT = Target.the("'{0}' button").locatedBy("//button[. = '{0}']");
}

And I have an ItemCard class with a FOR_ITEM_WITH_NAME Target variable which again uses an xpath to locate the correct item card based on the item name

import net.serenitybdd.screenplay.targets.Target;

public class ItemCard {

    public static final Target FOR_ITEM_WITH_NAME = Target.the("item card for '{0}'").locatedBy(
            "//div[@class='inventory_item_description'][contains(., '{0}')]"
    );
}

I also have a AddToCart Task class which takes in a list of item names and attempts to click on the 'Add to cart' button for each item

import java.util.List;

public class AddToCart {

    public static Performable itemsCalled(List<String> itemNames) {

        return Task.where(
                "{0} adds the following items to the cart: " + String.join(", ", itemNames),
                user -> {
                    for(String itemName : itemNames) {
                        user.attemptsTo(
                                Click.on(Button.WITH_TEXT.of("Add to cart").inside(ItemCard.FOR_ITEM_WITH_NAME.of(itemName)))
                        );
                    }
                }
        );
    }
}

Here I am attempting to use the .inside() method to try and locate the 'Add to cart' button inside of the item card that has the desired item name
Click.on(Button.WITH_TEXT.of("Add to cart").inside(ItemCard.FOR_ITEM_WITH_NAME.of(itemName)))

I was expecting this to lead to an end locator of something along the lines of
//div[@class='inventory_item_description'][contains(., 'Sauce Labs Fleece Jacket')]//button[. = 'Add to cart']
Or
//div[@class='inventory_item_description'][contains(., 'Sauce Labs Fleece Jacket')]//descendant::button[. = 'Add to cart']

But the .inside() method in this case does not seem to do anything and only the initial Target locator is used which in this case is the locator for the 'Add to cart' button, meaning that instead of clicking on the 'Add to cart' button nested inside the correct item card, the click is just performed on the first 'Add to cart' button that is found.

This is also reflected in the Serenity report which ends up saying:
Standard User clicks on 'Add to cart' button

Whereas I was expecting something along the lines of:
Standard User clicks on 'Add to cart' button nested in item card for 'Sauce Labs Fleece Jacket'

So back to the meat and potatoes, am I just completely off the mark in terms of how this is to be used? Any guidance would be greatly appreciated.

Thank you :)

[maciejfec2i]

If anyone comes across this issue at any point: The problem was that I was missing a . in front of the // in my xpaths, so the inside method ended up looking for the element globally on the page rather than within the current context. The fix was to change the xpath from //button[. = '{0}'] to .//button[. = '{0}'] :)