如何在 cypress 测试文件中将文档添加到 MongoDb 数据库中？答案

【问题标题】：How add documents into a MongoDb database in a cypress test file?如何在 cypress 测试文件中将文档添加到 MongoDb 数据库中？
【发布时间】：2022-06-18 21:00:21
【问题描述】：

我正在为一个网页编写 cypress 测试，该网页显示顶部带有过滤器的帖子列表。

但是要显示帖子列表，数据库中必须存在一些文档，以便我可以检查它们是否按要求显示。

如何在测试文件中添加一些文档，例如在beforeEach() 函数中？

这是posts-summary-test.ts文件的代码：

describe('posts summary page', () => {
    beforeEach(() => {
        cy.visit('/postssummary');
        cy.wait(2000);
    });
    it('posts must be displayed in descending order of posted time',() => {
        cy.findByLabelText(.......
        ......
        ......
        ......
    )};
)};

在这个文件中，我可以在哪里添加一些文档来测试网页？

【问题讨论】：

标签： mongodb spring-boot cypress cypress-component-test-runner cypress-testing-library

【解决方案1】：

听起来您正在寻找Cypress Fixtures。

这是一种方法，您可以在其中定义一些静态信息以进行测试。因此，您可以在您的网站上加载您的内容并检查它是否与您的设备中的信息相匹配，而不是从数据库中获取它。

注意不要让你正在测试的东西“弧度太大”，因为这会让你更难知道是什么坏了以及如何解决它。

如果你真的想从你的数据库中加载内容，直接测试，那么我建议你制作一个脚本来生成固定装置。但我不会在 Cypress 中这样做。

【讨论】：

当从fixture 获取数据以替代对后端的调用时，您还需要使用intercept。
类似这样的东西：cy.fixture('postTestData').then((json) => { cy.intercept('GET', '/posts/**', json) })

【解决方案2】：

有几种可能的方法：

如果测试的应用程序有一个用于添加帖子的 API，您可以在 before 处理程序中调用此 API，从而填充数据库。
使用cy.task 调用代码来填充您的数据库，如Cypress documentation 中所述或遵循此Cypress example code。
当您的测试在管道中运行（例如由 Azure DevOps 或 Jenkins 提供）时，您可以使用您喜欢的任何技术添加一个数据库设置步骤，这样您就不受节点执行环境的限制。

【讨论】：

【解决方案3】：

这里有一个例子bahmutov/cypress-example-mongodb

describe('posts summary page', () => {
  before(() => {
    cy.task('clearDb')
    cy.request('POST', '/post', {  // whatever url your app uses to add  
      // data for post
    })
  })
  beforeEach(() => {
    cy.visit('/postssummary');
  })
  it('posts must be displayed in descending order of posted time',() => {
    ...

在/cypress/plugins/index.js添加清空db的任务

/// <reference types="cypress" />

const { MongoClient } = require('mongodb')

const uri = process.env.MONGO_URI
if (!uri) {
  throw new Error('Missing MONGO_URI')
}

const client = new MongoClient(uri)
async function connect() {
  // Connect the client to the server
  await client.connect()
  return client.db('mydb')
}

module.exports = async (on, config) => {
  const db = await connect()
  const posts = db.collection('posts')

  on('task', {
    async clearDb() {
      await posts.remove({})
      return null
    },
  })
}

【讨论】：

【解决方案4】：

你可以试试这个插件：https://www.npmjs.com/package/cypress-mongodb

它易于设置，并为您提供使用 mongodb 的命令列表

【讨论】：