Тестирование загрузки и обработки файлов в React - PullRequest
0 голосов
/ 01 мая 2020

У меня есть тест, который использует изображение в кодировке base64 и добавляет его в файл ввода.

  const file = await fetch("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAEKADAAQAAAABAAAAEAAAAAA0VXHyAAACv0lEQVQ4EX1TUUiTURT+fjeWmy5zbnMiodQUGUlYL8KQ0YOBsj2kuN7Kh0BYZAY+6INPJUhg8yUDU/GhKM2WW/myam2aTdoYTBctCppz5jZN15jTxdzf/a+x1KLDz+Wccw/fOef7/suwxPAfS0TCEEllyOHx/lmVczjL4cVXvsE1eBdB3yLMF5rwoLMT6Z2dw6U0PgCQ/L6O5z09GFAqYX80DtcbO5Ll5ZCn07itVuPL9PRfIFmAn8kk3vb344PZjPNTU+iccSCvogLCxka8l0hwrrUVllu98I6PHwThOODMMzTEdkhl7GooROPd3V3WarWyOp2O9fl8ezUTE+xwUzO7s7VFY+6gE7y/N4i8kydwZfoFFKWltMPy8jIKCgogEokwOTlJc6ebm5EipL4zPctOwee86GoY0YVFbNbUIMWnKcTjceTn58Pj8cDtdkOr1YJhGIirq+EbG4Na3wKBQACGzgKiJPmWlpYQCAQgFotB8hgdHcUYKS4uLobRaIRUKoWqqgoiApybm0unoCuEZmbh7u1FZjMGlUpFuzscDthsNlRWVqK7u5uCqIkSeaTrZ4sFaaIMZxTg6/w81ouKICw8BplMBrlcDr/fj1QqhbKyMgpSW1tLV4gHg3jc1oZoNPoH4FRLCwKEKIbHR1dXFwwGA7xeL2KxGAXc3t5GksjMmd9ixvH6epSUlNCYMnaUMC8hiZkBI2729cFhtyMSiUChUEAoFNJxg6SznM+D99VrKPUX6TQcAiWRc8IuF0YuXYZSp4W8oQF1dXXIIawnQiGEEwl8dDqxdn8YP8iK10xPqQIHALhgZW4OT9qvQ3REAKVGg0JCqK3jBkD+xNW1KCRnzqKdrMDJmzUq474jsbHBLlhfsiN6PfvJ6WTvaDTsQ8NVdtZkYjOZzL7KPTe7Qhbxt0Ou6Z7cW2cOX+6LfwEf3V4l4H1eEwAAAABJRU5ErkJggg==")
    .then(res => res.arrayBuffer())
    .then(buffer => new File([buffer], 'test.png', { type: 'image/png' }))

  fireEvent.change(uploadButton, { target: { files: [file] } })

Этот код вызывается при изменении:

const processFile = (selectedFile: File, setImageUpload: React.Dispatch<React.SetStateAction<File | undefined>>) => {
  const reader = new FileReader()
  reader.readAsDataURL(selectedFile)
  reader.onload = event => {
    if (typeof event.target?.result === "string") {
      const img = new Image()

      img.onload = () => onImageLoad(selectedFile, setImageUpload, img)
      img.onerror = error => console.log(error)
      img.src = event.target.result
      console.log(img.src)
    }
  }
}

Он правильно читает файл, но при этом img не вызывает ни onload, ни onerror. Это делает это до последнего console.log, и это имеет правильное значение. Я проверил результат из console.log в браузере, и он правильно отображает изображение. Этот код также работает правильно, когда я сам выполняю этот процесс, но он не работает внутри модульного теста.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...