feat(screenplay): WebElement Question

Together with Chai Smoothie, the WebElement Question will help your actors verify the visibility of

a given element on screen.

behaviour/expect.ts

@@ -1,5 +1,6 @@
 import chai = require('chai');
 
 chai.use(require('chai-as-promised'));  // tslint:disable-line:no-var-requires
+chai.use(require('chai-smoothie'));     // tslint:disable-line:no-var-requires
 
 export = chai.expect;

behaviour/protractor/interactions/checking_visibility.ts

@@ -0,0 +1,20 @@
+import { BrowseTheWeb, Open, WebElement } from '../../../src/serenity-protractor/screenplay';
+import { Actor } from '../../../src/serenity/screenplay';
+import { DemoApp } from './ui/demo_app';
+
+import { protractor } from 'protractor/globals';
+
+import test = require('selenium-webdriver/testing');
+
+import expect = require('../../expect');
+
+test.describe ('Interactions', () => {
+
+    let james = Actor.named('James').whoCan(BrowseTheWeb.using(protractor.browser));
+
+    test.it ('should allow to check the visibility of a web element', () =>
+        james.attemptsTo(
+            Open.browserOn('resources/index.html')
+        ).then(() =>
+            expect(james.toSee(WebElement.of(DemoApp.Header))).displayed));
+});

package.json

@@ -44,6 +44,7 @@
   "devDependencies": {
     "chai": "3.5.0",
     "chai-as-promised": "5.3.0",
+    "chai-smoothie": "^0.1.2",
     "commitizen": "2.8.5",
     "coveralls": "2.11.12",
     "cucumber": "1.2.2",

src/serenity-protractor/screenplay/questions/index.ts

@@ -2,4 +2,5 @@ export * from './attribute';
 export * from './selected_value';
 export * from './text';
 export * from './value';
+export * from './web_element';
 export * from './website';

src/serenity-protractor/screenplay/questions/web_element.ts

@@ -0,0 +1,19 @@
+import { Question, UsesAbilities } from '../../../serenity/screenplay';
+import { BrowseTheWeb } from '../abilities/browse_the_web';
+import { Target } from '../ui/target';
+
+import { ElementFinder } from 'protractor';
+
+export class WebElement implements Question<ElementFinder> {
+
+    static of(target: Target) {
+        return new WebElement(target);
+    }
+
+    answeredBy(actor: UsesAbilities) {
+        return BrowseTheWeb.as(actor).locate(this.target);
+    }
+
+    constructor(private target: Target) {
+    }
+}