import {Target} from '@serenity-js/protractor/lib/screenplay/questions/targets'
public class | source

Target

Provides a convenient way to retrieve a single web element or multiple web elements, so that they can be used with Serenity/JS Interactions.

Check out the examples below, as well as the unit tests demonstrating the usage.

Examples:

Imaginary website under test
 <body>
     <ul id="basket">
         <li><a href="#">Apple</a></li>
         <li><a href="#">Banana</a></li>
         <li><a href="#">Coconut</a></li>
     </ul>
     <div id="summary"><strong class="out-of-stock">Coconut</strong> is not available</div>
     <button type="submit">Proceed to Checkout</button>
 </body>
Locating a single element
 import { Target } from '@serenity-js/protractor';
 import { by } from 'protractor';

 const proceedToCheckoutButton =
     Target.the('Proceed to Checkout button').located(by.css(`button[type='submit']`));
Locating multiple elements
 import { Target } from '@serenity-js/protractor';
 import { by } from 'protractor';

 const basketItems =
     Target.all('items in the basket').located(by.css('ul#basket li'));
Locating element relative to another element
 import { Target } from '@serenity-js/protractor';
 import { by } from 'protractor';

 const summary =
     Target.the('summary').located(by.id('message'));

 const outOfStockItem =
     Target.the('out of stock item').of(summary).located(by.css('.out-of-stock'))
Clicking on an element
 import { actorCalled } from '@serenity-js/core';
 import { BrowseTheWeb, Click } from '@serenity-js/protractor';
 import { protractor } from 'protractor';

 actorCalled('Jane')
     .whoCan(BrowseTheWeb.using(protractor.browser))
     .attemptsTo(
         Click.on(proceedToCheckoutButton),
     );
Retrieving text of multiple elements and performing an assertion
 import { Ensure, contain } from '@serenity-js/assertions';
 import { actorCalled } from '@serenity-js/core';
 import { BrowseTheWeb, Click, Text } from '@serenity-js/protractor';
 import { protractor } from 'protractor';

 const basketItemNames = Text.ofAll(basketItems);

 actorCalled('Jane')
     .whoCan(BrowseTheWeb.using(protractor.browser))
     .attemptsTo(
         Ensure.that(basketItemNames, contain('Apple'))
     );
Waiting on an element
 import { actorCalled } from '@serenity-js/core';
 import { BrowseTheWeb, Click, Text, Wait, isClickable } from '@serenity-js/protractor';
 import { protractor } from 'protractor';

 actorCalled('Jane')
     .whoCan(BrowseTheWeb.using(protractor.browser))
     .attemptsTo(
         Wait.until(proceedToCheckoutButton, isClickable()),
     );

Tests:

Static Method Summary

Static Public Methods
public static

all(name: string): TargetBuilder<TargetElements> & NestedTargetBuilder<TargetNestedElements>

Locates a group of web elements

public static

the(name: string): TargetBuilder<TargetElement> & NestedTargetBuilder<TargetNestedElement>

Locates a single web element

Static Public Methods

public static all(name: string): TargetBuilder<TargetElements> & NestedTargetBuilder<TargetNestedElements> source

Locates a group of web elements

Params:

NameTypeAttributeDescription
name string

A human-readable name of the elements to be used in the report

Returns:

TargetBuilder<TargetElements> & NestedTargetBuilder<TargetNestedElements>

public static the(name: string): TargetBuilder<TargetElement> & NestedTargetBuilder<TargetNestedElement> source

Locates a single web element

Params:

NameTypeAttributeDescription
name string

A human-readable name of the element to be used in the report

Returns:

TargetBuilder<TargetElement> & NestedTargetBuilder<TargetNestedElement>