Cypress在规范文件之间共享数据(别名)

Question

我需要使用在其他测试中拦截cy.wait(@..(后获得的别名(不同文件中的(，但我不确定如何做到这一点。

然而，如果将数据保存在plugins/config空间中，然后使用cy.task提取数据，似乎是可能的。但我不知道该怎么做。也许有人可以帮我？

我正在拦截此请求cy.intercept('POST', '**/quotes').as('abccreateQuote')

同时，我得到了响应体中的报价Id。

cy.wait('@createQuote').then(({ response }) => {
if (response?.statusCode === 201) {
cy.wrap(response.body.data.id).as('abcQuoteId')
}  
})

我需要在不同的测试中使用这个abcQuoteId别名，并将其定位在不同的文件中。

访问页面cy.visit(`quotes/${abcQuoteId}/show`)

Answer 1

一个任务可以做到这一点，但如果你写一个fixture文件，代码会更少

cy.wait('@createQuote').then(({ response }) => {
if (response?.statusCode === 201) {
cy.writeFile('./cypress/fixtures/abcQuoteId.json', {abcQuoteId: response.body.data.id})
}  
})

与任务相比，您可以手动检查夹具文件，以防出现拼写错误，应该如下所示：

{
"abcQuoteId": 123
}

并像这个一样使用它

cy.fixture('abcQuoteId.json')
.then(fixture => {
const url = `quotes/${fixture.abcQuoteId}/show`
console.log(url)                                  // quotes/123/show
cy.visit(url)
})

Answer 2

这将允许您创建具有在Cypress运行时始终可用的值的无限存储。

具有其值的每个存储在所有等级库文件之间都可用。

用法：

节省一些价值：

// spec.file1.js
cy.wait('@createQuote').then(({ response }) => {
if (response?.statusCode === 201) {
cy.task('setItem', {
storeId: 'Global',
item: {
name: 'createQuoteResponse',
value: response.body.data.id,
},
})
}  
})

在另一个规范文件中获取上述值：

// spec.file2.js
cy.task('getItem', {
storeId: 'Global',
item: {
name: 'createQuoteResponse',
},
}).then((item) => {
console.log(item) // Your response code
})

如何实施

编辑：安装柏树商店插件

npm install @optimumqa/cypress-store

编辑结束

可能看起来像是很多代码，事实确实如此。但一旦设置好，你就不必修改或担心了。

创建一个./cypress/plugins/Store.js文件并粘贴以下代码：

// `./cypress/plugins/Store.js`
const StoreHelper = require('../support/Store')
const stores = {}
class Store {
constructor(on, config, pluginConfig) {
this.CONFIG = {
...{
logging: false,
},
...(pluginConfig || {}),
}
this.init(on, config, pluginConfig)
}
init(on, config, pluginConfig) {
on('task', {
/**
* @description - Store items to specific store. If store does not exist, it will be created
*
* @param {String} data.id - Store id
* @param {Object} data.item - Object containing item info
* @param {String} data.item.name - Item name
* @param {Any} data.item.value - Item value
*
* @returns {Store.Item|Null}
*/
setItem: (data) => {
let store = stores[data.storeId]
if (!store) {
stores[data.storeId] = new StoreHelper()
store = stores[data.storeId]
}
return store.setItem(data.item) || null
},
/**
* @description - Get items from specific store
*
* @param {String} data.id - Store id
* @param {Object} data.item - Object containing item info
* @param {String} data.item.name - Item name
*
* @returns {Store.Item|Null}
*/
getItem: (data) => {
const store = stores[data.storeId]
if (store) {
return store.getItem(data.item)
}
return null
},
})
}
}
module.exports = Store

然后再创建一个其他文件./cypress/support/Store.js，并在其中粘贴以下代码：

// `./cypress/support/Store.js`
class Store {
constructor() {
/** @type {object} */
this.items = {}
return this
}
getItem(data = {}) {
return this.items[data.name] || null
}
setItem(data = {}) {
this.items[data.name] = new Item(data)
return this.items[data.name]
}
}
class Item {
constructor(data = {}) {
this.name = data.name || ''
this.value = data.value || undefined
return this
}
}
module.exports = Store

赛普拉斯<v10

在你的./cypress/plugins/index.js中需要这样的插件：

您需要从plugins/获得Store文件。

// `./cypress/plugins/index.js`
module.exports = (on, config) => {
require('./Store')(on, config)
}

柏树>=v10

// `./cypress.config.js`
const { defineConfig } = require('cypress')
const Store = require('./cypress/plugins/Store')
module.exports = defineConfig({
e2e: {
setupNodeEvents(on, config) {
Store(on, config)    
},
},
})

默认情况下，这在柏树样板中启用