feat(Clock): Add ability to automatically tick the clock asynchronously
Testing with mock clocks can often turn into a real struggle when
dealing with situations where some work in the test is truly async and
other work is captured by the mock clock. This can happen for many
reasons, but as one example:
An asynchonrous change from a task in the mocked clock may change DOM where
a resize observer then gets triggered. This browser API is truly asynchronous
and would require the user to wait real time for it to fire. If there is
follow-up work after the resize observer fires, it may be captured by the mock
clock again. This would require the tester to write something like the
following:
```
// flush the timer
jasmine.clock().tick();
// wait for resize observer
await new Promise(resolve => setTimeout(resolve));
// flush follow-up work from the resize observer callback
jasmine.clock().tick();
```
When using mock clocks, testers are always forced to write tests with intimate
knowledge of when the mock clock needs to be ticked. Oftentimes, the
purpose of using a mock clock is to speed up the execution time of the
test when there are timeouts involved. It is not often a goal to test
the exact timeout values. This can cause tests to be riddled with
`tick`. It ideal for test code to be written in a way
that is independent of whether a mock clock is installed. For example:
```
document.getElementById('submit');
// https://testing-library.com/docs/dom-testing-library/api-async/#waitfor
await waitFor(() => expect(mockAPI).toHaveBeenCalledTimes(1))
```
When mock clocks are involved, the above may not be possible if there is
some delay involved between the click and the request to the API.
Instead, developers would need to manually tick the clock beyond the
delay to trigger the API call.
This commit attempts to resolve these issues by adding a feature to the
clock which allows it to advance on its own with the passage of time,
just as clocks do without mocks installed. It also allows for some
breathing time so any unmocked micro and macrotasks are given space to
execute as well.
This feature would also address both #1725 and #1932. `asyncTick` can be
accomplished by enabling the auto tick feature and then waiting for a
promise with a timout to be resolved
(`await new Promise(resolve => setTimeout(resolve, 20))`) where
`setTimeout` is captured by the mock clock and flushed while the code is
waiting for the promise to resolve.
resolves #1725
resolves #1932
All credit goes to @stephenfarrar for this.
This commit is contained in:
@@ -87,6 +87,37 @@ getJasmineRequireObj().DelayedFunctionScheduler = function(j$) {
|
||||
}
|
||||
};
|
||||
|
||||
// Returns whether there are any scheduled functions.
|
||||
// Returns true if there are any scheduled functions, otherwise false.
|
||||
this.isEmpty = function() {
|
||||
return this.scheduledFunctions_.length === 0;
|
||||
};
|
||||
|
||||
// Runs the next timeout in the queue, advancing the clock.
|
||||
this.runNextQueuedFunction = function(tickDate) {
|
||||
if (this.scheduledLookup_.length === 0) {
|
||||
return;
|
||||
}
|
||||
|
||||
const newCurrentTime = this.scheduledLookup_[0];
|
||||
if (newCurrentTime >= this.currentTime_) {
|
||||
tickDate(newCurrentTime - this.currentTime_);
|
||||
this.currentTime_ = newCurrentTime;
|
||||
}
|
||||
|
||||
const funcsAtTime = this.scheduledFunctions_[this.currentTime_];
|
||||
const fn = funcsAtTime.shift();
|
||||
if (funcsAtTime.length === 0) {
|
||||
delete this.scheduledFunctions_[this.currentTime_];
|
||||
this.scheduledLookup_.splice(0, 1);
|
||||
}
|
||||
|
||||
if (fn.recurring) {
|
||||
this.reschedule_(fn);
|
||||
}
|
||||
fn.funcToCall.apply(null, fn.params || []);
|
||||
};
|
||||
|
||||
return this;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user