如何在量角器中更改浏览器日期 [英] How to change the browser date in protractor
问题描述
我的用例是我有一个 UI,它阻止操作 B,除非操作 A 发生在上一个日历月(会计生命周期疯狂 - 无关紧要).
My use case is that I have a UI which prevents operation B unless operation A happenned in the previous calendar month (accounting lifecycle madness - does not matter).
我正在编写一个测试来验证操作 B 是否正常工作,但除非我有上个月发生的操作 A,否则我无法执行操作 B 是否正常工作.我的量角器设置在真实 API 之上运行,模拟数据不是我会考虑的选项(当然,如果我选择模拟 API 响应,这会更容易).
I am writing a test that verifies operation B is working correctly, but I cannot perform operation B is working unless I have operation A that occured last month. My protractor setup runs on top of real APIs, and mocking data is not an option that I will consider (granted if I chose to mock API responses this would be easier).
API 不允许我操纵操作 A 的创建/更新日期,因此我测试此场景的选项是操纵底层数据库或在测试时将浏览器推送到下个月.假设我想采用浏览器方法,我怎样才能使用量角器来实现它?
The APIs do not allow me to manipulate the created/update dates of operation A, so my options to test this scenario are to manipulate the underlying DB or to push the browser into the next month while testing. Assuming I want to take the browser approach, how can I get this working with protractor?
推荐答案
一旦我有了操纵浏览器时间的机制,那么我选择的解决方案是启动一个场景,执行操作 A,将浏览器时间提前到一个月未来,然后执行操作B.
Once I have a mechanism to manipulate browser time, then the solution I chose was to start a scenario, perform operation A, advance the browser time to one month in the future, then perform operation B.
这涉及使用量角器 browser.executeScript
在浏览器上下文中运行 JS,并使用 timeshift-js 模块.
This involved using protractors browser.executeScript
to run JS in the browser context, and override the JS Date object using the timeshift-js module.
这是代码
此代码正在使用:
- 角度:1.5.10
- 量角器:5.1.2
- cucumber-js: 1.3.3
- timeshift-js:1.0.1
我可以写这样的场景:
Feature: Travelling in time
Scenario: Scenario that manipulates time
When I view some page
And I check what time it is
And I do operation A
And I advance the browser by 1 days
And I check what time it is
Then I can do operation B
Scenario: Scenario Double Check that the next scenario gets the correct time
When I view the list of maintenance requests
And I check what time it is
这是步骤实现.这里没有任何特定于黄瓜的内容,因此它应该很容易适应基于 jasmine 或 mocha 的 describe/it 框架:
And here is the step implementation. There is nothing here cucumber specific so it should be easy to adapt to a jasmine or mocha based describe/it framework:
const timeShiftLibraryString = fs.readFileSync(`path/to/node_modules/timeshift-js/timeshift.js`, 'utf-8')
module.exports = function () {
this.When(/I advance the browser by (-?[0-9]+) (day|month)s?$/, function (offset, unit) {
const now = moment()
const future = moment().add(offset, unit)
const amountOfMillisecondsToAdvanceBrowser = (future.unix() - now.unix()) * 1000
const tolerance = 15 * 1000
const advanceTime = function (futureOffsetInMilliseconds, timeShiftLibraryString) {
// these two lines are only necessary because I dont want Timeshift in my production code, only during test
const timeshiftLibrary = new Function(timeShiftLibraryString)
timeshiftLibrary.call(window)
Date = window.TimeShift.Date
window.TimeShift.setTime(Date.now() + futureOffsetInMilliseconds)
return Date.now()
}
return browser.executeScript(advanceTime, amountOfMillisecondsToAdvanceBrowser, timeShiftLibraryString).then((browserTime) => {
const expectedTime = Date.now() + amountOfMillisecondsToAdvanceBrowser - tolerance
this.logger.debug(`Time manipulation complete: browserTime = ${moment(browserTime)}`)
if (browserTime >= expectedTime) {
return Promise.resolve(browserTime)
}
return Promise.reject(new Error(`advanceTime did not work: reported browserTime: ${browserTime}. Expected Time: ${expectedTime}`))
})
})
this.When(/I check what time it is/, function () {
const whatTimeIsItInTheBrowser = function () {
return Date.now()
}
return browser.executeScript(whatTimeIsItInTheBrowser).then((browserTime) => {
console.log(`Browser Time = ${moment(browserTime)}`)
})
})
}
注意事项:
- 棘手的部分是序列化 timeshift-js 库.我不想将它与我的应用程序打包在一起,所以这意味着我必须在测试期间按需注入它
- 除非您明确使用 https://github.com/angular/protractor/blob/master/docs/faq.md#how-can-i-get-保持浏览器控制台
- 在您完成至少一个页面获取之前,您无法操纵浏览器时间,浏览器需要加载一些 HTML 和 JS 才能在浏览器 JS 上下文中操纵日期
这篇关于如何在量角器中更改浏览器日期的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!