testing - 需要为 Cypress 测试的图像创建代理

Question

我遇到了一个问题，即通过从浏览器调用静态文件夹中的图像的外部 URL 替换对外部图像的一些请求。假设从本地文件夹上传特定图像(通过蒙版)的想法。我的图片因为有很多而被加载的想法已经过时了，这就是为什么我想将对这些图片的许多请求模拟为只有一张图片。

我为此创建了正则表达式，主要问题是等待响应。我得不到结果，我的测试在等待响应的那个阶段被打破了。对图像的请求由前端触发，即由浏览器触发

beforeEach(() => {
const BASE_URL = 'http://localhost:8080'
cy.fixture(FIXTURES_FOLTER.imagePath).as('image')
cy
        .server()
        .route({
          method: 'GET',
          response: '@image',
          status: 200,
          url: new RegExp(/https?:\/\/(www\.)?shutterstock\.com\/image-photo/),
        })
        .as('images')

      cy.visit(`${ BASE_URL }`)

      cy.wait('@images')
    })

Answer 1

https://docs.cypress.io/api/commands/fixture.html#Images

看起来您可能必须执行以下操作:

cy.fixture(FIXTURES_FOLTER.imagePath).then(base64Image => {
  cy.route({
  method: 'GET',
      response: base64Image,
      status: 200,
      url: new RegExp(/https?:\/\/(www\.)?shutterstock\.com\/image-photo/),
    })
 })