Photographer sometimes takes photos of wrong browser

[xela1601]

Hello serenity team,

we're using webdriverio, serenity-js & cucumber for our testing and have 2 Actors "Customer" and "StoreManager" which are using their own browsers respectively. The Photographer is configured in a way, where he only takes Photos/Screenshots when some instruction is failing. Somehow we have some scenario which is failing from time to time which involves both actors and fails at an instruction of the StoreManager but takes an Photo of the Customer's browser.
Is this a bug or do we maybe have configured something wrong?
Let me know if you need any further information. Thanks alot!

[jan-molak]

Hi @xela1601! The Photographer takes photos of whatever actor is "in the spotlight", i.e. the most recently accessed Actor instance.

If this is not the behaviour you're seeing, it would be really helpful if you could try and reproduce the issue using one of the official Serenity/JS templates, for example, this one with Serenity/JS, Cucumber and WebdriverIO (if you're using the latest Serenity/JS 3.0 please use the main branch).

If you're saying that this issue happens only sporadically and non-deterministically, my first suspicion would be synchronisation - in particular, remember to always await the Promise returned by actorCalled(...).attemptsTo(...).

For example:

Given('{actor} and {actor}', async (actor1: Actor, actor2: Actor) => {
  await actor1.attemptsTo(...);
  
  await actor2.attemptsTo(...);
})

[xela1601]

Hey @jan-molak and thanks for reaching back,

I guess the error would principally occur all the time but it is failing non-deterministic, so we also see the wrong screenshots non-deterministically (because they are only being made when there's a failed test instruction).

However I wanted to share the code of the failing Interaction.
Some context, that you maybe need to understand what we do here:
The Customer has a Basket, where he has added items to.
The most recent added item "scannedItem" should then be visible to the StoreManager in the "basketChangedItems".
So there are 2 different actors involved in one Question, which is being awaited until it is true. The actor with the variable "actor" comes from the Then('{actor} ...")-expression, while the other is accessed through actorCalled(). However we need only the screenshot of the actor not the actorCalled(Actors.Customer)

Wait.upTo(Duration.ofSeconds(config.defaultE2ETimeout)).until(
            Question.about(
                `most recent cart product exists as basket changed item in history of session monitor details`,
                async (actor) => {
                    const scannedItem = await Basket.mostRecentItemModel().answeredBy(actorCalled(Actors.Customer));
                    const historyItems = await SessionMonitorDetails.GetHistoryItems().answeredBy(actor);
                    const basketChangedItems = historyItems.filter((item) => item instanceof BasketChangeItem) as BasketChangeItem[];
                    const match = basketChangedItems.find(
                        async (item) =>
                            (await item.name().answeredBy(actor)) === scannedItem.name &&
                            (await item.totalAmount().answeredBy(actor)) === scannedItem.amount,
                    );
                    if (match) {
                        const changedAmount = await match.changedAmount().answeredBy(actor);
                        await Log.the(
                            `Found matching history item for scanned item "${scannedItem.toString()}" with +${changedAmount} increase`,
                        ).performAs(actor);
                        return true;
                    }
                    return false;
                },
            ),
            isTrue(),
)

Maybe this helps to resolve the issue.

Kind regards
Alex