Permalink
Browse files

feat(interactions): Active Wait - Screenplay-style equivalent of Prot…

…ractor's `ExpectedConditions`

You can now wait for a condition to occur before the actor proceeds with their tasks.

For example,you can wait for an element to become visible:
`Wait.upTo(Duration.ofMillis(500)).until(t: Target, Is.visible())`. C

heck out the `spec/cookbook/waiting.recipe.ts` to see other examples of usage.

Closes #7
  • Loading branch information...
jan-molak committed Dec 29, 2016
1 parent c04c5e6 commit 3db8c8ec360d58bdb1aab3ae1166a369f41487ef
Showing with 353 additions and 109 deletions.
  1. +108 −21 spec/cookbook/apps/waiting.html
  2. +197 −67 spec/cookbook/waiting.recipe.ts
  3. +48 −21 src/serenity-protractor/screenplay/interactions/wait.ts
@@ -6,37 +6,124 @@
</head>
<body ng-app="demo">
<section ng-controller="timeouts" id="timeouts" ng-cloak>
<div id="angular">
<button ng-click="ngTimeout()">Trigger Angular "$timeout"</button>
<pre ng-show="ngTimeoutWorks" class="ng-hide">Angular timeout works!</pre>
</div>
<nav>
<label>
Timeout type:
<select ng-options="timeout.type for timeout in timeouts"
ng-model="timeout" id="timeout_type"></select>
</label>
<label>
Example:
<select ng-options="example for example in examples"
ng-model="example" id="example_type"></select>
</label>
<label>
Timeout length [ms]:
<input ng-model="timeout_length" type="number" id="timeout_length" />
</label>
<button ng-click="trigger()">Trigger</button>
</nav>
<hr />
<div id="example" ng-include="example" />
<div id="setTimeout">
<button ng-click="jsTimeout()">Trigger JavaScript "setTimeout"</button>
<pre ng-show="jsTimeoutWorks" class="ng-hide">JavaScript timeout works!</pre>
</div>
</section>
<script type="text/ng-template" id="Visible">
<pre ng-show="triggered" class="result ng-hide">{{ result }}</pre>
</script>
<script type="text/ng-template" id="Invisible">
<pre ng-hide="triggered" class="result">{{ result }}</pre>
</script>
<script type="text/ng-template" id="Present">
<pre ng-if="triggered" class="result">{{ result }}</pre>
</script>
<script type="text/ng-template" id="Stale">
<pre ng-if="! triggered" class="result">{{ result }}</pre>
</script>
<script type="text/ng-template" id="Selected">
<label>
{{ result }}
<input type="checkbox" ng-model="triggered" class="result" />
</label>
</script>
<script type="text/ng-template" id="Clickable">
<label>
{{ result }}
<input type="checkbox" ng-disabled="! triggered" class="result" />
</label>
</script>
<script>
angular.module('demo', []).controller('timeouts', ['$scope', '$timeout', function ($scope, $timeout) {
angular.module('demo', []).controller('timeouts', ['$scope', '$timeout', '$interval',
function ($scope, $timeout, $interval) {
$scope.ngTimeoutWorks = false;
$scope.ngTimeout = () => {
$timeout(() => {
$scope.ngTimeoutWorks = true;
}, 500);
};
function resetExample() {
$scope.triggered = false;
$scope.result = 'Not triggered yet';
}
$scope.examples = [
'Visible',
'Invisible',
'Present',
'Stale',
'Selected',
'Clickable'
];
$scope.example = $scope.examples[0];
$scope.jsTimeoutWorks = false;
$scope.jsTimeout = () => {
setTimeout(function () {
$scope.jsTimeoutWorks = true;
$scope.$apply();
}, 500);
$scope.timeout_length = 500;
$scope.timeouts = [
{
type: 'setTimeout',
fn: function() {
setTimeout(function() {
$scope.result = "Triggered!";
$scope.triggered = true;
$scope.$apply();
}, $scope.timeout_length)
}
},
{
type: '$timeout',
fn: function() {
$timeout(function() {
$scope.result = "Triggered!";
$scope.triggered = true;
}, $scope.timeout_length)
}
},
{
type: '$interval',
fn: function() {
$interval(function() {
$scope.result = "Triggered!";
$scope.triggered = true;
}, $scope.timeout_length, 0)
}
}
];
$scope.timeout = $scope.timeouts[0];
$scope.trigger = function() {
$scope.timeout.fn();
};
$scope.$watchGroup(['example', 'timeout', 'timeout_length'], resetExample);
resetExample();
}]);
</script>
</body>
Oops, something went wrong.

0 comments on commit 3db8c8e

Please sign in to comment.